2

在这种情况下，我只是尝试使用 graphql-subscriptions 运行虚拟订阅，然后将其集成到我的代码中。然而，即使是最小的例子。

我正在关注一个 scotch.io 示例，这是它的 git 链接 https://github.com/kimobrian/GraphQL-Express/tree/subscriptions

它在 graphiql 订阅时抛出错误

subscriptionsClient.subscribe 不是函数

注意：我什至没有从单独的客户端尝试它。我只想要一个具有包含查询、突变和订阅的架构的服务器，并且我希望能够在不同窗口的 graphiql 中运行它时看到订阅的实时魔力。

根据网上的一些建议，我什至将 subscription-transport-ws 版本从 0.9 降级为 0.8.3

我正在运行查询和突变，但订阅在 Graphiql 中引发了上述错误

服务器文件

import express from 'express';
import {
  graphqlExpress,
  graphiqlExpress,
} from 'graphql-server-express';
import bodyParser from 'body-parser';
import cors from 'cors';

import { schema } from './src/schema';

import { execute, subscribe } from 'graphql';
import { createServer } from 'http';
import { SubscriptionServer } from 'subscriptions-transport-ws';

const PORT = 7900;
const server = express();

server.use('*', cors({ origin: 'http://localhost:3000' }));

server.use('/graphql', bodyParser.json(), graphqlExpress({
  schema
}));

server.use('/graphiql', graphiqlExpress({
  endpointURL: '/graphql',
  subscriptionsEndpoint: `ws://localhost:${PORT}/subscriptions`
}));

// We wrap the express server so that we can attach the WebSocket for subscriptions
const ws = createServer(server);

ws.listen(PORT, () => {
  console.log(`GraphQL Server is now running on http://localhost:${PORT}`);

  // Set up the WebSocket for handling GraphQL subscriptions
  new SubscriptionServer({
    execute,
    subscribe,
    schema
  }, {
    server: ws,
    path: '/subscriptions',
  });
});

包.json

{
  "name": "tutorial-server",
  "version": "1.0.0",
  "description": "A simple GraphQL server",
  "main": "server.js",
  "scripts": {
    "start": "nodemon ./server.js --exec babel-node -e js",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "MIT",
  "devDependencies": {
    "babel-cli": "^6.24.0",
    "babel-preset-es2015": "^6.24.0",
    "babel-preset-stage-0": "^6.22.0",
    "nodemon": "^1.11.0"
  },
  "dependencies": {
    "body-parser": "^1.17.1",
    "cors": "^2.8.3",
    "express": "^4.15.2",
    "graphql": "^0.11.3",
    "graphql-server-express": "^1.1.2",
    "graphql-subscriptions": "^0.5.1",
    "graphql-tools": "^1.2.3",
    "subscriptions-transport-ws": "0.8.3"
  }
}

架构

import {
  makeExecutableSchema
} from 'graphql-tools';

import { resolvers } from './resolvers';

const typeDefs = `
type Channel {
  id: ID!                # "!" denotes a required field
  name: String
}

type Message {
  id: ID!
  text: String
}

# This type specifies the entry points into our API
type Query {
  channels: [Channel]    # "[]" means this is a list of channels
  channel(id: ID!): Channel
}

# The mutation root type, used to define all mutations
type Mutation {
  addChannel(name: String!): Channel
}

# The subscription root type, specifying what we can subscribe to
type Subscription {
    channelAdded: Channel
}
`;

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

解析器

import { PubSub } from 'graphql-subscriptions';

const channels = [{
  id: 1,
  name: 'soccer',
}, {
  id: 2,
  name: 'baseball',
}];

let nextId = 3;
const CHANNEL_ADDED_TOPIC = 'newChannel';
const pubsub = new PubSub();

export const resolvers = {
  Query: {
    channels: () => {
      return channels;
    },
    channel: (root, { id }) => {
      return channels.find(channel => channel.id === id);
    },
  },
  Mutation: {
    addChannel: (root, args) => {
      const newChannel = { id: String(nextId++), messages: [], name: args.name };
      channels.push(newChannel);
      pubsub.publish(CHANNEL_ADDED_TOPIC, { channelAdded: newChannel });
      return newChannel;
    }
  },
  Subscription: {
    channelAdded: {
      subscribe: () => pubsub.asyncIterator(CHANNEL_ADDED_TOPIC)
    }
  }
};

我希望它应该在 pubsub.publish 被点击时在订阅窗口中更新

4

0 回答 0