[typescript] 타입스크립트에서 GraphQL 서브스크립션 작성하기

GraphQL Subscriptions을 사용하면 클라이언트에서 서버로의 실시간 데이터 푸시를 처리할 수 있습니다. 타입스크립트와 그래프큐엘 서버를 함께 사용하여 서버에서 구독을 처리하는 방법을 알아보겠습니다.

GraphQL Subscriptions이란?

GraphQL Subscriptions은 실시간 이벤트를 처리하는 데 사용되는 GraphQL 스키마의 한 부분입니다. 이를 통해 클라이언트는 구독(subscribe)을 통해 서버에서의 이벤트를 알 수 있고, 서버는 변경 사항을 푸시하여 클라이언트에게 실시간으로 업데이트할 수 있습니다.

예를 들어, 실시간 채팅 메시지, 실시간 위치 추적, 주식 시세 업데이트 등을 처리할 수 있습니다.

타입스크립트에서 GraphQL Subscriptions 만들기

GraphQL Subscriptions을 만들기 위해서는 다음 단계가 필요합니다.

  1. 서버 환경 설정: 타입스크립트와 GraphQL Subscriptions 라이브러리를 사용하여 서버를 설정합니다.
  2. 스키마 정의: 서버에서 처리할 Subscription 유형을 정의합니다.
  3. 리졸버 구현: Subscription에 대한 리졸버 함수를 작성합니다.

다음은 타입스크립트에서 GraphQL Subscriptions을 사용하는 간단한 예제입니다.

import { ApolloServer, gql } from 'apollo-server';
import { PubSub } from 'graphql-subscriptions';

const pubsub = new PubSub();
const SOMETHING_CHANGED = 'SOMETHING_CHANGED';

const typeDefs = gql`
  type Query {
    hello: String
  }

  type Subscription {
    somethingChanged: String
  }
`;

const resolvers = {
  Query: {
    hello: () => 'Hello world!',
  },
  Subscription: {
    somethingChanged: {
      subscribe: () => pubsub.asyncIterator([SOMETHING_CHANGED])
    },
  },
};

const server = new ApolloServer({
  typeDefs,
  resolvers,
});

server.listen().then(({ url }) => {
  console.log(`🚀 Server ready at ${url}`);
});

위의 예제에서 PubSub을 사용하여 구독에 대한 이벤트를 관리하고, SOMETHING_CHANGED 이벤트에 대한 구독을 설정합니다. 구독을 받으면 새로운 이벤트가 발생할 때마다 클라이언트에게 이벤트를 전송할 수 있습니다.

마무리

이제 타입스크립트와 그래프큐엘 서버를 사용하여 GraphQL Subscriptions을 효과적으로 구현하는 방법에 대해 알아보았습니다. 실시간 데이터 업데이트가 필요한 다양한 유형의 애플리케이션에서 이러한 기능을 통해 사용자 경험을 더욱 개선할 수 있습니다.

참고 자료: Apollo Server Docs


본 문서는 귀하의 요청에 따라 한국어로 작성되었습니다.