CODEWITHSUNDEEP
nestjs
KenavR
KenavR

Reputation: 3899

Nestjs server does not serve socket.io client

I have a split app using nestjs on the server and an Angular app as the client. Setting up websockets with socket.io seemed pretty easy using the @nestjs/websockets module and on the client I used ngx-socket-io. I used this repo as basis. Now when I update the project's @nestjs/websockets dependency to the latest version I get

I expected CORS problems and after the update, I could fix them by adding 

  app.enableCors({
    origin: 'http://localhost:4200',
    credentials: true,
  });

to my main.ts file, but I don't know why the client file is not served. With the version of the repo (5.7.x) there are neither CORS errors nor problems with serving the file.

I tried a couple of settings of @WebSocketGateway(), moving to a different port, setting serveClient (even though it should be true by default), but nothing seemed to work. Any advice?

thanks

Upvotes: 3

Views: 11554

Answers (3)

CharMstr
CharMstr

Reputation: 323

I had the same problem. i was opening the client side of the application in the web-browser, but directly from my filesystem (i would double click on the file index.html next to the little dummy fake-front-end.js on my desktop for example...). It seems that the CORS problem would persist until i actually accessed the index.html through a proper server. So i created a route on my backend, to serve the index.html, and the fake-front-end.js.

There is a section about CORS on the socket.io officual documentation. And there is a section on the nestjs website, but both didnt really helped in my case.

Upvotes: 0

Divek John
Divek John

Reputation: 131

In my case I replaced

app.useWebSocketAdapter(new WsAdapter(app));

from

import { WsAdapter } from '@nestjs/platform-ws';

with

app.useWebSocketAdapter(new IoAdapter(app));

in main .ts from

import { IoAdapter } from '@nestjs/platform-socket.io';

Worked like a charm!

Upvotes: 4

KenavR
KenavR

Reputation: 3899

The problem was that nestjs did separate the lower level platform (socket.io, express, fastify, ...) from the nestjs modules. The websocket module requires to install an underlying platform, for socket.io

npm install --save @nestjs/platform-socket.io

To serve the socket.io client file it seems like there also needs to be an HTTP platform installed, for express

npm install --save @nestjs/platform-express

More info in the migration guide for v6.

Upvotes: 1

Related Questions