WebSocket ориентированое Api на Nest.js

В этой статье я расскажу как написал модуль под Nest.js позволяющий писать классическое RESTFull API со swagger’ом но клиент будет полностью на WebSocket’ах, звучит странно не так ли? Но зато очень быстро и удобно по итогу)

Идея состоит в том, что вы пишите классическое документированное апи, со всеми типами и плюшками.

  @Get(':id')   @WsAction('user')   getUser(@Param('id', ParseIntPipe) id: number): UserDto {     return this.appService.getUser(id);   }

Так же при настройка модуля в nest.js можно добавить валидацию сокетов, чтобы всё было под авторизацией. Вот небольшой пример из проекта:

@Module({     imports: [       ConfigModule.forRoot(),       WsModule.registerAsync({         useFactory: (): IWsApiConfig => {           return {             // тут указывается та же валидация что была             // использована для app.useGlobalPipes(new ValidationPipe(validationConfig));             validationConfig,             async validate(socket: Socket) {               try {                 const authGuard = new (AuthGuard('jwt'))();                 const isAuth = await (authGuard.canActivate(new ExecutionContextHost([socket])) as Promise<boolean>);                  if (!isAuth) {                   return HttpStatus.UNAUTHORIZED;                 }               } catch (e) {                 return HttpStatus.UNAUTHORIZED;               }               return HttpStatus.OK;             },           };         },       }),     ],   })

Далее на клиенте с помощью пакета swagger-typescript-api к примеру автоматически генерите полноценного HTTP клиента под ts. В котором описаны все типы и методы для http запросов. Но нам от него нужны только типы, впрочем вы можете сделать еще и fallback в случае проблем с сокетами.

Плюс можно сделать логику что при SSR делать запрос по HTTP и далее уже на WS.

export interface UserDto {   id: number;   firstName: string;   email: string; }

Идем дальше)

Что происходит на сервере:

1. Собирается приложение, при компиляции декоратора WsAction он собирает всю инфу о методе контроллера, и кладет в свою коллекцию.

2. Далее приложение запускается и собранная коллекция ожидает подключения по сокетам клиента, далее подписывается на евенты, названия которых совпадает с названием метода.

3. Клиенту отправляется информация с конфигом с сервера если надо + статус подключения, когда можно уже дергать АПИ.

4. И все это гуляет по одному каналу, что увеличивает скорость в ~10 раз.

[Nest] LOG [InstanceLoader] AppModule dependencies initialized +0ms [Nest] LOG [WsGateway] Add WS action: AppController => app:getUser [Nest] LOG [WsGateway] Add WS action: BusinessController => business:createUser [Nest] LOG [RoutesResolver] AppController {/api}: +2ms [Nest] LOG [RouterExplorer] Mapped {/api/:id, GET} route +3ms [Nest] LOG [RoutesResolver] BusinessController {/api/business}: +1ms [Nest] LOG [RouterExplorer] Mapped {/api/business/create, POST} route +0ms [Nest] LOG [NestApplication] Nest application successfully started +6ms

Можно заметить что сгенерились экшены на основе неймпейска указанного в контроллере, и названия метода к которому применили декоратор business:createUser и app:getUser

По сути это и есть название евента которое отправляется с клиента:

ws.emit('business:createUser', { payload });

Я бы на этом закончил, но мне не было достаточно асинхронного WS, я хотел чтобы было всё синхронно как все привыкли:

await fetch('api/create-user', { payload })

Для этого я написал небольшой клиент который промисофицирует асинхронные сокеты и получается по итогу:

const result = await webSocket.emit<ResultDto>('business:createUser', { payload });

Не хочется много кода сюда писать)

Модуль я опубликовал в npm, репа https://github.com/gustoase/nestjs-ws-api
Демо проекта чтобы запустить потыкать накидал на коленке https://github.com/gustoase/nestjs-ws-api-demo

Как запустить:

1. npm i

2. npm run start:dev

3. cd client

4. npm i

5. npm run dev

6. http://localhost:3001/

Что по итогу хочу сказать, проект на работе который был успешно запущен летает очень быстро, проблем с ним нет, авторизация имеется, валидация тоже.
Так же за счет своевременного оповещения с сервера о состоянии АПИ можно показывать красивые уведомления)