Apolloクライアントのサブスクリプションはスキーマを提供する必要があります

Question

なぜ起こっているのかわかりません。 突然変異を使用して投稿を作成するたびに公開されるサブスクリプションpostAddedを聞いています。

import React, { Component } from 'react' 
import { graphql, gql } from 'react-apollo' 

class App extends Component { 
    componentDidMount() { 
    this.props.subscribeToNewPosts() 
    } 

    render() { 
    return (
     <div> 
     <h1>Hello world</h1> 
     {console.log(this.props)} 
     </div> 
    ) 
    } 
} 

const Query = gql` 
    query Posts { 
    posts { 
     id 
     title 
     content 
     author { 
     firstName 
     lastName 
     } 
    } 
    } 
` 

const Subscription = gql` 
    subscription postAdded { 
    postAdded { 
     id 
     title 
     content 
     author { 
     firstName 
     lastName 
     } 
    } 
    } 
` 

App = graphql(Query, { 
    name: 'posts', 
    props: props => { 
    return { 
     subscribeToNewPosts:() => { 
     return props.posts.subscribeToMore({ 
      document: Subscription, 
      updateQuery: (prev, { subscriptionData }) => { 
      if(!subscriptionData.data) { 
       return prev 
      } 

      const newPost = subscriptionData.data.postAdded 

      console.log(newPost) 

      return { 
       ...prev, 
       posts: [...prev.posts, newPost] 
      } 
      } 
     }) 
     }, 
     posts: props.posts 
    } 
    } 
})(App) 

export default App 

エラー：

Answer 1

まず、これが最も可能性の高いサーバー実装の問題です。このエラーは、graphqlエンドポイントであるgraphql-toolsによってスローされている可能性があります。

公式ブログでFull-stack + GraphQLチュートリアルの第2部に従っている間、全く同じことが起こりました。

これは必ずしも同じではありませんが、チュートリアルではexport { schema }を使用してスキーマオブジェクトをエクスポートすることができました。これは通常のエクスポートではなくexport { schema: schema }に相当します。 export default schema

私のgraphqlサーバエンドポイントでは、import schema from './src/schema'でインポートしましたが、これはスキーマがデフォルトオブジェクトのエクスポートではなくサブオブジェクトとしてエクスポートされたために間違っていました。私の場合の正しいインポートは、import { schema } from './src/schema'

TL; DRです。サーバーコードを確認し、エクスポートとインポートのステートメントを確認してください。エラーメッセージは本当に誤解を招いていますが、モジュールのインポート/エクスポートと関係がありそうです。

このチュートリアルのようにbabel-nodeを使用する代わりにwebpackを使用してコンパイルした場合、より明示的な情報を避けることもできます。