Custom Application Issue

[nikhilkni]

Hi Community members, I want to ask about my query in which I've been struggling with since a few days back. Please help me. Any help will be appreciated. I built my Chat App in a custom application and I'm trying to integrate this app with my frontend where I encounter an error :

**websocket.js:44 Refused to connect to 'wss://my-node-app-ayn7szpppq-uc.a.run.app/socket.io/?EIO=4&transport=websocket' because it violates the following Content Security Policy directive: "connect-src 'self' app.launchdarkly.com clientstream.launchdarkly.com events.launchdarkly.com app.getsentry.com **
Also, it works fine while I running with the local host but when I deploy the code on the cloud and then I want to live chat with the agent then it is unable to connect and shows the above error.

[kark]

Hi @nikhilkni,
Thank you for getting in touch.
You'd probably need to add wss: to the connect-src directive of the Content Security Policy like so:

 // custom-application-config.mjs
const config = {
  ...,
  headers: {
    csp: {
      'connect-src': ['wss:'],
    },
};

For further details and information, you can refer to the following resource:
https://docs.commercetools.com/custom-applications/api-reference/application-config#headerscsp

[nikhilkni]

Thank you @kark for helping me. Yes, this solution works for me.