0Pricing
NestJS Enterprise Backend APIs · Урок

Резолверы и подписки

Реализуйте резолверы GraphQL для получения и изменения данных, а также настройте подписки для обновления данных в реальном времени.

«Резолверы и подписки» — бесплатный урок NestJS Enterprise Backend APIs на CoddyKit. Это урок 3 из 3. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения NestJS Enterprise Backend APIs, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс NestJS Enterprise Backend APIs содержит 3 уроков всего.

Части этого урока еще не переведены и отображаются на английском.

Intro to GraphQL Resolvers

Welcome to the world of GraphQL resolvers in NestJS! Resolvers are the core of your GraphQL API, acting as the bridge between your GraphQL schema and your application's data sources.

  • They define how to fetch the data for a specific field in your schema.
  • Think of them as functions that execute when a corresponding field is requested in a GraphQL query or mutation.
  • Resolvers can interact with databases, REST APIs, or any other data source.

Resolver Structure in NestJS

NestJS simplifies resolver creation using decorators. You define a class as a resolver and then use specific decorators for different GraphQL operations:

  • @Resolver(): Marks a class as a GraphQL resolver.
  • @Query(): Maps a method to a GraphQL query operation (data fetching).
  • @Mutation(): Maps a method to a GraphQL mutation operation (data modification).
  • @Subscription(): Maps a method to a GraphQL subscription operation (real-time data).

Implementing a Basic Query

Let's create a simple query resolver that returns a 'Hello world!' string. This demonstrates the basic setup for a query:

import { Module, Injectable } from '@nestjs/common';
import { NestFactory } from '@nestjs/core';
import { GraphQLModule } from '@nestjs/graphql';
import { ApolloDriver, ApolloDriverConfig } from '@nestjs/apollo';
import { join } from 'path';
import { Query, Resolver } from '@nestjs/graphql';

@Injectable()
class AppService {
  getHello(): string {
    return 'Hello world!';
  }
}

@Resolver()
class AppResolver {
  constructor(private readonly appService: AppService) {}

  @Query(() => String)
  hello(): string {
    return this.appService.getHello();
  }
}

@Module({
  imports: [
    GraphQLModule.forRoot<ApolloDriverConfig>({
      driver: ApolloDriver,
      autoSchemaFile: join(process.cwd(), 'src/schema.gql'),
    }),
  ],
  providers: [AppResolver, AppService],
})
class AppModule {}

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  await app.listen(3000);
}
bootstrap();

Handling Query Arguments

Queries often need arguments to filter or specify data. Use the @Args() decorator to extract arguments from the GraphQL request.

Here, we'll create a query that greets a specific name.

import { Module, Injectable } from '@nestjs/common';
import { NestFactory } from '@nestjs/core';
import { GraphQLModule } from '@nestjs/graphql';
import { ApolloDriver, ApolloDriverConfig } from '@nestjs/apollo';
import { join } from 'path';
import { Args, Query, Resolver } from '@nestjs/graphql';

@Injectable()
class AppService {
  getGreeting(name: string): string {
    return `Hello, ${name}!`;
  }
}

@Resolver()
class AppResolver {
  constructor(private readonly appService: AppService) {}

  @Query(() => String)
  greet(@Args('name') name: string): string {
    return this.appService.getGreeting(name);
  }
}

@Module({
  imports: [
    GraphQLModule.forRoot<ApolloDriverConfig>({
      driver: ApolloDriver,
      autoSchemaFile: join(process.cwd(), 'src/schema.gql'),
    }),
  ],
  providers: [AppResolver, AppService],
})
class AppModule {}

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  await app.listen(3000);
}
bootstrap();

Introducing GraphQL Mutations

While queries fetch data, mutations are used for modifying data on the server. This includes operations like creating, updating, or deleting records.

  • Mutations are similar to queries in structure but clearly signal a side effect.
  • They typically return the modified object or a status indicating success.
  • Use the @Mutation() decorator to define them in NestJS.

