Bypassing CORS restrictions on background scripts

Add-ons Development
#1

I’m writing an extension that lets you edit an image in an extension and currently I use the chrome.contextMenus.onClicked API to detect when an image is selected, but because the API does not provide the image content itself I need to fetch() it. However, when fetch()'ing the URL, I get a CORS error even in a background script.

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://addons.mozilla.org/user-media/hero-featured-image/brooke-cagle-tLG2hcpITZE-unsplash.jpg?modified=1602004715. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 200.

I’ve included the relevant permissions in my manifest:

  "permissions": [
    "contextMenus",
    "storage",
    "clipboardWrite",
    "http://*/*",
    "https://*/*",
    "file://*/*"
  ],

What else do I need to do to get the background script to be able to make cross origin requests on any site? I have tried both Manifest V3’s host_permissions as well as my current approach with Manifest V2 with Firefox v112.

The full source code for the extension can be found here: https://github.com/kevmo314/magic-copy

#2

Is blacklisted domain, see the full list in the “about:config” page under extensions.webextensions.restrictedDomains key.

Everything else should work fine.

1 Like