GraphQL Subscription이란

GraphQL 쿼리 종류

간단하게 쿼리의 종류를 알아보려고 한다. 자세한 내용은 실제 채팅 서비스를 구현하면서 학습하는게 좋을 것 같아 간단한 설명만 적어놓았다.

REST API와 GraphQL  역할을 잠깐 비교하자면

Query

REST API의 GET메서드라고 생각하면 된다. 보통 데이터를 조회할 때 많이 사용한다.

Mutation

REST API의 POST, PUT, DELETE 등의 메서드라고 생각하면 된다. 보통 데이터를 조작할 때 많이 사용한다.

Subscription

실시간 통신을 할때 사용하는 쿼리이다. 이름 그대로 구독하는 기능을 가지고 있으며 Mutation쿼리에서 데이터를 조작할 때 그 값을 구독해 변경사항을 실시간으로 가져올 수 있다.

query와 mutation은 전통적인 서버/클라이언트(server/client) 모델을 따르는 반면에, subscription은 발행/구독(pub/sub) 모델을 따릅니다. server/client 모델에서는 클라이언트에서 최신의 데이터를 받아오려면, 더 자주 서버를 호출하는 방법 밖에 없는데요. 접속자가 많은 서버에서 동시 다발적으로 변경이 발생하는 경우 클라이언트에서 아무리 자주 호출하더라도 완벽한 실시간을 달성하기는 어렵습니다. 또한, 변경이 자주 발생하지 않는 서버의 경우, 클라이언트에서 어렇게 자주 호출하는 것이 자체가 서버와 클라이언트 측 모두 낭비와 부담이 될 것입니다.

pub/sub 모델을 따르는 GraphQL의 subscription은 서버에서 발생하는 이벤트를 클라이언트에서 좀 더 효과적으로 인지할 수 있도록 해줍니다. query와 mutation이 HTTP 프로토콜을 사용하는 반면에, subscription은 Web Socket 프로토콜을 사용합니다. Web Socket을 사용하면 클라이언트는 서버와 연결 채널을 유지한체로, 서버에서 발생하는 이벤트를 실시간으로 수신받을 수 있습니다. 이번 포스팅에서는 Apollo Server를 사용하여 서버 측에서 subscription을 어떻게 구현할 수 있는지 살펴보겠습니다.

채팅에서 구독한 유저와 실시간으로 메시지를 주고 받아야 합니다 먼저 mutation에다 밑에 구문을 적으면

//오더가 생성 됐어요

pubsub.publish("MESSAGE_SENT", { messageSent: newMessage });

이벤트가 발생했을 때에 알림을 주기 위해 필요한 PubSub 이라는 녀석이 존재합니다. PubSub은 Apollo Server에서 제공하는 클래스인데 특정 이벤트의 발생을 알리고(Publish) 이벤트를 감지하여(AsyncIterator) 이를 구독하고 있는 클라이언트에게 데이터를 전송할 수 있는 유용한 API를 제공합니다.

이를 통해 저희는 사용자가 오더를 생성했을 때 특정 오더 데이터를 발행(Publish)할 수 있고 이 이벤트를 감지하여 구독하고 있는  유저에게 메시지를 줄 수 있게 되는 것이죠!

 

Subscription: {

messageSent: {

subscribe: withFilter(

(_: any, __: any, context: GraphQLContext) => {

const { pubsub } = context;

return pubsub.asyncIterator(["MESSAGE_SENT"]); //구독하고 있는 클라이언트에게 오더데이터 알려줄게요 이벤트 감지

},

(

payload: MessageSentSubscriptionPayload,

args: { conversationId: string },

context: GraphQLContext

) => { //구독하고 있는 유저에게 메시지 전송

return payload.messageSent.conversationId === args.conversationId;

}

),

},

Chorem이라는 유저가 Safari유저에게 메시지를 보냈을 때  다른 유저인 Firebox 유저에게 메시지가 가면 안 되겠죠? 이를 해결하기 위해 저희는 Subscription withFilter 을 활용했습니다. 말 그대로 특정 이벤트를 구독하고 있는 모든 사용자에게 메시지를 보내는 것이 아닌 특정 조건을 만족하는 사용자에게만 메시지를 주는 것이죠.

정리: 이렇게 Subscription은 이름 그대로 구독/발행 모델을 기반으로 WebSocket을 통해 실시간 양방향 통신 기능을 제공합니다. 구독을 통해 특정한 이벤트가 발생했을 때 서버에서 클라이언트로 데이터를 실시간으로 통신하게 됩니다.