Implementing a Basic Mutation

Let's create a mutation to add a simple 'Item'. We'll define an Item type and a mutation that takes a name and returns the newly created item.

import { Module, Injectable, Field, ObjectType, InputType } from '@nestjs/common';
import { NestFactory } from '@nestjs/core';
import { GraphQLModule } from '@nestjs/graphql';
import { ApolloDriver, ApolloDriverConfig } from '@nestjs/apollo';
import { join } from 'path';
import { Args, Mutation, Query, Resolver } from '@nestjs/graphql';

@ObjectType()
class Item {
  @Field(() => String)
  id: string;

  @Field(() => String)
  name: string;
}

@Injectable()
class ItemsService {
  private readonly items: Item[] = [];
  create(name: string): Item {
    const newItem = { id: String(this.items.length + 1), name };
    this.items.push(newItem);
    return newItem;
  }
  findAll(): Item[] { return this.items; }
}

@Resolver(() => Item)
class ItemsResolver {
  constructor(private readonly itemsService: ItemsService) {}

  @Query(() => [Item])
  items(): Item[] {
    return this.itemsService.findAll();
  }

  @Mutation(() => Item)
  createItem(@Args('name') name: string): Item {
    return this.itemsService.create(name);
  }
}

@Module({
  imports: [
    GraphQLModule.forRoot<ApolloDriverConfig>({
      driver: ApolloDriver,
      autoSchemaFile: join(process.cwd(), 'src/schema.gql'),
    }),
  ],
  providers: [ItemsResolver, ItemsService],
})
class AppModule {}

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  await app.listen(3000);
}
bootstrap();

What are GraphQL Subscriptions?

Subscriptions are a GraphQL feature that allows clients to receive real-time updates from the server. Unlike queries and mutations (which are request-response), subscriptions are long-lived connections, typically over WebSockets.

  • When a client subscribes, it opens a persistent connection.
  • The server pushes data to the client whenever a specific event occurs.
  • Perfect for chat applications, live dashboards, or notifications.

Setting up PubSub for Subscriptions

To implement subscriptions, NestJS GraphQL often uses graphql-subscriptions's PubSub (Publish-Subscribe) mechanism. The server publishes events, and subscribers listen for them.

You need to configure GraphQLModule for subscriptions and provide a PubSub instance.

import { Module, Injectable } from '@nestjs/common';
import { NestFactory } from '@nestjs/core';
import { GraphQLModule } from '@nestjs/graphql';
import { ApolloDriver, ApolloDriverConfig } from '@nestjs/apollo';
import { join } from 'path';
import { PubSub } from 'graphql-subscriptions';

// We need a module to provide PubSub
@Module({
  providers: [
    {
      provide: 'PUB_SUB', // Token for PubSub instance
      useValue: new PubSub(),
    },
  ],
  exports: ['PUB_SUB'], // Export to use in other modules
})
class PubSubModule {}

@Module({
  imports: [
    GraphQLModule.forRoot<ApolloDriverConfig>({
      driver: ApolloDriver,
      autoSchemaFile: join(process.cwd(), 'src/schema.gql'),
      // Crucial for subscriptions:
      subscriptions: {
        'graphql-ws': true, // Enable WebSocket for subscriptions
        'subscriptions-transport-ws': true,
      },
    }),
    PubSubModule,
  ],
  // No resolvers needed for this example, just setup
})
class AppModule {}

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  await app.listen(3000);
  console.log('GraphQL server with subscriptions running on port 3000');
}
bootstrap();

Implementing a Subscription

Now let's build a subscription! We'll create a postAdded subscription that emits an event whenever a new post is created via a mutation.

  • Use @Subscription() to define the subscription method.
  • Inject PubSub to publish events.
  • The mutation will trigger the event.
