CORS setup not working - Cross-Origin Resource Sharing

PedroReyes commented 1 year ago

Hello,

👁 Context

I am trying to access a json file I have stored in my surge.sh website. The content of the website is:

an HTML file with an empty <body>
the JSON file,
and a CORS file with the content *.

I simply use the next command echo '*' > CORS

❌ Problem

I have followed the next steps: https://surge.sh/help/enabling-cross-origin-resource-sharing

However, when I try to access the json file located here: https://obedient-beam.surge.sh/deployments. Using the next code:

let result = await fetch("http://obedient-beam.surge.sh/deployments", {
    method: "GET",
    headers: new Headers({
      "Content-type": "application/json",
      Accept: "application/json",
    }),
    mode: "no-cors",
    cache: "default",
    credentials: "include",
});
console.log(result);

I get the next opaque empty response as if no CORS had been setup:

Response {type: 'opaque', url: '', redirected: false, status: 0, ok: false, …}
body: null
bodyUsed: false
headers: Headers {}
ok: false
redirected: false
status: 0
statusText: ""
type: "opaque"
url: ""

Thanks in advance for the help.

Best regards, Pedro Reyes.

sintaxi commented 1 year ago

Hi Pedro, I'm curious why are you using mode: 'no-cors'? Doesn't that block content coming from other origins?

PedroReyes commented 1 year ago

Hello @sintaxi ,

If I use mode: 'no-cors' the result is:

Access to fetch at 'https://obedient-beam.surge.sh/deployments' 
(redirected from 'http://obedient-beam.surge.sh/deployments') 
from origin 'http://localhost:6006' has been blocked by CORS policy: 
Response to preflight request doesn't pass access control check: 
The value of the 'Access-Control-Allow-Origin' header in the response
 must not be the wildcard '*' when the request's credentials mode is 'include'

And if I try to remove the mode:

Access to fetch at 'https://obedient-beam.surge.sh/deployments' 
from origin 'http://localhost:6006' has been blocked by CORS policy: 
Response to preflight request doesn't pass access control check: 
It does not have HTTP ok status.

I don't know what I am doing wrong 🤔

fu-sen commented 1 year ago

By any chance, are you using it with Surge Free? Since this is a Surge Professional only feature.

https://surge.sh/help/enabling-cross-origin-resource-sharing It's listed at the bottom of this page. I thought it could be at the top of the page.

PedroReyes commented 1 year ago

Hello @fu-sen ,

You are completely right, I missed that panel. To be honest I thought it was an ad so I ignored him completely from my reading.

The same happened to me with the follow along - I found that repository from the wild internet, not from the docs 😅

Thanks @fu-sen for helping me out.

Best regards, Pedro Reyes.

fu-sen commented 1 year ago

@sintaxi Can you improve this page? If you continue like this, you may encounter the same useless problem in the future.

sintaxi / surge

CORS setup not working - Cross-Origin Resource Sharing #478

👁 Context

❌ Problem