2 years ago
#66987

MrMenchaca
Content-Security-Policy with React, Electron and Webpack
i'm developing an app to show trekking routes with Electron, React and Typescript (also Webpack). But, when i try to load GoogleMaps api, i get the following error:
Refused to load the script 'https://maps.googleapis.com/maps/api/js?callback=__googleMapsCallback&key={MY_KEY}' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' 'unsafe-inline' data:". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback. error
I tried to configure my Content-Security-Policy with webpack like this:
new CspHtmlWebpackPlugin({ 'base-uri': "'self'", 'object-src': "'none'", 'script-src': ["'self'", "'unsafe-inline'", "https:", "https://*.googleapis.com","https://maps.gstatic.com", "'unsafe-eval'"], 'style-src': ["'unsafe-inline'", "'self'", "'unsafe-eval'"], }) plugins
And, if i inspect the header, it looks like it's working: header
reactjs
typescript
webpack
electron
scp
reactjs
typescript
webpack
electron
scp
0 Answers
Your Answer