SharedArrayBuffer inside Chrome Extension Sandboxed iFrame - sandbox

I am trying to use SharedArrayBuffer by setting up a document that is cross-origin isolated. However since it is in a Google Chrome extension and I need WebAssembly, I need to run this inside a sandboxed page.
I have a sandboxed page which is defined as such in my manifest.json
{
...
"sandbox": {
"pages": ["sandbox.html"]
},
"content_security_policy": {
"sandbox": "sandbox allow-scripts; script-src 'self' 'wasm-eval'; script-src-elem 'self' 'wasm-eval' blob:; worker-src 'self' blob:"
},
"cross_origin_embedder_policy": {
"value": "require-corp"
},
"cross_origin_opener_policy": {
"value": "same-origin"
},
...
}
and I have also enabled cross-origin isolation with COOP and COEP.
The sandbox.html does nothing except use this script:
window.addEventListener('load', () => {
const thing = document.createElement('h1');
thing.innerHTML = self.crossOriginIsolated ? 'GOOD am crossOriginIso' : 'BAD am not crossOriginIso';
document.body.appendChild(thing);
});
Then I have a page outer.html which embeds sandbox.html in an iFrame.
<iframe src="sandbox.html" allow="cross-origin-isolated"></iframe>
When I open outer.html, I get the message "BAD am not crossOriginIso", ie the sandbox.html document inside the iFrame is not cross-origin isolated (and I cannot use SharedArrayBuffer).
Is there a way to enable cross-origin isolation in a Chrome extension with manifest v3 in an iFrame where the inner document is sandboxed (through manifest.json).
Perhaps more specifically, how does one add more featurePolicy.allowedFeatures() to a sandbox iFrame (which is sandboxed in the Chrome extension's manifest.json, not with the sandbox attribute).
I have noted the following things:
Opening sandbox.html directly without the iFrame, the page is cross-origin isolated.
Removing the sandbox attribute in manifest.json results in the document inside the iframe to be cross-origin isolated.
Executing document.featurePolicy.allowedFeatures() inside the iFrame gives a very small list of features (and doesn't include cross-origin-isolated). This list is a lot smaller than executing the same command when opening sandbox.html directly.

In chrome 103, manifest v3, that works well
"content_security_policy": {
"extension_pages": "default-src 'self' 'wasm-unsafe-eval';style-src 'unsafe-inline' 'self' "
},
"cross_origin_embedder_policy": {
"value": "require-corp"
},
"cross_origin_opener_policy": {
"value": "same-origin"
},
don't use sandbox to run ffmpeg.wasm, SharedArrayBuffer is not available in sandbox

Related

Write Chrome extension with Webpack serve

I'm writing a Chrome extension which extends the Developer tools. In the html page of my devtools panel, I want to use webpack in watch mode for fast iteration of the UI. In the extension manifest, I added this entry:
{
"content_security_policy": {
"extension_pages": "default_src: 'self' http://localhost:8081"
}
}
Then in the html page, I specify my script src as:
<script src="http://localhost:8081/devtools.js"></script>
Chrome happily loads my extension, but when it tries to load the html page, it fails with the following error:
Refused to load the script 'http://localhost:8081/devtools.js' because it violates the following Content Security Policy directive: "script-src 'self' 'wasm-unsafe-eval'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
What do I do wrong here?

Include a third-party library as a content script without violating CSP & Intercepting headers

I am currently writing a browser extension that supports Manifest-v2 and v3 which requires the CashJS library (lightweight version of JQuery) for convenience. I would like my content script content/index.js to be able to use this library content/cash.min.js but I get a CSP violation stating:
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-wThdlNeRf1Fp3UGuX3Ch9caqVJ8S7Wn41fdlaVxsRDE='), or a nonce ('nonce-...') is required to enable inline execution.
Here is my manifest.json (for v3):
...
"content_scripts": [{
...
"js": [
"content/cash.min.js",
"content/index.js"
]
}],
...
I have tried using content_security_policy in various ways (hashes & enabling unsafe-inline) but Chrome refuses it:
"content_security_policy": "script-src 'self' 'sha256-wThdlNeRf1Fp3UGuX3Ch9caqVJ8S7Wn41fdlaVxsRDE='; object-src 'self';"
It gives the error Invalid value for 'content_security_policy'. when attempting to load the extension. I have read this page from Mozilla as well as other posts discussing this issue but haven't found a solution that fits my needs.
This article from Chrome's documentation mentions using their sandboxing feature but it only seems to work for webpages, not the scripts themselves.
I really don't want to intercept the headers as proposed here.
Any help would be much appreciated!

How to set Permissions and Content Security Policy for Chrome extension

I'm trying to get my Chrome extension approved and want to understand how I should properly fill in the "permissions" and "csp" sections of the manifest.json. Those parts looks as follows:
...
"permissions": [
"storage",
"http://api.openweathermap.org/data/2.5/weather*"
],
"content_security_policy": "default-src 'self' http://api.openweathermap.org/data/2.5/weather*; script-src 'self'"
...
And that got rejected.
I'm using only:
localStorage to store info about weather;
Openweathermap API to get weather info (JSON).
I don't use any remote scripts.
So, my questions are:
Do I really need a "storage" string if I use localStorage (not a chrome.storage)?
What is a proper way to set a CSP in my case?

Use Firebase for Chrome Extension authentication

I am working on a chrome extension and was about to set up identity authentication when I saw they put a notification on top of the page saying they are migrating authentication to firebase: https://firebase.google.com/docs/web/setup#prerequisites
I'm trying to follow their advice for the "web setup" but I am thinking it must not be the same for extensions because trying to put the initialization code in my background.js I am getting the error:
Refused to load the script 'https://www.gstatic.com/firebasejs/live/3.0/firebase.js' because it violates the following Content Security Policy directive: "script-src 'self' blob: filesystem: chrome-extension-resource:".
Am I loading it in the wrong place or is there simply a different implementation for extensions?
Here is the code to avoid link rot:
// TODO: Replace with your project's customized code snippet
<script src="https://www.gstatic.com/firebasejs/3.0.2/firebase.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: '<your-api-key>',
authDomain: '<your-auth-domain>',
databaseURL: '<your-database-url>',
storageBucket: '<your-storage-bucket>'
};
firebase.initializeApp(config);
I replaced it with my own custom code snippet and I put the embedded link in background.html with the config/init snippit in background.js
You need to download firebase.js and put in in your extension, then load it with a relative url. Your extension isn't allowed to access external scripts.
add this to your manifest.json:
"content_security_policy":"script-src 'self' https://www.gstatic.com/ https://*.firebaseio.com https://www.googleapis.com; object-src 'self'"
this way you will not violates the Content Security Policy as mention in the error you got.

Whitelist multiple domains in content security policy

I am writting a chrome extension that needs to have two domains in its whitelist for the content security policy. I've looked at the official docs, but I still can't seem to figure out the proper syntax.
The following does not seem to work:
"content_security_policy": "script-src 'self' https://foo.com https://example.com; object-src 'self'"
EDIT:
Both my content script and my popup are able to reach foo.com, however, neither can reach example.com.
Are chrome extensions capable of having multiple sources whitelisted in the CSP?
From what I know about CSPs, this looks syntactically correct. The HTML5 Rocks article on CSP agrees with your syntax, saying:
script-src https://host1.com https://host2.com would correctly specify both origins as valid.
However, your problem may be that either:
This CSP disallows all subdomains, including www.foo.com and www.example.com. You can add those subdomain hostnames explicitly, or you can use https://*.foo.com to allow all subdomains.
If any of your script requests redirect to a non-permitted domain, the request will fail. For example, if https://example.com/foo.js responds with a 301 or 302 redirect to https://notpermitted.com/foo.js (not-permitted origin) or https://www.example.com/foo.js (non-permitted subdomain), the request will fail according to the spec:
Whenever the user agent fetches a URI (including when following redirects)... if the URI does not match the allowed script sources, the user agent must act as if it had received an empty HTTP 400 response...
EDIT:
Just to confirm, yes, Chrome extensions can whitelist multiple HTTPS origins. You can build a simple extension to test this:
manifest.json
{
"name":"CSP Test",
"version":"1.0",
"manifest_version":2,
"browser_action":{
"default_popup":"csp_test.html"
},
"content_security_policy": "script-src 'self' https://www.iana.org https://ajax.googleapis.com; object-src 'self'"
}
csp_test.html
<script src="https://www.iana.org/_js/2013.1/jquery.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script src="csp_test.js"></script>
csp_test.js
alert(jQuery)
alert(jQuery.ui)
This extension loads jQuery and jQuery UI from remote domains. If you remove either origin from the CSP, you will see an "undefined" alert signifying that one of the libraries failed to load.
I have face the same problem to whitelist the secure resources URL's with the below warning.
There were warnings when trying to install this extension:
« Ignored insecure CSP value "object-src" in directive 'script-src'.
« CSP directive 'object-src' must be specified (either explicitly, or implicitly via 'default-src') and must whitelist only secure resources.
To resolve HTTP Content-Security-Policy use below key value in manifest.json file.
{
"content_security_policy":
"script-src 'self' https://yash.test.com:8443 'unsafe-eval'; object-src 'self' https://yash.test.com:8443"
}

Resources