I'm trying to create Worker on my web page:
const url = URL.createObjectURL(blob);
const worker = new Worker(url);
And Safari displays the following error in console:
Refused to load blob:https://my.address.com/5fa7b5e6-cb10-4b7c-967b-e95cae58cd71 because it appears in neither the child-src directive nor the default-src directive of the Content Security Policy.
I have the following Content-Security-Policy tag on the page:
<meta http-equiv="Content-Security-Policy" content="worker-src 'self' blob:">
But looks like Safari ignores it. I bet I tried all possible combinations of SCP directives (such as worker-src, object-src, script-src, child-src, etc.) and sources (*, blob:, 'unsafe-eval', 'unsafe-inline', etc.)
Appreciate any ideas!
Notes:
Safari does not support worker-src
directive (v 12 was tested) and just ignores it, check the console for Unrecognized Content Security Policy directive 'worker-src'
message.
Fallback chain for worker-src
is: child-src
-> script-src
-> default-src
, therefore to support Safari you have to use child-src
with the same rules as worker-src
. The child-src blob:
works in Safari (push the 'blob:' button to see).
The message because it appears in neither the child-src directive nor the default-src directive of the Content Security Policy
is unclear. Do you already have child-src
/ default-src
with some rules in the policy?
Because <meta http-equiv="Content-Security-Policy" content="worker-src 'self' blob:">
just ignores by Safari and should not block worker.