Apollo GraphQL Subscriptions

Question

Apollo의 GraphQL 구독에 문제가 있습니다. 주제 (기본적으로 게시물에 대한 덧글 추가)에 대한 "관점"추가를 구독하고 싶습니다. 서버를 올바로 설정했다고 확신합니다. 고객이 내게 문제를 일으키는 것입니다. (이 질문이 익숙해 보인다면, 나는 이전에 그것을 물어 봤고 나는 대답을 얻었지만 생각하지는 않는다). 여기 내 가입 스키마입니다 :

type Subscription { 
    perspectiveAdded: Perspective 
} 

schema { 
    query: RootQuery 
    mutation: Mutation 
    subscription: Subscription 
} 

내 구독 해결 :

Subscription: { 
    perspectiveAdded(perspective) { 
     return perspective; 
    } 
    } 

내 subscriptionManager :

const pubsub = new PubSub(); 
const subscriptionManager = new SubscriptionManager({ 
    schema, 
    pubsub, 
    setupFunctions: { 
    perspectiveAdded: (options, args) => { 
     perspectiveAdded: { 
     filter: (topic) => { 
      return topic 
     } 
     } 
    }, 
    } 
}); 

export { subscriptionManager, pubsub }; 

내 addPerspective 돌연변이의 마지막 부분 (구독에 ​​대한 이벤트 트리거) :

//...  
return perspective.save((error, perspective) => { 
    if(error){ 
    console.log(error); 
    } 

    //Publish it to Subscription channel 
    pubsub.publish('perspectiveAdded', perspective); 
}); 

,210

그리고 내가 지원하기 위해 실제 서버를 유선했습니다 구독 : 내 터미널에서 나는 "웹 ​​소켓 연결이 설정"메시지를 볼 수 있기 때문에

const PORT = process.env.PORT || 4000; 
const server = createServer(app); 

server.listen(PORT,()=>{ 
    new SubscriptionServer(
    { 
     subscriptionManager: subscriptionManager, 
     onConnect: (connectionParams, webSocket) => { 
     console.log('Websocket connection established Lord Commander'); 
    }, 
    onSubscribe: (message, params, webSocket) => { 
     console.log("The client has been subscribed, Lord Commander", message, params); 
    }, 
    onUnsubsribe: (webSocket) => { 
     console.log("Now unsubscribed, Lord Commander"); 
    }, 
    onDisconnect: (webSocket) => { 
     console.log('Now disconnected, Lord Commander'); 
    } 
    }, 
    { 
     server: server, 
     path: '/subscriptions', 
    }); 
    console.log('Server is hot my Lord Commander!'); 
}); 

나는 제대로뿐만 아니라 클라이언트를 유선했습니다. 내가 당황한 부분은 실제로 구독을 호출하는 방법입니다. Apollo 블로그에 따르면 GraphiQL의 구독을 테스트 할 수 있어야합니다 (이제는 apollo 서버를 사용 중이므로 graphql-server-express). "Subscription.perspectiveAdded \"에 대한 해결 함수가 정의되지 않은 반환 됨 ".

내 구성 요소의 경우 'subscribeToMore'를 연결하려고했지만 브라우저 콘솔에서 'onSubscribe에서 반환 된 매개 변수가 유효하지 않습니다. 반환 값은 개체 여야합니다.'라는 오류 개체가 표시됩니다. 나는 어떤 물체를 가리키는 지 모르겠다. 나는 여전히 클라이언트가 가입 된 말을 내 단말기에서 메시지가, 그러나 여기에서

constructor(props){ 
     super(props); 
     this.state = {}; 
     this.subscription = null; 
    } 



    componentWillReceiveProps(nextProps) { 
     if (!this.subscription && !nextProps.data.loading) { 
     let { subscribeToMore } = this.props.data 
     this.subscription = subscribeToMore(
      { 
      document: perspectiveSubscription, 
      updateQuery: (previousResult, { subscriptionData }) => { 
       if(!subscriptionData.data){ 
       console.log('no new subscription data'); 
       return previousResult; 
       } 

       const newPerspective = subscriptionData.data.perspectiveAdded; 
       console.log(newPerspective); 
       return Object.assign({}, previousResult, newPerspective); 
      } 
      } 
     ) 
     } 

:

export default gql` 
subscription { 
    perspectiveAdded { 
    id 
    content 
    } 
} 
`; 

그리고 최대 유선 구성 요소 :

여기 perspectiveSubscription라는 내 구독 쿼리 위에서 언급 한 오류 개체가 나타납니다. 나는 이것에 대해 며칠 동안 내 머리카락을 꺼내 ​​왔어. 너희들 여기서 내가 누락 된 것을 본거야? 특히 클라이언트 측의 아이디어는 무엇입니까? 모두에게 감사드립니다!

Answer 1

구독이 추가되고 graphiql이 올바른 결과를 제공하지 않기 때문에 서버 측이 올바르지 않은 것처럼 보입니다. 내가 제안

한 것은 당신이 채널 정의를 확인하는 것이 있습니다 :

const pubsub = new PubSub(); 
 
const subscriptionManager = new SubscriptionManager({ 
 
    schema, 
 
    pubsub, 
 
    setupFunctions: { 
 
    perspectiveAdded: (options, args) => { 
 
     perspectiveAdded: { 
 
     filter: (perspective) => { 
 
     console.log(perspective); // check if object is correct 
 
      return true; // return true and not the object as long as you do not want to filter 
 
     } 
 
     } 
 
    }, 
 
    } 
 
}); 
 

 
export { subscriptionManager, pubsub };

그리고 관점 객체가 저장되고 pubsub 호출하기 전에 정의 된 경우도 확인합니다. 그리고 구독이 작동해야하는 의견 ID를 추가하려고한다고 생각합니다. 내 편이 더 많거나 적게 보입니다. post