react-chrome-extension-boilerplate icon indicating copy to clipboard operation
react-chrome-extension-boilerplate copied to clipboard

Cannot run dev on pages with special CSP

Open tommedema opened this issue 7 years ago • 1 comments

When I navigate to URLs like https://github.com/ColdSauce/CosmosBrowserAndroid I see in my console:

Refused to connect to 'https://localhost:3000/__webpack_hmr_for_injectpage' because it violates the following Content Security Policy directive: "connect-src 'self' uploads.github.com status.github.com api.github.com www.google-analytics.com github-cloud.s3.amazonaws.com wss://live.github.com".

The problem is that the extension's CSP has no influence on the react app, which is injected into the page using a content script. The react app becomes part of the injected website's scope, resulting in the use of the website's (in this case Github's) CSP.

Do you have any idea how to circumvent this?

tommedema avatar Jul 09 '16 16:07 tommedema

This is why I already removed HMR in the injectpage (but todoapp iframe not).

jhen0409 avatar Jul 11 '16 19:07 jhen0409