How to override Facebook CSP in Firefox Add-on

Question

Facebook must have changed something in their Content Security Policy header, because my Firefox Add-on suddenly stopped working.

I need to get a remote XML file, using XMLHttpRequest , and my domain of course isn't included in Facebook CSP (in Firefox console, I see an error with the connect-src policy of the page). It was working like a charm, until today.

It is worth nothing that Firefox Add-ons should not be affected by CSP of the server (this in theory).

So, I need to override Facebook's CSP in order to get my Add-on working again. I found this code, but it's for Chrome Extensions .

chrome.webRequest.onHeadersReceived.addListener(function (details)
{
    for (i = 0; i < details.responseHeaders.length; i++) {
        if (details.responseHeaders[i].name.toUpperCase() == "X-WEBKIT-CSP") {
            details.responseHeaders[i].value = "default-src *;script-src https://*.feedhound.co https://*.facebook.com http://*.facebook.com https://*.fbcdn.net http://*.fbcdn.net *.facebook.net *.google-analytics.com *.virtualearth.net *.google.com 127.0.0.1:* *.spotilocal.com:* chrome-extension://lifbcibllhkdhoafpjfnlhfpfgnpldfl 'unsafe-inline' 'unsafe-eval' https://*.akamaihd.net http://*.akamaihd.net;style-src * 'unsafe-inline';connect-src https://*.facebook.com http://*.facebook.com https://*.fbcdn.net http://*.fbcdn.net *.facebook.net *.spotilocal.com:* https://*.akamaihd.net ws://*.facebook.com:* http://*.akamaihd.net https://*.feedhound.co";
        }
    }
    return {
        responseHeaders : details.responseHeaders
    };
}, {
    urls : ["*://*.facebook.com/*"],
    types : ["main_frame", "sub_frame", "stylesheet", "script", "image", "object", "xmlhttprequest", "other"]
},
    ["blocking", "responseHeaders"]
);

Someone can help me implementing something similar for a Firefox Add-on?

I already tried an alternative method, adding my own "content-src" security header with setRequestHeader but without any luck.

Thanks, Roberto

Answer 1

Thank you, in the meantime I tried a similar solution, but I found that unfortunately it won't be allowed by Mozilla (my fix has been rejected by the reviewer).

The problem is that modifying CSP headers, by setting a new server response with setResponseHeader , may lead to security issues.

I guess that the only acceptable solution would be to run the code inside the chrome, instead of the content, so it wouldn't be affected by server's CSP.

This was my fix:

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;

    if (/https?:\/\/www.facebook.com\//.test(url)) {

        var csp = aSubject.getResponseHeader("content-security-policy");
        csp = csp.replace('connect-src', 'connect-src http://*.mywebsite.com https://*.mywebsite.com');
        aSubject.setResponseHeader("content-security-policy", csp, 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);

Answer 2

I have the same issue and was able to resolve it. Look at the solution i have posted here https://stackoverflow.com/a/19917664/297113

That may help you.