Search code examples
javascriptcorshttp-headerscross-domainfetch-api

Why Am I Getting a Response type "cors"?

I'm trying to fetch a JavaScript file from another domain using the following code:

const r = await fetch('https://example.com/js/chunk-99EP6AU.js');
console.log({ r });

enter image description here

The response has a type of cors. Does this mean the file is being blocked due to CORS restrictions?

When I use the curl command to check the headers, I see that the file is served with the Access-Control-Allow-Origin: * header:

curl -I https://example.com/js/chunk-99EP6AU.js

HTTP/1.1 200 OK
Content-Type: application/javascript
Content-Length: 1750
Connection: keep-alive
Date: Mon, 27 May 2024 08:15:03 GMT
X-Amz-Replication-Status: COMPLETED
Last-Modified: Thu, 23 May 2024 16:37:11 GMT
Etag: "***********************"
X-Amz-Server-Side-Encryption: AES256
X-Amz-Version-Id: ******.4NfhX3z
Accept-Ranges: bytes
Server: AmazonS3
Vary: Accept-Encoding
Via: 1.1 *********************.cloudfront.net (CloudFront)
X-Xss-Protection: 1; mode=block
X-Frame-Options: DENY
Referrer-Policy: strict-origin-when-cross-origin
X-Content-Type-Options: nosniff
Strict-Transport-Security: max-age=31536000
Vary: Origin
Access-Control-Allow-Origin: *
Content-Security-Policy: frame-ancestors 'none'
X-Cache: Hit from cloudfront
X-Amz-Cf-Pop: TLV50-C2
X-Amz-Cf-Id: -NHmjcimBl39K3VgvBg9s2d**********D9Nw==

Despite the Access-Control-Allow-Origin: * header, why might there still be an issue with CORS?

Solution

  • The response has a type of cors. Does this mean the file is being blocked due to CORS restrictions?

    No it means that the resource can be shared across different origins. CORS means Cross Origin Resource Sharing.

    The Response is successful. Its status code is 200 and its statusText is "OK". You can go ahead and use the Response.

    If the Header of the Response has a key; Content-Type with value; text/javascript, read the Response like so:

    const response = await fetch("https://example.com/js/chunk-99EP6AU.js")
const javascript = await response.text()
console.info("The Javascript as string: ", javascript)