import { Module, Injectable, Field, ObjectType, Inject } from '@nestjs/common';
import { NestFactory } from '@nestjs/core';
import { GraphQLModule } from '@nestjs/graphql';
import { ApolloDriver, ApolloDriverConfig } from '@nestjs/apollo';
import { join } from 'path';
import { Args, Mutation, Query, Resolver, Subscription } from '@nestjs/graphql';
import { PubSub } from 'graphql-subscriptions';

const POST_ADDED_EVENT = 'postAdded';

@ObjectType()
class Post {
  @Field(() => String)
  id: string;

  @Field(() => String)
  title: string;

  @Field(() => String)
  content: string;
}

@Injectable()
class PostsService {
  private readonly posts: Post[] = [];
  create(title: string, content: string): Post {
    const newPost = { id: String(this.posts.length + 1), title, content };
    this.posts.push(newPost);
    return newPost;
  }
  findAll(): Post[] { return this.posts; }
}

@Module({
  providers: [
    {
      provide: 'PUB_SUB', // Token for PubSub instance
      useValue: new PubSub(),
    },
  ],
  exports: ['PUB_SUB'], // Export to use in other modules
})
class PubSubModule {}

@Resolver(() => Post)
class PostsResolver {
  constructor(
    private readonly postsService: PostsService,
    @Inject('PUB_SUB') private pubSub: PubSub,
  ) {}

  @Query(() => [Post])
  posts(): Post[] {
    return this.postsService.findAll();
  }

  @Mutation(() => Post)
  async createPost(
    @Args('title') title: string,
    @Args('content') content: string,
  ): Promise<Post> {
    const newPost = this.postsService.create(title, content);
    await this.pubSub.publish(POST_ADDED_EVENT, { postAdded: newPost });
    return newPost;
  }

  @Subscription(() => Post, { name: POST_ADDED_EVENT })
  postAdded() {
    return this.pubSub.asyncIterator(POST_ADDED_EVENT);
  }
}

@Module({
  imports: [
    GraphQLModule.forRoot<ApolloDriverConfig>({
      driver: ApolloDriver,
      autoSchemaFile: join(process.cwd(), 'src/schema.gql'),
      subscriptions: {
        'graphql-ws': true,
        'subscriptions-transport-ws': true,
      },
    }),
    PubSubModule,
  ],
  providers: [PostsResolver, PostsService],
})
class AppModule {}

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  await app.listen(3000);
  console.log('GraphQL server with subscriptions running on port 3000');
  console.log('Try a POST_ADDED_EVENT subscription in your client!');
}
bootstrap();

Resolver & Subscription Check

Time to test your knowledge on NestJS GraphQL resolvers and subscriptions!

Recap: Resolvers & Real-time

Congratulations! You've grasped the essentials of GraphQL resolvers and subscriptions in NestJS.

  • Resolvers are the backbone, connecting your schema to your data.
  • Queries fetch data, Mutations change data, and Subscriptions provide real-time updates.
  • We explored how to implement simple queries and mutations, and set up real-time features using PubSub for subscriptions.

Keep practicing to build dynamic and responsive GraphQL APIs!

Часто задаваемые вопросы

Урок «Резолверы и подписки» бесплатный?

Да — полный текст урока «Резолверы и подписки» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс NestJS Enterprise Backend APIs, подпишись на CoddyKit PRO. Курс NestJS Enterprise Backend APIs содержит 3 уроков всего.

Чему я научусь в уроке «Резолверы и подписки»?

Реализуйте резолверы GraphQL для получения и изменения данных, а также настройте подписки для обновления данных в реальном времени. Ты практикуешь NestJS Enterprise Backend APIs с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать NestJS Enterprise Backend APIs?

Предыдущий опыт не требуется. NestJS Enterprise Backend APIs на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 3 из 3.

Сколько времени занимает урок «Резолверы и подписки»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке NestJS Enterprise Backend APIs?

Да. Каждый урок NestJS Enterprise Backend APIs включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

  1. Основы GraphQL
  2. Настройка NestJS для GraphQL
  3. Резолверы и подписки
← Назад к NestJS Enterprise Backend APIs