Combining socket.js server and NextJS
Answered
Northeast Congo Lion posted this in #help-forum
Northeast Congo LionOP
Essentially. I have an app and when I send a message I have a corresponding api endpoint which saves the endpoint into my database. The problem is that I want to introduce real time features with sockets. I would like to have the socket emit to all other people in the same conversation that the message has been sent. So in the api after i create the message object I want to send it to all others.
However, I cannot seem to get access to the io object in my server.js file at the root of my project to emit this event. I have tried putting all the logic in my api endpoints inside of socket.io. However all that came of this was a bunch of errors since the server.js file cannot take imports from my ts file. I even tried turning the server.js file into a ts one then running ts-node. But the errors came out the same.
Essentially if anyone can help me combine these api endpoints and perform socket.io emitions from them that would solve my issue. I saw someone on youtube who kept on passing along the io object to a special router then kept on using that special router however I am unsure if this is best practice. Any help would be much appreciated.
However, I cannot seem to get access to the io object in my server.js file at the root of my project to emit this event. I have tried putting all the logic in my api endpoints inside of socket.io. However all that came of this was a bunch of errors since the server.js file cannot take imports from my ts file. I even tried turning the server.js file into a ts one then running ts-node. But the errors came out the same.
Essentially if anyone can help me combine these api endpoints and perform socket.io emitions from them that would solve my issue. I saw someone on youtube who kept on passing along the io object to a special router then kept on using that special router however I am unsure if this is best practice. Any help would be much appreciated.
Answered by Toyger
not exactly, it is single server but with different contexts, you have your custom nodejs server that will serve websockets, and some custom routes if you have one, and all other will served by nextjs.
they have it in docs of custom server, first you handle whatever you want, then you pass handler to nextjs context.
so websockets and nextjs is kinda in different contexts, so in your routes code you can only manage client part of websocket, server part of sockets inside server.js
they have it in docs of custom server, first you handle whatever you want, then you pass handler to nextjs context.
so websockets and nextjs is kinda in different contexts, so in your routes code you can only manage client part of websocket, server part of sockets inside server.js
8 Replies
Toyger
you need to have all your logic about websockets inside server.js
if someone send message, you emit event from client to websocket about that, then when websocket receive it and emit message to other participants, you can pass their ids or use socketio rooms or any other thing.
also if you are using vercel it will not work, you can't persist connection of websockets in vercel.
if someone send message, you emit event from client to websocket about that, then when websocket receive it and emit message to other participants, you can pass their ids or use socketio rooms or any other thing.
also if you are using vercel it will not work, you can't persist connection of websockets in vercel.
Northeast Congo LionOP
This makes sense I was able to get the newMessage object back from the API and then emitted a client event which stated that a new message and had the server do the rest
but i was just wondering am i using two different servers with an api routes and a websocket connection? I believe that I am just using one server since socket.io server.js is using the app() function in nextjs. But I am unsure
@Northeast Congo Lion but i was just wondering am i using two different servers with an api routes and a websocket connection? I believe that I am just using one server since socket.io server.js is using the app() function in nextjs. But I am unsure
Toyger
not exactly, it is single server but with different contexts, you have your custom nodejs server that will serve websockets, and some custom routes if you have one, and all other will served by nextjs.
they have it in docs of custom server, first you handle whatever you want, then you pass handler to nextjs context.
so websockets and nextjs is kinda in different contexts, so in your routes code you can only manage client part of websocket, server part of sockets inside server.js
they have it in docs of custom server, first you handle whatever you want, then you pass handler to nextjs context.
so websockets and nextjs is kinda in different contexts, so in your routes code you can only manage client part of websocket, server part of sockets inside server.js
Answer
Northeast Congo LionOP
ok so its kind of like the socket side handles all connections with a specific context of "/socket" or something specific to socket events and the nextjs will make the server handle any other api context and take care of routing and things like this?
@Northeast Congo Lion ok so its kind of like the socket side handles all connections with a specific context of "/socket" or something specific to socket events and the nextjs will make the server handle any other api context and take care of routing and things like this?
Toyger
yeah something like that.
Northeast Congo LionOP
thanks you were really helpful 🎉
ill mark this as resolved