Can't add Google Analytics code

[artrayd]

Describe the bug Trying to use Google Analytics, but in manifest json it replaces "content_security_policy": "script-src 'self' https://ssl.google-analytics.com; object-src 'self'", with "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",

All the time getting this error: vue-analytics.js:1 Refused to load the script 'https://www.google-analytics.com/analytics.js' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

To Reproduce

1. Add "content_security_policy": "script-src 'self' https://ssl.google-analytics.com; object-src 'self'", to manifest json
2. Build or watch dev

Expected behavior Google analytics should work

Screenshots If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• vue-web-extension version: ...
  • OS: ...
  • Node.js version: ...

Additional context Add any other context about the problem here.

[Kocal]

Hi,

In development mode, the manifest.json file is read and content_security_policy is replaced by script-src 'self' 'unsafe-eval'; object-src 'self', see https://github.com/Kocal/vue-web-extension/blob/master/template/webpack.config.js#L88-L90

This was done to fix #37.

You may want to change that yourself to script-src 'self' 'unsafe-eval' https://ssl.google-analytics.com; object-src 'self'.

Let me know if it works.

[artrayd]

Hi Kocal,

Thank you for answering. No I still have the same error.

vue-analytics.js:1 Refused to load the script 'https://www.google-analytics.com/analytics.js' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' https://ssl.google-analytics.com". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

[Kocal]

Ah, I think it's because you need to specifiy:

• two domains ssl.google-analytics.com and google-analytics.com
• or a wildcard subdomain

Can you try with script-src 'self' 'unsafe-eval' http://google-analytics.com https://*.google-analytics.com; object-src 'self'?

[artrayd]

Thank you!

After editing manifest.json inside "dist" folder I am not getting this error anymore, but there is another warning I can see on a chrome extension page:

'content_security_policy': Ignored insecure CSP value "http://google-analytics.com" in directive 'script-src'.

I am not sure by 100%, but seems like it works.

[Kocal]

Hum, you should not edit the dist/manifest.json file directly. You must edit the src/manifest.json file instead, and do some adjustements in your webpack.config.js if needed.

[artrayd]

Thanks Kocal! Seems like it works after I commented at in webpack.config.js

I used this line for manifest json:

"content_security_policy": "script-src 'self' 'unsafe-eval' https://*.google-analytics.com; object-src 'self'",

And this line I commented in webpack.config.js

          if (config.mode === 'development') {
            jsonContent.content_security_policy = "script-src 'self' 'unsafe-eval'; object-src 'self'";
          }