Enabling CORS by addon on firefox causes an error

Question

my code works but not alwasy as like it should as example you can't chat on facebook

var MYADDON_CSP_listener = {
observe : function(aSubject, aTopic, aData) {
  if (aTopic == "http-on-examine-response") {
    let url;

    aSubject.QueryInterface(Components.interfaces.nsIHttpChannel);
    url = aSubject.URI.spec;
    var headers=["Content-Security-Policy: ","Access-Control-Allow-Origin: *","Access-Control-Allow-Methods: POST,GET,DELETE,PUT","Content-Security-Policy-Report-Only: ","X-Content-Security-Policy: ","X-WebKit-CSP: ","X-Frame-Options: ","X-XSS-Protection: 0"];
        for(i=0;i<headers.length;i++)
        {
        bol=headers[i].split(': ');
        aSubject.setResponseHeader(bol[0],bol[1], false);
        }
        //aSubject.setResponseHeader("content-security-policy", '', false);
  }
}
};
var MYADDON_observerService = Components.classes["@mozilla.org/observer-service;1"]
                                .getService(Components.interfaces.nsIObserverService);
MYADDON_observerService.addObserver(MYADDON_CSP_listener, "http-on-examine-response", false);

i had same problem on chrome but i solved it

chrome.webRequest.onHeadersReceived.addListener(function (details) {
    var newheaders =
        [{
            name : "Content-Security-Policy",
            value : "toberemoved"
        }, {
            name : "Content-Security-Policy-Report-Only",
            value : "toberemoved"
        }, {
            name : "X-Content-Security-Policy",
            value : "toberemoved"
        }, {
            name : "X-WebKit-CSP",
            value : "toberemoved"
        }, {
            name : "X-Frame-Options",
            value : "toberemoved"
        }, {
            name : "X-XSS-Protection",
            value : "toberemoved"
        }, {
            name : "Access-Control-Allow-Methods",
            value : "POST, GET, OPTIONS, PATCH, DELETE, PUT"
        }
    ];
    var AccessControlAllowOrigin = true;
    var AccessControlAllowCredentials = true;
    for (z = 0; z < newheaders.length; z++) {
        var isthisshit = false;
        for (i = 0; i < details.responseHeaders.length; i++) {
            if (details.responseHeaders[i].name.toLowerCase() == newheaders[z].name.toLowerCase()) {
                if (newheaders[z].value == "toberemoved") {
                    details.responseHeaders.splice(i, 1);
                } else {
                    details.responseHeaders[i].value = newheaders[z].value;
                }
                isthisshit = true;
            }
        if((typeof details.responseHeaders[i]!="undefined") && (typeof details.responseHeaders[i].name!="undefined"))
        {
        if (details.responseHeaders[i].name.toLowerCase() == "Access-Control-Allow-Origin".toLowerCase()) { 

        for(var is in details.responseHeaders){  if(details.responseHeaders[is].name.toLowerCase() == "Access-Control-Allow-Credentials".toLowerCase()) { AccessControlAllowCredentials=false;  }  }

        if(AccessControlAllowCredentials) {
        details.responseHeaders[i].value='*'; AccessControlAllowOrigin=false; }

         }
        } else { }
        }
        if (!isthisshit && (newheaders[z].value != 'toberemoved')) {
            details.responseHeaders.push(newheaders[z]);
        }
    }
    if(AccessControlAllowOrigin && AccessControlAllowCredentials){ details.responseHeaders.push({name:"Access-Control-Allow-Origin",value:"*"}); }
    return {
        responseHeaders : details.responseHeaders
    };
}, {
    urls : ["<all_urls>"],
    types : ["main_frame", "sub_frame", "stylesheet", "script", "image", "object", "xmlhttprequest", "other"]
},["blocking", "responseHeaders"]);

here is the log

https://2-edge-chat.facebook.com/pull?channel=p_1675691344&seq=0&partition=-2&clientid=368c9db5&cb=7b8p&idle=6&cap=8&msgs_recv=0&uid=1675691344&viewer_uid=1675691344&state=offline üzerindeki uzak kaynağın okunmasına izin vermiyor. (Sebep: CORS üstbilgisi 'Access-Control-Allow-Origin', '*' ile eşleşmiyor.)

this happens when the response headers contains "Access-Control-Allow-Credentials"

you cant send Access-Control-Allow-Origin as * when there is an header "Access-Control-Allow-Credentials" but not sure why this is a problem in all browser

Answer 1

The Mozilla documentation says:

when responding to a credentialed request, server must specify a domain, and cannot use wild carding.

And further:

The origin parameter specifies a URI that may access the resource. The browser must enforce this. For requests without credentials, the server may specify "*" as a wildcard, thereby allowing any origin to access the resource.

source: HTTP access control (CORS)

Your code always sets Access-Control-Allow-Origin: * regardless of circumstances, which is supposed to fail in this case. Check if your request contains an Origin header, you should use its value in Access-Control-Allow-Origin.

update 1

An example of how to use the Origin header:

observerHandler : { observe : function(subject, topic, data) {

   // http interface
   var httpChannel = subject.QueryInterface(Components.interfaces.nsIHttpChannel);
   if(httpChannel == null) {
      return;
   }


   // check origin header
   // was throwing an exception necessary if header is not set, mozilla ?
   var origin;
   try {
      origin = httpChannel.getRequestHeader('Origin');
   } catch(e) {}

   if(!origin) {
      origin = '*';
   }


   // check response header
   // was throwing an exception necessary if header is not set, mozilla ?
   var header;
   try {
      header = httpChannel.getResponseHeader('Access-Control-Allow-Origin');
   } catch(e) {}


   // abort if header has cors already
   if(header == '*' || header == 'null') {
      return;
   }


   // force cross origin
   httpChannel.setResponseHeader('Access-Control-Allow-Origin', origin, false);
}}

source: cors-everywhere-firefox-addon/content/module.js (Disclaimer: I wrote that code)

This uses Origin when it is present and defaults to * when it is not.