webRequest redirect not working for extension-files (Cross-domain error)


#1

My Firefox extension should modify the appearance and behavior of a specific website by replacing some of it’s files. To achieve this I tried to use the redirect feature of browser.webRequest.onBeforeRequest. It works for script files which are loaded in a normal way via the main HTML file but when a script tries to load a HTML file via XHR ($http.get by AngluarJS is used) I get the following error:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at
<path-to-file-to-replace>. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

Here are relevant lines of my manifest.json:

"permissions": [
  "webRequest",
  "webRequestBlocking",
  "<all_urls>"
],

"web_accessible_resources": [
  "replacement_file.html",
],

"background": {
  "scripts": ["background.js"]
}

Here is the relevant part of background.js:

function replaceFiles(requestDetails)
{
    if(requestDetails.url == <path-to-file-to-replace>)
        return { redirectUrl: browser.extension.getURL("replacement_file.html") };
}

browser.webRequest.onBeforeRequest.addListener(
  replaceFiles,
  {urls: [<path-to-file-to-replace>]},
  ["blocking"]);

It seems that the replacement file is sent with incorrect headers, can anyone suggest a way to fix this? The same code seems to work under Google Chrome.

A few days ago I posted the same question on stackoverflow.com: https://stackoverflow.com/questions/47848331/webrequest-redirect-not-working-for-extension-files-cross-domain-error