N
Novu2mo ago
Divin

How do i get socket url from Novu?

I'm currently working on integrating Novu for in-app notifications Socket connection and I'm a bit stuck. I need to get the in-app socket URL and also create it properly. Could anyone guide me through the process of obtaining the Novu in-app socket URL and creating it?
20 Replies
Ask Inkeep
Ask Inkeep2mo ago
Hi @Divin, I'm an AI assistant for Novu. While a team member reviews this question, I'll see if I can find relevant sources for your question. ----------------------------- While I generate an answer, here are some sources that might be helpful: * API Reference * React Get Started * Building a chat app with Socket.io and React - Novu * Building a chat app with Socket.io and React Native - Novu -----------------------------
Ask Inkeep
Ask Inkeep2mo ago
Answer To integrate Novu for in-app notifications using a socket connection, you will typically use a default socket URL provided by Novu, unless you're deploying your own backend and want to override it. The default socket URL for Novu is https://ws.novu.co/. If you want to use your own deployed instance instead, you can specify a custom socket URL when initializing the NovuProvider in your application (1) . Here's a basic example of how to set up the NovuProvider with a custom socket URL using React:
import { NovuProvider } from '@novu/notification-center';

function MyApp() {
return (
<NovuProvider
backendUrl="YOUR_BACKEND_URL" // your custom backend URL if applicable
socketUrl="YOUR_CUSTOM_SOCKET_URL" // your custom socket URL
subscriberId="YOUR_SUBSCRIBER_ID"
applicationIdentifier="YOUR_APPLICATION_IDENTIFIER"
>
{/* Your application components that need notification context */}
</NovuProvider>
);
}
import { NovuProvider } from '@novu/notification-center';

function MyApp() {
return (
<NovuProvider
backendUrl="YOUR_BACKEND_URL" // your custom backend URL if applicable
socketUrl="YOUR_CUSTOM_SOCKET_URL" // your custom socket URL
subscriberId="YOUR_SUBSCRIBER_ID"
applicationIdentifier="YOUR_APPLICATION_IDENTIFIER"
>
{/* Your application components that need notification context */}
</NovuProvider>
);
}
This setup ensures that your application can connect to the Novu service via WebSockets and manage notifications accordingly. Make sure to replace "YOUR_CUSTOM_SOCKET_URL", "YOUR_BACKEND_URL", "YOUR_SUBSCRIBER_ID", and "YOUR_APPLICATION_IDENTIFIER" with the actual values corresponding to your environment and Novu application settings.
Ask Inkeep
Ask Inkeep2mo ago
Got it. Tagging @Support for additional help.
Divin
Divin2mo ago
@Pawan Jain Please support
madd
madd2mo ago
If you are building just custom in-app notification center I would suggest to use headless library. But if you need websockets I would take a look at headless source code: https://github.com/novuhq/novu/blob/next/packages/headless/src/lib/headless.service.ts
GitHub
novu/packages/headless/src/lib/headless.service.ts at next · novuhq...
Open-Source Notification Platform. Embeddable Notification Center, E-mail, Push and Slack Integrations. - novuhq/novu
Pawan Jain
Pawan Jain2mo ago
@Divin @Divin Would you like to share more about the issues you are facing with websockets ?
Divin
Divin2mo ago
@Pawan Jain I am receiving notifications with react app as shown in the demo video, but I need to reload each time to get the updated count and notifications. I tried to implement sockets using Socket.IO but I am confused about the Novu socket URL. Can you provide simple steps on how to work with sockets? Where can I find the Novu socket URL? we are using on premise environment for Novu
Pawan Jain
Pawan Jain2mo ago
@Divin it will not be possible to use our socket url independently. it can only be used with any of our client sdks novu socket url is https://ws.novu.co
Divin
Divin2mo ago
@Pawan Jain
No description
Pawan Jain
Pawan Jain2mo ago
what is the backend url you are using with this?
Divin
Divin2mo ago
https://api.novu.infra.experimental.unblock.health this is the backend url, we are using custom environment for novu
Pawan Jain
Pawan Jain2mo ago
Ohh Okay Check the websocket url with your team
Niba Nazar
Niba Nazar2mo ago
Hi @Pawan Jain https://ws.novu.infra.experimental.unblock.health this is the socket url I have added for our self deployed novu do I need to make any changes in the docker compose file or in the env to connect it with the backend URL?
Divin
Divin4w ago
We've integrated Novu in-app notifications using headless coding. Currently, data retrieval relies on connecting to a static backend URL, requiring manual reloads for updates. To address this, we implemented a socket URL with SSL: https://ws.novu.infra.experimental.unblock.health. However, we're still encountering errors. Please advise on troubleshooting steps or potential solutions for the ongoing errors related to the socket URL. Do we need to do anything on the server side to get a proper response from the WebSocket URL? enclosing error screenshot... @Pawan Jain
No description
Divin
Divin4w ago
@Pawan Jain
Novu_Bot
Novu_Bot4w ago
@Divin, you just advanced to level 1!
Pawan Jain
Pawan Jain3w ago
@Divin As you are self hosting Novu, we will not be able to help here. We don't have much information of how you are deploying novu on your infra. here websocket url seems to be correct. Seeing the error, it seems that it is not configured properly internally
nidhin
nidhin2w ago
Hi, let me go over the specifics of the deployment. For the Novu, we are utilizing a container deployment the docker-compose file we used is identical to the one in your repository, located at https://github.com/novuhq/novu/tree/next/docker/local. Additionally, I've included the docker-compose file for your reference. The configuration for the nginx proxy manager, which we are using to route the deployed Novu service, is included below. Please review the files and let me know if there are any updates or changes needed to resolve this problem. I hope you find this information useful.
nidhin
nidhin2w ago
@Pawan Jain
Divin
Divin2d ago
@Pawan Jain