Question

我正在使用具有react native和Relay的Express Graphql服务器。我的设备确实连接到订阅但它没有订阅它。这是我在服务器上的index.js

const subscriptionServer = SubscriptionServer.create(
  {
    execute,
    subscribe,
    schema,
    onOperation: (message, params, webSocket) => {
      console.log(params)
      return params;
    },
    onConnect: () => {
      // My device does connects
      console.log("client connected")
    }
  },
  {
    server,
    path: '/subscriptions'
  },
);

app.use('/graphql', graphqlHTTP({
  schema,
  graphiql: true
}));

app.use('/graphiql', graphiqlExpress({
  endpointURL: '/graphql',
  subscriptionsEndpoint: `ws://127.0.0.1:8080/subscriptions`
}));

server.listen(PORT, ()=> {
  console.log("Groceries running on port " + PORT)
  console.log(
    `subscriptions is now running on ws://localhost:${PORT}/subscriptions'}`
  );
});

服务器上的订阅解析器，因为每个人都在使用来自apolloGraphql的可执行模式，所以很难搞清楚。

export default {
  type: OrderEdges,
  args: {
     ShopId: {type: GraphQLID},
  },
  subscribe: withFilter(() => pubsub.asyncIterator('orderConfirmed'), (payload, variables) => {
    console.log(payload)
    console.log(variables)
    return payload.orderConfirmed.node.ShopId == variables.ShopId;
  }),
}

现在反应原生客户端。我的订阅设置与中继环境。

const setupSubscriptions = (config, variables, cacheConfig, observer) => {
  const query = config.text; //does console logs the query
  const subscriptionClient = new SubscriptionClient(`ws://192.168.0.100:8080/subscriptions`, {reconnect:true});
  subscriptionClient.request({query, variables}, (err, result) => {
    console.log(err) // doesn't get call inside the request method
    observer.onNext(data:result)
  })
}

我的订阅方式，

export default function() {
  const variables = {
    ShopId: shop.getShop()[0].id
  } 
  requestSubscription(
  environment,
  {
    subscription,
    variables,
    onCompleted: (res, err) => {
      console.log(res)
      console.log(err)
    },
    updater: (store) => {...},
    onError: error => console.error(error),
    onNext: (response) => {console.log(response)}
  });

}

我打电话订阅的组件，

import subscription from '../../GraphQLQueries/subscriptions/orderConfirmed';

class OrdersBox extends React.Component {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    //initializing subscription
    orderSubscriptions();
  }

当设备启动应用程序时，我的设备已连接到Web套接字，因为我可以在SubscriptionServer中的onConnect方法中看到console.log语句。但是当在突变之后发布有效载荷时，不会调用subscribe方法。我似乎无法弄清楚我做错了什么。也许这是一些反应原生的特定配置我缺少因为当我在graphiql上测试它时，一切似乎工作正常。我找不到与express graph一起使用的react-native和relay订阅的任何示例。

注意：当我使用graphiql订阅时，一切正常。但不是反应本地和接力。

先谢谢你们 ....

Answer 1

我没有返回subscriptionClient.request方法。添加return语句解决了这个问题。在subscriptions-transport-ws@0.8.3中使用subscribe方法时，您不必返回。但是版本0.9.1用请求替换了subscribe函数，这需要它返回。

Answer 2

尝试：

function setupSubscription(config, variables, cacheConfig, observer) {
  const query = config.text;

  const subscriptionClient = new SubscriptionClient(websocketURL, {
    reconnect: true
  });

  const client = subscriptionClient.request({ query, variables }).subscribe({
    next: result => {
      observer.onNext({ data: result.data });
    },
    complete: () => {
      observer.onCompleted();
    },
    error: error => {
      observer.onError(error);
    }
  });

  return {
    dispose: client.unsubscribe
  };
}

subscriptions-transport-ws@0.9.1

中继订阅无法使用react-native

2 个答案: