使用graphql-ws实现GraphQL订阅需结合WebSocket与发布-订阅模式。1. 安装express、graphql、ws、graphql-ws等依赖；2. 定义含Subscription类型的Schema并编写返回AsyncIterator的解析器；3. 用ws创建WebSocket服务器，通过useServer集成graphql-ws；4. 启动HTTP服务并可选添加express-graphql支持调试界面；5. 前端通过WebSocket连接发送订阅请求，服务端在Mutation中发布事件触发实时推送。关键在于路径一致与正确使用PubSub和AsyncIterator。
要实现一个支持GraphQL订阅的实时API，核心是使用WebSocket来建立持久连接，并结合GraphQL执行机制推送数据更新。Node.js生态中，graphql-ws和subscriptions-transport-ws是主流选择。推荐使用更现代、轻量且兼容性更好的graphql-ws库，配合express和graphql构建完整服务。
1. 安装必要依赖
先初始化项目并安装关键包：
npm init -ynpm install express graphql express-graphql ws graphql-ws
2. 定义GraphQL Schema和解析器
创建基本的Schema，包含查询和订阅类型：
const { buildSchema } = require('graphql');const schema = buildSchema(` type Post { id: ID! title: String! content: String }
type Query { posts: [Post] }
type Subscription { postAdded: Post } `);
编写解析器，其中订阅返回一个AsyncIterator：
const resolvers = { Query: { posts: () => posts },
Subscription: { postAdded: { subscribe: () => pubsub.asyncIterator(['POST_ADDED']) } },
Mutation: { addPost: ({ title, content }) => { const post = { id: posts.length + 1, title, content }; posts.push(post); pubsub.publish('POST_ADDED', { postAdded: post }); return post; } } };
3. 配置WebSocket服务器支持订阅
使用ws创建WebSocket服务器，并通过graphql-ws处理订阅消息：
const app = express(); const server = createServer(app);
// 创建WebSocket服务器用于GraphQL订阅 const wss = new WebSocketServer({ server, path: '/graphql' });
useServer({ schema, execute, subscribe }, wss);
注意：execute和subscribe来自graphql模块，需导入：
Shoping购物网源码
下载
该系统采用多层模式开发，这个网站主要展示女装的经营，更易于网站的扩展和后期的维护，同时也根据常用的SQL注入手段做出相应的防御以提高网站的安全性，本网站实现了购物车,产品订单管理，产品展示，等等，后台实现了动态权限的管理，客户管理，订单管理以及商品管理等等，前台页面设计精致，后台便于操作等。实现了无限子类的添加，实现了动态权限的管理，支持一下一个人做的辛苦
4. 启动HTTP和WebSocket服务
让Express处理普通请求，WebSocket处理实时通信：
server.listen(4000, () => { console.log('HTTP服务器运行在 http://localhost:4000'); console.log('WebSocket服务器已启动，路径 /graphql'); });可选：添加express-graphql中间件支持浏览器调试：
app.use('/graphql', graphqlHTTP({ schema, rootValue: resolvers, graphiql: true // 启用GraphiQL界面 }));
5. 前端测试订阅功能
在客户端使用graphql-ws或urql等库连接。示例使用原生WebSocket：
ws.onopen = () => { ws.send(JSON.stringify({ type: 'subscribe', payload: { query: `subscription { postAdded { id title content } }` } })); };
ws.onmessage = (event) => { console.log('收到新帖子:', JSON.parse(event.data)); };
当调用addPost mutation时，所有订阅客户端会立即收到更新。
