CleverTap / clevertap-web-sdk

CleverTap Web SDK
https://clevertap.com/
MIT License
14 stars 18 forks source link

Violating Content Security Policy directive #57

Closed DivyaJariwala610 closed 1 year ago

DivyaJariwala610 commented 2 years ago

I've implemented the code in the project and after running, it ends up with this error:

Refused to load the script 'https://us1.clevertap-prod.com/a?t=96&type=page&d=N4IglgJiBcICoFEDKcC0BOAHJ1B2AWgKyoBKALAGz4gA0IADgOYwBMdAxkzCABYAufetAD0wgDYB7dgEMxPCQGc%2B0AMwAGDeImMwAO1ogA6vhIBpAPoBhAIIBZAAoxQAdwC29GGrp8x7GAG0AXQBfOmkAMycQMTAAI25nAFNY1AUIAGtUADcARgA6fJYQYOCgAA%3D&rn=4&i=1649835178&sn=0&useIP=true&r=1649835180740' because it violates the following Content Security Policy directive: "script-src 'nonce-9U7THwOdqNKAWeKl7glt3y==' 'self' https://maps.googleapis.com https://www.googletagmanager.com https://www.google.com/recaptcha/api.js https://cdn.jsdelivr.net/npm/clevertap-web-sdk/clevertap.min.js". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

I'm new to ReactJS app, need your help. Thanks in advance.

KambleSonam commented 2 years ago

Hello Divya. Is the issue resolved ? In your index.html try adding the following line <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *;**script-src 'self' http://onlineerp.solution.quebec 'unsafe-inline' 'unsafe-eval';** "> Do revert if issue still persist.

DivyaJariwala610 commented 2 years ago

Hello Kamble, Solution didn't work for me but I have applied another patch to overcome this issue.

KambleSonam commented 2 years ago

Ok. Thank you. Should I close the issue then ?

DivyaJariwala610 commented 2 years ago

Before closing this issue. We need a robust solution for this. Because we are dealing with the finance on our web so we have blocked all the inline scripts and this is the basic security requirement. In the clever tap library, all the scripts are inline which will create an issue in the future also.

KambleSonam commented 2 years ago

Divya, In React App you can use sdk by importing it as npm pacakge, that should solve the inline issue. Or you can create external js file which will import min.js link.