CORS problem when trying to GET a personal REST API

[Rodrigo Ferrei3]

I'm trying to create a Widget.

In this Widget i'm trying to make a call to my REST API inside Client Script. No matter what I do, I'm always getting this error:

"Access to fetch at 'https://8e4338125958.ngrok.io/api/IDMCatalog?id=RUBENA@contoso.lab' from origin 'https://dev107951.service-now.com' 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."

Here is the fetch code that I'm trying to use:

fetch("https://8e4338125958.ngrok.io/api/IDMCatalog?id=RUBENA@contoso.lab", {method: "GET", headers: {'Access-Control-Allow-Origin':'*'} }).then(function(response){
response.text().then(function(result) {
console.log(result);
})
});

How can I solve this problem?

[Rogers Cadenhe1 · Accepted solution]

Making a webservice call outside ServiceNow in client-side code  is always going to run into CORS policy restrictions.

You could avoid that by doing something like this:

1. create an outbound REST message that calls the ngrok.io URL
   
   
2. write a script include that makes a REST call with the message using the RESTMessageV2 API
   
   
3. call that script include in your client script with GlideAJAX