Using "no-cors" to distinguish between a network error and a request blocked by CORS #1123
Description
I am not sure if this is the correct place for this but it currently is possible to distinguish between a request blocked by CORS and a request that failed to a network error.
By submitting two requests, one with mode: "cors" and the other with mode: "no-cors"
req. 1 success | req. 2 success | result
yes | N/A | CORS is allowed
no | yes | CORS is disallowed
no | no | Network error
I'm seeing several issues asking for a way to distinguish CORS blocked requests from requests that have failed due to an actual network error and security has come up several times as a reason as to why requests blocked by CORS shouldn't be distinguishable so this seems rather inconsistent with how mode: "cors" requests operate.
Sample code
async function testCors(url) {
//First try to make a request using mode: "cors"
let failed = false;
try {
await fetch(new Request(url, {mode: "cors"}));
} catch {
failed = true;
}
//If the request succeeds, then the page isn't blocked by CORS
if(!failed) {
console.log(url + " is reachable and wasn't blocked by CORS");
return url + " is reachable and wasn't blocked by CORS"
}
//At this point the first request has failed, now we try again but without CORS
let failed2 = false;
try {
await fetch(new Request(url, {mode: "no-cors"}));
} catch {
failed2 = true;
}
if(failed2) {
//If we still can't make a request, then it truly is unreachable
console.log(url + " is unreachable");
return url + " is unreachable";
} else {
//But if it does work, it confirms that the host exists and it is blocking our requests because of CORS
console.log(url + " was blocked due by CORS but is still reachable");
return url + " was blocked due by CORS but is still reachable";
}
}