I have tried to add Auth0 to my application, which works locally but when I deploy to an S3 bucket I get the following error:

“Refused to connect to ‘https://dev-.us.auth0.com/oauth/token’ because it violates the following Content Security Policy directive: “default-src ‘self'”. Note that ‘connect-src’ was not explicitly set, so ‘default-src’ is used as a fallback.”

To resolve the issue I have tried to follow the instructions in this article under the ‘Using inline script or style’ header, however even though I can see the changes are being made to the relevant meta tag (see below, taken from the browser) I still get the same error.

<meta http-equiv="Content-Security-Policy" content="base-uri 'self'; object-src 'none'; script-src 'unsafe-inline' 'self' 'unsafe-eval' 'nonce-<hash>=='; style-src 'unsafe-inline' 'self' 'nonce-<hash>=='; connect-src 'self' https://dev-<hash>.us.auth0.com/">

The thing I don’t understand is that it looks like it is totally ignoring the meta tag, because I can see that connect-src is being set in the html used by the browser but then in the console it throws this error which claims that it has not been set. What could be going wrong here?

I tried to add a content security header to a create react app, and I expected the header to be used. However, the header is ignored.