CORS on root-level domain redirect not working (www => / or / => www)

Hello world,

I have CORS set up on my own custom domain for certain routes,
for example https://www.ari-web.xyz/api/apis.json and cors
works fine with it, although on https://ari-web.xyz/api/apis.json
as it’s a redirect it does not follow CORS properly, any way
to make root-level domain respect the headers/CORS rules?

Here’s my netlify.toml part which I want redirects to follow:

[[headers]]
    for = "/api/*"

    [headers.values]
        Access-Control-Allow-Origin = "*"
        Access-Control-Allow-Methods = "GET"

[[headers]]
    for = "/api_hash/*"

    [headers.values]
        Access-Control-Allow-Origin = "*"
        Access-Control-Allow-Methods = "GET"

[[headers]]
    for = "/*"

    [headers.values]
        Strict-Transport-Security = "max-age=63072000; includeSubDomains; preload"
        X-Frame-Options = "deny"
        X-Content-Type-Options = "nosniff"
        Content-Security-Policy = "upgrade-insecure-requests"
        X-Permitted-Cross-Domain-Policies = "none"
        Referrer-Policy = "no-referrer"

Some extra info:

Thanks for the answers in advance :slight_smile:

Hi @B00bleaTea

You could try adding the headers for the www too

[[headers]]
    for = "https://www.ari-web.xyz/*"

    [headers.values]
        Strict-Transport-Security = "max-age=63072000; includeSubDomains; preload"
        X-Frame-Options = "deny"
        X-Content-Type-Options = "nosniff"
        Content-Security-Policy = "upgrade-insecure-requests"
        X-Permitted-Cross-Domain-Policies = "none"
        Referrer-Policy = "no-referrer"

Not sure if it will work, but worth a shot perhaps :slight_smile:

1 Like

I did, try something similar: Push a temporary HSTS hack because for netlify broken root-level domains · TruncatedDinosour/website@3cdd7cc · GitHub

Although it got quickly reverted because it did not work: Fuck the HSTS hack does not work! · TruncatedDinosour/website@aa3c4c4 · GitHub

But as of now I just made the root level domain the default and
now planning to go back, although if my hacky thing didn’t work
I doubt this will, maybe worth a try for others :D: Ari::web -> Blog

I’ll mark it as a solution but I can’t really test it anymore :frowning:

I’m unmarking my previous post as the solution @B00bleaTea.

I have tested this, and it doesn’t work. Such headers are not valid.

Any broken setup for us to test this one?

ah, I have no idea then, it’s very weird

(1) Depending on how long this would take, I could revert
my domain to use www again for a bit, although I’m
slightly worried because I don’t want to wait 2 months
again to get back into the HSTS list

(2) Or as @coelmay has said they tested it and it didn’t work,
they might have a setup that is broken (?)

(3) OR or… https://www.ari-web.xyz/ is still a thing, it just
redirects to https://ari-web.xyz/ (unlike previous https://ari-web.xyz/ => https://www.ari-web.xyz/), meaning now the www subdomain
faces the issue, not the root level anymore

>> fetch("https://www.ari-web.xyz/api/apis.json")
Promise { <state>: "pending" }

    Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.ari-web.xyz/api/apis.json. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 301.
    Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.ari-web.xyz/api/apis.json. (Reason: CORS request did not succeed). Status code: (null).

    Uncaught (in promise) TypeError: NetworkError when attempting to fetch resource.

>> fetch("https://ari-web.xyz/api/apis.json")
Promise { <state>: "pending" }

Thanks for that @B00bleaTea!

The headers are expected not to work that way, but we’ve passed this on to the devs to see if there’s any other way around this problem.

1 Like

thanks! let me know if there is :smiley:

Hi @B00bleaTea!

I’d like to understand the situation a bit more.

Is there a reason you can’t use your primary domain to point these requests at?
Looking at the documentation around this error the proposed solution is to use an URL that does not redirect to a different origin: Reason: CORS request external redirect not allowed - HTTP | MDN
I’m not even sure adding the headers to the redirect would help in any way here.

As a workaround: If you’re requesting this URL from a different Netlify site, you can always put a proxy rule in place to avoid CORS altogether:

/ari-web-api/* https://ari-web.xyz/api/:splat 200!
2 Likes

The URL does redirect to a different origin, how
CORS works is by validating domain, subdomain, route and
port iirc and the one that changes is the subdomain,
maybe by adding the CORS headers would help? I’m not sure

And I’m not, I want to make it public generally without
needing any proxies nor redicrects, but I guess this is
not solvable from what I understand from this? The user
needs to do it themselves I guess

Anyway, thank you for updating me on this, have a nice
rest of your day :slight_smile:

1 Like