Novu•5mo ago

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•5mo 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•5mo 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.

Sources [1] React Get Started

Tomer Barnea•5mo ago

Hey @aylesm were you able to solve this issue?

aylesm•5mo 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•5mo 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•5mo 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.

Gaming

Programming

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