Next.js Discord

Discord Forum

Are Websockets supported by Next.js? Will they work when deployed on Vercel?

Unanswered
Pollock posted this in #help-forum
Open in Discord
PollockOP
I was making a project by following a tutorial and came to know that WebSockets doesn't work in Next.js but the example app seems to be using Websockets and running fine.
Can anyone clarify this?

31 Replies

@Pollock I was making a project by following a tutorial and came to know that WebSockets doesn't work in Next.js but the example app seems to be using Websockets and running fine. Can anyone clarify this?
yes, they are supported. When you only using vercel, they are not supported. You need to have a serverful env. Connect a client component to your server and let your server handle the connections. Then you are good to go 🙂
PollockOP
Can I keep my frontend on Vercel and Backend on Node.js on a seperate server (render), will it work?
@Pollock Can I keep my frontend on Vercel and Backend on Node.js on a seperate server (render), will it work?
yea, that would be fine. You can also deploy everything on vercel and just use the seperate server to handle the websocket connections
Morelet’s Crocodile
It's impossible
@Morelet’s Crocodile It's impossible
it's possible. Read what I wrote and you know how it is possible
@B33fb0n3 it's possible. Read what I wrote and you know how it is possible
Morelet’s Crocodile
Are you going to use AWS lambda for backend?
@Morelet’s Crocodile Are you going to use AWS lambda for backend?
I don't want to build websockets and lambda functions are also serverless (15min up)
@Yacare Caiman There are some doc to make that?
I don't think that's somewhere inside the official docs. Of course there are a lot of unofficial tutorials about it. In this case it's general understanding on how and from where to where a websocket connection is build. And with this general understanding you can apply it to the infrastructure of nextjs
u cant deploy a websocket server using serverless
nodejs serverless functions work like this ->
1. request comes in
2. function runs
3. function returns
websockets need a stable connection that runs infinitely
u can theoritically implement websockets with serverless, but its is highly not recommended
for example u can use cloudflare workers with durable objects
but this comes with many limitations and is also limited and is freemium
@gin but this comes with many limitations and is also limited and is freemium
Yacare Caiman
And what did you recommend?
@Yacare Caiman And what did you recommend?
you might want to open your own thread, as this is the thread from @Pollock
@Yacare Caiman Okey fine
Morelet’s Crocodile
Hi bro, Have you ever used hubspot and WP engine?
@Morelet’s Crocodile Hi bro, Have you ever used hubspot and WP engine?
you might want to ask it inside his thread.
@B33fb0n3 you might want to ask it inside his thread.
Morelet’s Crocodile
Thanks.
I used the hubspot and AWS auto DNS record update but it updated the whole DNS records to Hubspot and website went to 404 because DNS records were pointing to hubspot, so we changed it back to WP engine to bring website back to normal. per the document I only need to confirm the domains without pointing the whole website to Hubspot. read the document carefully
Connect and verify Languex domain and subdomain in Hubspot
Keep the Website on WP Engine
We do not want to point the entire domain (languex.co) to HubSpot because that would break the WP Engine-hosted site.
Our DNS is managed in AWS, and the existing WordPress site must remain live on WP Engine.
Differentiate Forms
Both languex.co and app.languex.co forms currently use the same Name which is under (#ActiveCheckout), making it hard to distinguish which site generated a lead.
Action: Create separate or renamed forms ( Use unique form IDs #WebsiteCheckout vs. ##AppCheckout) so it’s clear where leads originate.
Website checkout form first step URL: https://www.languex.co/order#user-info
App checkout form first step URL: https://app.languex.co/customer/main#upload-documents
Primary Domain in HubSpot
Since languex.co is our main brand, we’ll set languex.co as the primary domain in HubSpot.
Because app.languex.co is already a subdomain of languex.co, we don’t need to add it as a separate (secondary) domain in HubSpot.
Caution: Avoid letting HubSpot override the entire languex.co DNS, which would point the whole site to HubSpot. Only add the necessary verification records.
Note: HubSpot typically does not require you to set a subdomain like app.languex.co as a separate “secondary brand domain.”
As soon as languex.co is recognized in HubSpot, subdomains under it can leverage the same brand domain settings.
Set Up Email Sending from languex.co
To send emails from @languex.co in HubSpot, we must add the required DNS records (in AWS) for verification and authentication.
Action: Update the CNAME (e.g., for www) and SPF (Host: @) records, as provided by HubSpot, without affecting the WP Engine site.
Verify Domains in HubSpot
After updating DNS in AWS, verify the domain in HubSpot for both:
Email Sending (so HubSpot can send on behalf of @languex.co).
Brand Domain (ensuring languex.co is recognized as the primary domain).
Again, ensure the website itself stays on WP Engine.
This is my problem.
@B33fb0n3 you might want to open your own thread as well.
Morelet’s Crocodile
But I need to combine WP engine and HubSpot.
@Morelet’s Crocodile But I need to combine WP engine and HubSpot.
that doesn't matter. It still does not fit into the thread of @Pollock
Create your own thread so others will see your issue as well and help you out of it
@Yacare Caiman Okey fine
Morelet’s Crocodile
Hey,bro. Are you busy at the moment?
@Pollock solved?