GraphQL 订阅 - subscriptionsClient.subscribe 不是函数

Posted

技术标签:

【中文标题】GraphQL 订阅 - subscriptionsClient.subscribe 不是函数【英文标题】:GraphQL Subscriptions - subscriptionsClient.subscribe is not a function 【发布时间】:2019-03-06 18:54:34 【问题描述】:

所以,我正在尝试创建一个基本的 GraphQL 订阅服务器。请求中的问题导致graphiql。它是-“subscriptionsClient.subscribe 不是函数”。我不明白哪里出了问题。

对于我使用过的 GraphQL 订阅服务器:graphql-server-express, 订阅-传输-ws,graphql-订阅

所以,这是你的任务,GraphQL 大师。

代码:

index.js

const  createServer  = require('http')
const app = require('express')();
const bodyParser = require('body-parser')
const  graphqlExpress, graphiqlExpress  = require('graphql-server-express')
const  SubscriptionServer  = require('subscriptions-transport-ws')
const  subscribe, execute  = require('graphql');
const schema = require('./schema');

app.use(bodyParser.json());
app.use('/graphql', new graphqlExpress(
  schema
));
app.use('/graphiql', new graphiqlExpress(
  endpointURL: '/graphql',
  subscriptionsEndpoint: 'ws://localhost:4000/subscriptions'
));

const server = createServer(app);

server.listen(4000, () => 
  console.log("Server is listening on port 4000!");

  subscriptionServer = SubscriptionServer.create(
    
      schema,
      execute,
      subscribe,
      onConnect: () => console.log("Client connected!")
    , 
      server,
      path: '/subscriptions'
    
  );
);

schema.js

const 
  GraphQLSchema,
  GraphQLObjectType,
  GraphQLNonNull,
  GraphQLList,
  GraphQLID,
  GraphQLString
 = require('graphql');
const  PubSub, withFilter  = require('graphql-subscriptions');
const socket = new PubSub();
const store = [];
const NameType = new GraphQLObjectType(
  name: "Name",
  fields: 
    id:  type: GraphQLID ,
    name:  type: GraphQLString 
  
);
const RootQuery = new GraphQLObjectType(
  name: "RootQuery",
  fields: 
    names: 
      type: new GraphQLList(NameType),
      resolve: () => store
    
  
);
const RootMutation = new GraphQLObjectType(
  name: "RootMutation",
  fields: 
    addName: 
      type: NameType,
      args: 
        name:  type: new GraphQLNonNull(GraphQLString) 
      ,
      resolve(_,  name ) 
        let model = 
          id: store.length,
          name
        
        socket.publish("names", model);
        store.push(model);
        return model;
      
    
  
);
const RootSubscription = new GraphQLObjectType(
  name: "RootSubscription",
  fields: 
    names: 
      type: NameType,
      resolve() 
        console.log("IS RUNNING");
      ,
      subscribe: withFilter(() => pubsub.asyncIterator("names"), (payload, variables) => 
        return payload.names.id === variables.relevantId;
      )
    
  
);
module.exports = new GraphQLSchema(
  query: RootQuery,
  mutation: RootMutation,
  subscription: RootSubscription
);

【问题讨论】:

【参考方案1】:

好的,事情就是这样。

我使用 Apollo-Server 创建了一个完全响应的 GraphQL 订阅服务器。 只需使用 apollo-server-expressapollo-server 包来完成此任务。 ApolloServer 提供支持订阅的 GraphQL Playground。所以很容易在前端调试和使用。

祝你好运!

【讨论】:

如何以及在哪里使用需要更换的东西 您可以在此处阅读有关 apollo-server 的信息:apollographql.com/docs/apollo-server。这是一个很棒的工具,可以支持很多东西。 你能发布你的新代码,说明究竟发生了什么变化【参考方案2】:

这是最新的。这是基于ApolloGraphql Documentation。这对我来说非常有效。

app.js

import mongoose from 'mongoose'
import cors from 'cors';
import dotEnv from 'dotenv'
import http from 'http';
import  ApolloServer, PubSub  from 'apollo-server-express';
import schema from './graphql/schema'
import express from 'express';

dotEnv.config();
const port = process.env.PORT || 3000;
const pubsub = new PubSub();
const app = express();

const server = new ApolloServer(
    schema,
    subscriptions: 
        onConnect: () => console.log('?️ Client connected  to websocket'),
        onDisconnect: (webSocket, context) => 
            console.log('Client disconnected from websocket')
        ,
    ,

);

server.applyMiddleware( app )

const httpServer = http.createServer(app);
server.installSubscriptionHandlers(httpServer);

httpServer.listen(port, () => 
    console.log(`? Apollo Server Server ready at http://localhost:$port$server.graphqlPath`)
)

package.json

  "dependencies": 
    "apollo-server": "^2.25.1",
    "apollo-server-express": "^2.25.1",
    "babel-node": "^0.0.1-security",
    "body-parser": "^1.19.0",
    "cors": "^2.8.5",
    "cross-fetch": "^3.1.4",
    "dotenv": "^10.0.0",
    "express": "^4.17.1",
    "graphql": "^15.5.0",
    "graphql-subscriptions": "^1.2.1",
    "graphql-tools": "^7.0.5",
    "moment": "^2.29.1",
    "mongoose": "^5.12.13",
    "subscriptions-transport-ws": "^0.9.19"
  ,
  "devDependencies": 
    "@babel/cli": "^7.14.3",
    "@babel/core": "^7.14.3",
    "@babel/node": "^7.14.2",
    "@babel/preset-env": "^7.14.4",
    "@babel/register": "^7.13.16",
    "jest": "^27.0.4",
    "nodemon": "^2.0.7",
    "supertest": "^6.1.3"
  

【讨论】:

以上是关于GraphQL 订阅 - subscriptionsClient.subscribe 不是函数的主要内容,如果未能解决你的问题,请参考以下文章

使用 graphql 订阅和微服务的授权(不是身份验证!)模式

React 模拟 Graphql 订阅

graphql 订阅返回空数据

未处理的 GraphQL 订阅错误

无法连接到 Graphql 订阅?

GraphQL 订阅引发跨源错误