Aaron Boteler
Aaron Boteler

Reputation: 91

Trouble setting Content Security Policy correctly for local websocket server on a different port

I am developing an webapp which includes pulling a file from https://immersive-web.github.io/webxr-input-profiles/... and connecting to a local websocket server on the same host (wss://localhost:9001). I have tried a few different combinations of setting the http header to allow this cross communication to no avail.

res.setHeader('Content-Security-Policy',
  "default-src 'self' 'unsafe-inline' https://localhost:* https://immersive-web.github.io/ ; content-src wss://localhost:*");

In chrome, I get these errors:

enter image description here

I did confirm that the http headers are being set:

enter image description here

I figured I have a syntax error somewhere or I am miss understanding the CSP configuration. What could be wrong?

Upvotes: 0

Views: 1882

Answers (1)

Aaron Boteler
Aaron Boteler

Reputation: 91

Figured it out. I had to set the Content-Security-Policy in two places: 1) index.html and 2) express.js middleware code.

The master angular index.html I set:

<meta http-equiv="Content-Security-Policy"
    content="default-src 'self' 'unsafe-inline'; connect-src 'self' 'unsafe-inline' https://*.github.io wss: ;"

And now in my node.js code, I added

  res.setHeader('Content-Security-Policy',
  "connect-src 'self' 'unsafe-inline' https://*.github.io wss: ; default-src 'self' 'unsafe-inline';"

I first was just setting in the index.html file. Now it is working.

Upvotes: 1

Related Questions