CORS issues when trying to access NASA layers from ArcGIS JS API

Question

I am trying to bring an ImageMapLayer into an ArcGIS JS API project. The layer is here:

https://maps.disasters.nasa.gov/ags04/rest/services/ca_fires_202008/sentinel2/MapServer

I am creating the layer like this:

export const SC2Sept29 = new MapImageLayer({
    url:
        'https://maps.disasters.nasa.gov/ags04/rest/services/ca_fires_202008/sentinel2/MapServer',
});

When adding it to the map, I get the classic cors error:

Access to fetch at 'https://maps.disasters.nasa.gov/ags04/rest/services/ca_fires_202008/sentinel2/MapServer/547
?f=json' from origin 'https://8080-ea244033-ed39-4cd4-86f7-6fb2cfbea40b.ws-us02.gitpod.io' 
has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the 
requested resource. If an opaque response serves your needs, set the request's mode to 
'no-cors' to fetch the resource with CORS disabled.

I was under the impression that NASA's GIS/ESRI data is available for public use. Are their servers not configured for CORS? What am I missing here?

Answer 1

1. Check into the webserver, if you are hosting a web application has CORS headers or not
2. The parameter Allow Origin in the portal end Restrict cross-domain requests to your portal
3. Check whether the webserver is been added as a Trusted Server in the application or not, Search for trustedservers in esri/config, and if it is not added, then the CORS issue might arise, giving the error: No-Access-Control-Allow-Origin