graphql代理-无法连接到websocket

Question

我对整个graphql非常陌生，并且尝试创建订阅，但是当我尝试运行其中一个订阅时，我会看到下面的错误

无法连接到websocket端点ws://localhost:3000/graphql。请检查端点url是否正确。

下面的示例是在这个https://www.apollographql.com/docs/apollo-server/data/subscriptions中，目前我的代码如下所示

const { createServer } = require('http')
const express = require('express')
const { ApolloServer } = require('apollo-server-express')
const { ApolloServerPluginDrainHttpServer } = require('apollo-server-core')
const { PubSub } = require('graphql-subscriptions')
const { WebSocketServer } = require('ws')
const { useServer } = require('graphql-ws/lib/use/ws')
const { env } = require('../config/index')
const schema = require('./schema')
const models = require('../db/models')
const getAuthUser = require('../utils/authorization')

const pubSub = new PubSub()
const app = express()
const httpServer = createServer(app)
const wsServer = new WebSocketServer({ server: httpServer, path: '/graphql' })
const serverCleanup = useServer({ schema }, wsServer)
const server = new ApolloServer({
    schema,
    csrfPrevention: true,
    cache: 'bounded',
    plugins: [
        // Proper shutdown for the HTTP server.
        ApolloServerPluginDrainHttpServer({ httpServer }),

        // Proper shutdown for the WebSocket server.
        {
            async serverWillStart() {
                return {
                    async drainServer() {
                        await serverCleanup.dispose()
                    },
                }
            },
        },
    ],
    playground: env.development,
    context: async ({ req }) => {
        const token = req.headers.authorization
        const user = getAuthUser(token)
        return { models, user, pubSub }
    },
})
server.applyMiddleware({ app })
server.installSubscriptionHandlers(httpServer)
module.exports = { server, httpServer }

在另一个文件中，我有httpServer.listen(port)提供任何提示或解释为什么会发生这种情况？

Answer 1

试试这个方法https://github.com/iam-hussain/gql-server/blob/master/src/providers/Engine.ts

import express from "express";
import http from "http";
import { ApolloServer } from "apollo-server-express";
import { ApolloServerPluginDrainHttpServer } from "apollo-server-core";
import { makeExecutableSchema } from '@graphql-tools/schema';
import { WebSocketServer } from 'ws';
import { useServer } from 'graphql-ws/lib/use/ws';

import typeDefs from "../graphql/schema/index";
import resolvers from "../graphql/resolvers/index";
import context from "../graphql/context";
import { PORT } from "./Configs";

const schema = makeExecutableSchema({
  typeDefs,
  resolvers,
});

const serverInit = async () => {
  let app = express();

  // HTTP :: Creating HTTP server...
  const httpServer = http.createServer(app);
  // WebSocketServer :: Creating web socket server...
  const wsServer = new WebSocketServer({
    port: 4000,
    path: '/graphql',
  });
  // Save the returned server's info so we can shut down this server later
  const serverCleanup = useServer({ schema }, wsServer);
  
  // Apollo :: Creating Apollo server...
  const server = new ApolloServer({
    schema,
    context,
    plugins: [ApolloServerPluginDrainHttpServer({ httpServer }), {
      async serverWillStart() {
        return {
          async drainServer() {
            await serverCleanup.dispose();
          },
        };
      },
    }],
  });

  // Apollo :: Staring Apollo server...
  await server.start();
  server.applyMiddleware({
    app,
    path: "/graphql",
  });

  app.listen(PORT, () => {
    console.log(` GraphQL ready at http://localhost:${PORT}${server.graphqlPath}`);
    return console.log(`Listening :: Server is running @ ${PORT}`);
  });

  return app;
};


serverInit();

参考资料：

https://github.com/iam-hussain/gql-server

• Frontend：https://github.com/iam-hussain/next-client

• 后端