N
Novu2mo ago
aylesm

Does the notification widget for React support WS service on a path?

I'm deploying the self-hosted version to my infrastructure and have put API and WS services on a path in the same domain eg:

<NovuProvider
backendUrl={"https://testing.something.io/novu-api"}
socketUrl={"https://testing.something.io/novu-ws/"}
subscriberId={'on-boarding-subscriber-id-123'} applicationIdentifier={'RdzeCtzVIJTU'}>

<NovuProvider
backendUrl={"https://testing.something.io/novu-api"}
socketUrl={"https://testing.something.io/novu-ws/"}
subscriberId={'on-boarding-subscriber-id-123'} applicationIdentifier={'RdzeCtzVIJTU'}>
I see lots of websocket requests. But they are all to wss://testing.something.io/socket.io/?EIO=4&transport=websocket Is that correct?
Do I need to a) host the widget myself or b) move WS service to be on it's own sub-domain and remove the path? I also get CORS errors in Chrome, for now I've disabled CORS in Chrome to remove this issue. But feels like I'm missing some config to allow localhost while in development.
6 Replies
Ask Inkeep
Ask Inkeep2mo ago
Hi @aylesm, 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: * Deploy with Docker * Run Novu in local machine * React Get Started * API Reference ----------------------------- Answer For deploying the Novu notification widget using React and configuring the WebSocket (WS) service to work on a path, you can indeed specify the socketUrl as part of the NovuProvider component. According to the official Novu documentation, you can override the default WS service URL by passing your own socketUrl to the NovuProvider. This is intended to allow you to point to your self-hosted WS service (1) . However, if you're experiencing issues with WebSocket requests not correctly appending the specified path (like /novu-ws/), it could be due to how the WebSocket client is initialized or how the server is configured to handle WebSocket connections on paths. In the current Novu documentation and available resources, there isn't a specific mention of needing to adjust server settings or the client initialization to handle WebSocket connections on a specific path beyond just specifying the socketUrl. Regarding your CORS issue, typically, CORS policies need to be configured server-side to allow requests from different origins. If you're seeing CORS errors, it suggests that the server isn't configured to accept requests from the origin you're making the requests from (like localhost during development). You would need to configure your server to include the appropriate Access-Control-Allow-Origin headers. Here are some suggestions based on your situation: 1. WebSocket Path: Ensure that your server configuration supports WebSocket connections on the specified path. This might involve server or proxy configuration to route WebSocket connections correctly. 2. CORS Configuration: Instead of disabling CORS in the browser (which isn't advisable for production), configure your server to respond with appropriate CORS headers. For local
Ask Inkeep
Ask Inkeep2mo ago
development, you can typically set Access-Control-Allow-Origin to * or specifically to http://localhost:<port>. 3. Sub-domain for WebSocket: If configuring the path proves too complex or unreliable, using a sub-domain solely for WebSocket connections (e.g., wss://ws.example.com) might simplify the setup and ensure more predictable behavior. For the WebSocket path issue, you might need to look into how your WebSocket server or proxy is configured to handle incoming WebSocket requests on specific paths. If the problem persists, consider isolating the WebSocket service on its own subdomain to avoid path-related complexities. If you need further customization or encounter specific issues with paths in WebSocket connections, reviewing how WebSocket connections are handled in your server or proxy setup will be crucial. Unfortunately, the current documentation doesn't provide detailed guidance on handling WebSocket connections on specific paths beyond the client setup.
Tomer Barnea
Tomer Barnea2mo ago
Hey @aylesm were you able to solve this issue?
aylesm
aylesm2mo ago
Hey, I have web on a subdomain, haven’t tried ws yet. So that’s my next attempt. I’m running in Kubernetes and it seems like the context paths are only partially supported. Eg web doesn’t work on a path and now the widget trims the path.
Tomer Barnea
Tomer Barnea2mo ago
Keep us updated on that, would love to hear what you did there. Keep in mind that you would need to run the ws for it to function correclty.
aylesm
aylesm2mo ago
👍 OK I've moved ws and api onto their own sub-domains. That's solved the initial issue around CORS. So happy there. I still need to investigate why my socket connection is being blocked.
Want results from more Discord servers?
Add your server
More Posts
Novu Headless - notifications not showing for custom subscriber IDsI have an app that accepts user's first name, last name, and first name. Then, it generates an ID siNot able to see the WEB UI on 4200I have been trying to setup the novu on my local machine after too many tries. i was able to run apiHow can I integrate in-app notifications in React Native?The Novu documentation contains integration guides for 'React' and other web apps. I need to integraGetting error "POST https://mydomain.com/api/v1/widgets/session/initialize 404 (Not Found)my .env example # Root URL REACT_APP_WS_URL=$HOST_NAME/ws API_ROOT_URL=$HOST_NAME/api DISABLE_USER_Firebase is forcing users to migrate from FCM to HTTP v1 (Does Novu supports HTTP v1)??Hi everyone I've got an email from firebase (check the attached email on the bottom) And I was wondWhere to report a broken Novu Cloud API?Looking at the support channel seeing little action, where should I report a broken API endpoint? hCannot get global preference for a subscriber (status: 400)If I try to use the endpoint `https://api.novu.co/v1/subscribers/{subscriberId}/preferences/global` Is there any way to open the notification container automatically when getting new notification?Avatar not showing in notification center when triggering in-app messagesHi everyone, The subscriber's avatar is not showing in the notification center, even after creatingAre there any plans for Echo in Novu cloud?In order to have my workflows defined in code and version control, I should use Echo. If I understa