vimeo
A bunch of errors "violates the following Content Security Policy directive: script-src 'none'"
We are getting a bunch of errors like this
What are we doing wrong? We are using simple iframes to render vimeo videos and these errors pop up in the console
` [Report Only] Refused to load the script '<URL>' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
888459704:34 [Report Only] Refused to load the script 'https://f.vimeocdn.com/p/4.33.5/js/player.module.js' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
888459704:35 [Report Only] Refused to load the script 'https://f.vimeocdn.com/p/4.33.5/js/vendor.module.js' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
888459704?h=c5387031da:107 [Report Only] Refused to load the script 'https://f.vimeocdn.com/js_opt/modules/utils/vuid.min.js' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
window.loadScript @ 888459704?h=c5387031da:107 window.loadVUID @ 888459704?h=c5387031da:107 (anonymous) @ 888459704?h=c5387031da:118 Promise.then (async) (anonymous) @ 888459704?h=c5387031da:118 vendor.module.js:2 [Report Only] Refused to load the script 'https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
t.loadLibrary @ vendor.module.js:2 (anonymous) @ vendor.module.js:2 t.setup @ vendor.module.js:2 n.init @ player.module.js:2 (anonymous) @ player.module.js:2 (anonymous) @ player.module.js:2 j @ player.module.js:2 (anonymous) @ player.module.js:2 Promise.then (async) init @ player.module.js:2 hv @ player.module.js:2 (anonymous) @ 888459704?h=c5387031da:118 Promise.then (async) (anonymous) @ 888459704?h=c5387031da:118 cast_sender.js?loadCastFramework=1:10 [Report Only] Refused to load the script 'https://www.gstatic.com/cast/sdk/libs/sender/1.0/cast_framework.js' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
E @ cast_sender.js?loadCastFramework=1:10 K @ cast_sender.js?loadCastFramework=1:11 (anonymous) @ cast_sender.js?loadCastFramework=1:11 (anonymous) @ cast_sender.js?loadCastFramework=1:12 cast_sender.js?loadCastFramework=1:10 [Report Only] Refused to load the script 'https://www.gstatic.com/eureka/clank/125/cast_sender.js' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback. `
When looking into issue #1031 this morning, I encountered a similar error stack when running our app in an emulator.
Eventually, the errors just stopped happening
This is all we do - a bunch of iframes on the same page like this:
<iframe src="https://player.vimeo.com/video/891246844?h=391d297fb8" frameborder="0" allow="autoplay; fullscreen; picture-in-picture">
</iframe>
@DATEx2 If you're still encountering these errors, can you provide steps to reproduce? I'm not able to reproduce using the embed code you shared on desktop Chrome.
@rkrishnan8594 We're seeing this issue specifically when we are injecting HTML into a React Native webview which loads the Vimeo SDK via CDN. Interestingly, we do not see the issue when we load a remote webpage into the webview which itself loads the SDK via our own bundle.
Note that we've also verified:
- it was not a code change of ours (checked prior commits)
- it does not seem to be related to the version of the vimeo SDK loaded via the CDN (checked prior versions)
- it does not seem likely to be a browser related issue as react-native-webview uses different drivers between Android/iOS and we are experiencing the issue on both platforms.
We are not using REACT -> instead we are just adding the HTML IFRAME element via javascript to the DOM
You can see it being reporduced here https://datex2wd.bike/products/herox1?options=1,4,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1
In order to investigate this, we'll need a standalone example (in an JSFiddle, Codepen, or something similar) in a sandbox environment where this issue is occurring. This issue shouldn't occur if the player is being loaded within an iframe.
I've put together a jsfiddle that consistently reproduces the error. It occurs in ~1/20 loads which is why there are multiple iframes. It may require a page reload for it to appear
Yeah I think we can all agree this is a thing.
@rkrishnan8594 Any updates on this?
Hey folks, thanks for reporting issues you're experiencing. A couple of thoughts and updates:
- While I'm seeing CSP errors on the JSFiddle that @achung89 shared, I'm not seeing any playback issues, despite numerous reloads.
- I'd like to continue investigating why these CSP errors occur, but given that they're occurring without the Player.js script loaded, it's evident that these errors are not related to this library, so I'm going to close out this issue.
- If you believe you're encountering behavioral issues as a result of these errors, please contact Vimeo support.
- I will follow-up in this thread when we've deployed a fix for these errors.
A few month laters and the errors cambe back again
5[Report Only] Refused to load the script '<URL>' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
Understand this errorAI
player.vimeo.com/video/891246844?h=391d297fb8&loop=0&muted=1&portrait=0&pip=0&byline=0&dnt=1&badge=0&quality=4k&#t=1s:101 [Report Only] Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'none'". Either the 'unsafe-inline' keyword, a hash ('sha256-SWU8eS3ZS7iBu0f95ZwwNtEAnRnYFRs4lLCUGetLyOM='), or a nonce ('nonce-...') is required to enable inline execution.
Understand this errorAI
player.vimeo.com/video/891246844?h=391d297fb8&loop=0&muted=1&portrait=0&pip=0&byline=0&dnt=1&badge=0&quality=4k&#t=1s:103 [Report Only] Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'none'". Either the 'unsafe-inline' keyword, a hash ('sha256-prfNmgM+1Noo+XUaIrDcjH+krmmnFOL6lvseXHv1Cy4='), or a nonce ('nonce-...') is required to enable inline execution.
Understand this errorAI
player.vimeo.com/video/891246844?h=391d297fb8&loop=0&muted=1&portrait=0&pip=0&byline=0&dnt=1&badge=0&quality=4k&#t=1s:107 [Report Only] Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'none'". Either the 'unsafe-inline' keyword, a hash ('sha256-Ea3g+Mv/HV4JJ67/0dtb70BgA2h+v3FhHTYjmyzqLLA='), or a nonce ('nonce-...') is required to enable inline execution.
Understand this errorAI
player.vimeo.com/video/891246844?h=391d297fb8&loop=0&muted=1&portrait=0&pip=0&byline=0&dnt=1&badge=0&quality=4k&#t=1s:108 [Report Only] Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'none'". Either the 'unsafe-inline' keyword, a hash ('sha256-ND6a/gBuWmTyrtyaQzDW6X3noBS4Tpvi2KVdMRHz8ZA='), or a nonce ('nonce-...') is required to enable inline execution.
Understand this errorAI
player.vimeo.com/video/891246844?h=391d297fb8&loop=0&muted=1&portrait=0&pip=0&byline=0&dnt=1&badge=0&quality=4k&#t=1s:115 [Report Only] Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'none'". Either the 'unsafe-inline' keyword, a hash ('sha256-4fEnOxI9VHb+ZqzTHXH+yJ+UXM7cvqLuZ1IGUt8Bn8s='), or a nonce ('nonce-...') is required to enable inline execution.
Understand this errorAI
player.vimeo.com/video/891246844?h=391d297fb8&loop=0&muted=1&portrait=0&pip=0&byline=0&dnt=1&badge=0&quality=4k&#t=1s:117 [Report Only] Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'none'". Either the 'unsafe-inline' keyword, a hash ('sha256-WFy6BmODyKQq1MyqkXYwa6geGi2OAJSWeEYi5DDBNY8='), or a nonce ('nonce-...') is required to enable inline execution.
Understand this errorAI
player.vimeo.com/video/891246844?h=391d297fb8&loop=0&muted=1&portrait=0&pip=0&byline=0&dnt=1&badge=0&quality=4k&#t=1s:119 [Report Only] Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'none'". Either the 'unsafe-inline' keyword, a hash ('sha256-WhdDZATaKbTOIXOCTFLHHIaN4OtttMZZ+MbAkfqxlpk='), or a nonce ('nonce-...') is required to enable inline execution.
Theses errors are occuring on my website now and cause mobile devices to reload the page until it crashes
I'm currently having the same issue on a site I'm working on. We load a bunch of videos from vimeo using the embedded player in an iframe.
Most of the iframe requests come back with just the perfectly valid Content-Security-Policy header.
However, some of the iframe requests also include a Content-Security-Policy-Report-Only header with the e.g. the following value:
script-src 'none'; connect-src 'none'; report-uri https://csp-reporting.cloudflare.com/cdn-cgi/script_monitor/report?m=BhMq4rmgxGddnjdLcXpMhzS10a_fMlj_TkZ4CTcHy5E-1737135954-1.0.1.1-bZHYjJ7ycGS1lk.rU_Vqafnx8lY942n0RmcDSnJUnotI8KQ9dq8_lVyBE0gogKkO0EEKjASzJ_baEUlF2B9eTD11hEncquhYcfiPHC6EWrxCcHAh2.Rwf9orFXTPv5NxH3nZdJ2ASqx03tPZEH_vojyznKJwVvHy_bVj5ELcTOE; report-to cf-csp-endpoint
It's true that the errors are "Report-Only" and thus they don't break functionality. Unfortunately, when iOS encounters a page with "a lot" of errors, it just shuts down the page saying "A problem repeatedly occurred on "thesite.com"" and that's it.
I'm not sure if this has to do with some cloudflare setup injecting this, or if it's 100% intentional, but it's breaking the site. One solution would be to proxy all requests to vimeo, and configure the proxy to hide this header, but that's probably a good way to get banned as a bot.
I will note that I may be wrong in my conjecture about iOS page reload / shutdown being caused 100% by these errors. This may be an unrelated, or an indirectly related issue, but it's just that getting 1512 errors in the console immediately jumps out when trying to debug the issue.
I've noticed that re-fetching the request with this -Report-Only header typically results in a response that DOES NOT have this header anymore. I.e. there is some sort of "sampling" involved in choosing to send this header.
I wanted to help further and copied the fetch request from the browser into a node script and ran it in a loop 100 times with 1 second delay between requests, but when fetching from node (with user-agent and other headers copied into the fetch request init param) I don't get the "culprit header" even once. So this seems to only occur when the iframe is loaded in the browser.
We worked with our security team to disable this setting, so you should not see that message in the console anymore.
Thank you very much for working on this, and for coming back to tell us! I just got reminded about this issue precisely because I opened the dev console and saw no errors! 🎊