Search code examples
asp.net-corecorsfirefox-addoncross-domainfirefox-addon-webextensions

Firefox add-on: The Same Origin Policy disallows reading the remote resource (Reason: CORS header ‘Origin’ cannot be added)


I have an extension that I develop for Chrome and also upload to Firefox's add-on store. I recently added a feature where the extension makes a cross-domain request to https://tf2metrics.azurewebsites.net to download some json data.

Sample call from the extension:

https://tf2metrics.azurewebsites.net/api/users/76561198142328193,76561198200094518,76561198090551717

The same source code works fine on Chrome, but not for Firefox users.

In the Firefox browser console, this call results in:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://tf2metrics.azurewebsites.net/api/users/76561198142328193,76561198200094518,76561198090551717. (Reason: CORS header ‘Origin’ cannot be added).

My content script runs on https://tf2center.com/lobbies/* with a simple line of jQuery:

$.get(url, function (data) {
    // do stuff
});

I tried adding an Origin header since the error says it "cannot be added":

$.ajaxSetup({
    headers: {
        'Origin': "https://tf2center.com"
    }
});

This extension still does not work on Firefox and additionally fails on Chrome with this call. Error is:

Refused to set unsafe header "Origin"

So I removed that. I browsed a bit and saw that adding

"permissions": [
  "*://*.tf2center.com/*",
  ...
],

to my manifest.json might resolve the issue, but that does not work either.

For reference here is the ASP.NET Core 3.1 Startup.cs code that I originally added to handle CORs when I first needed to support the feature for Chrome:

public void ConfigureServices(IServiceCollection services)
{
    services.AddCors();
    ...
}

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    ...
    app.UseCors(_ => _.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader());
    ...
}

Why does my Chrome extension allow the call and Firefox does not? What else could I try to fix the Firefox-specific error?


Solution

  • I misunderstood what needed to be added to the manifest.json's permissions section. I need to include the URL match pattern I wish to call, not the origin's URL.

    "permissions": [
      "https://tf2metrics.azurewebsites.net/*",
      ...
    ],
    

    I updated to specifically only https calls on my site (not the calling site) and it works now on Firefox.