-
-
Notifications
You must be signed in to change notification settings - Fork 202
Description
When using vite plugin vue devtools to develop a chrome extension page, the extension reported the following error:
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' 'wasm-unsafe-eval' 'inline-speculation-rules' http://localhost: * http://127.0.0.1: *". Either the 'unsafe-inline' keyword, a hash ('sha256-FhCISuQOxB+ZEYLZlvQzFWx4//lRqFQPUeFSEkdvsT0='), or a nonce ('nonce-...') is required to enable inline execution.
It seems to be triggered by the following code:
function injectVueHookToIframe(iframe) {
if (iframe.__vdevtools__injected) return
try {
iframe.__vdevtools__injected = true
const inject = () => {
try {
iframe.contentWindow.__VUE_DEVTOOLS_IFRAME__ = iframe
const script = iframe.contentDocument.createElement('script')
script.textContent = `;(${detectIframeApp.toString()})(window, true)`
iframe.contentDocument.documentElement.appendChild(script)
script.parentNode.removeChild(script)
} catch (e) {}
}
inject()
iframe.addEventListener('load', () => inject())
} catch (e) {}
}
The problem is:
// This line attempts to inject inline script blocks
script.textContent = `;(${detectIframeApp.toString()})(window, true)`
iframe.contentDocument.documentElement.appendChild(script)
In chrome extension Manifest V3, there is no way to declare inline script as safe, CSP will prevent code injection and throw errors.
Can the injection method of the code be changed to external code?