4

我有一个使用 React 并订阅 GraphQL 后端的遗留应用程序。今天，我升级了我所有的软件包，尤其是那些（我认为它们是我问题的根源，但我不确定）：

  • react-apollo从^2.4.0到^3.1.3

  • apollo-link-ws从^1.0.14到^1.0.19

工作代码是这样的：

import {ApolloClient} from 'apollo-client';
import {HttpLink} from 'apollo-link-http';
import {WebSocketLink} from 'apollo-link-ws';
// Other imports....

const wsLink = new WebSocketLink({
  uri: `ws://localhost:3000/graphql`,
  options: {
    reconnect: true,
  },
});

const splittedLink = split(
  ({query}) => {
    const {kind, operation} = getMainDefinition(query);
    return (
      kind === 'OperationDefinition' && operation === 'subscription'
    );
  },
  wsLink,
  httpLink,
);

const link = ApolloLink.from([
  onError(({graphQLErrors, networkError}) => {
    // Handle graphQLErrors and networkError
  }),
  withClientState({
    //...
    cache
  }),
  splittedLink
]);

export default new ApolloClient({
  link,
  cache
});

因此，这是Apollo 网站上描述的基本代码，但升级后我收到此错误（在网络中查看我的 graphQL 响应时）：

WebSocket 握手期间出错：意外的响应代码：400

在我的开发终端中，我看到一个无限的日志说：

在此处输入图像描述

评论

在我的setupProxy.js我ws设置为true：

const proxy = require('http-proxy-middleware');

module.exports = app => {
  app.use(proxy('/graphql', {
    target: 'ws://my-backend-url:my-backend-port',
    changeOrigin: true,
    ws: true,
  }));
};

对此有何反馈或经验？

4

0 回答 0