has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Wirasat · ‎04-14-2019

I created a test scripted rest API and trying to call that from the javascript. However, I am getting the following error message. However, I don't get any error when I call that URL from POSTMan.

ScriptedRESTaspx.aspx:1 Access to XMLHttpRequest at 'https://dev60000.service-now.com/api/x_43436_gmail/sayhello/Hello/Bob' from origin 'http://localhost:27586' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

here is the script that I am trying to run.

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="ScriptedRESTaspx.aspx.vb" Inherits="ScriptedRESTaspx" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<script type="text/javascript">
function sayHello() {
var requestBody = "";

var client = new XMLHttpRequest();

client.open("get", "https://dev60000.service-now.com/api/x_43436_gmail/sayhello/Hello/Bob");

client.setRequestHeader('Accept', 'application/json');
client.setRequestHeader('Content-Type', 'application/json');

//Eg. UserName="admin", Password="admin" for this code sample.
client.setRequestHeader('Authorization', 'Basic ' + btoa('*****' + ':' + '******'));

client.onreadystatechange = function () {
if (this.readyState == this.DONE) {
document.getElementById("demo").innerHTML = this.status + this.response;
}
};
client.send(requestBody);

}

</script>
</div>
</form>
<p id="demo">Click the button to change the text in this paragraph.</p>

<%--<p>
<textarea id="TextArea1" cols="20" name="S1" rows="2"></textarea></p>--%>
<p>
<input id="Button1" type="button" value="button" onclick="sayHello()"/></p>
</body>
</html>

Wirasat · ‎04-15-2019

I was able to fix this issue. Just picked scripted rest API name from REST API drop down in CORS rule and it worked.

View solution in original post

Ashrad1 · ‎08-27-2019

Hi Wirasat,

Can you tell me how you did it?

I've seen your youtube video, you just changed the localhost number.

I've been trying to find out the localhost with port but did found it.

Can you help me out?

Ashrad

sfarkas · ‎12-28-2023

Gup link in #is pointing to a page that no longer exists

My program has no trouble using axios.get() to pull data from a SN table. Although the PUT updates ServiceNow table x_my_table_namewith in Postman, the axios.put call with near the same header items (in my VS Code REACT system) results in Access to XMLHttpRequest at 'https://myinstance.service-now.com/api/now/table/x_my_table_name/b0b6a3241bcb39106c1036ef034bcbe1' from origin 'http://localhost:5173' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

There is no suggestion for how to add a 'Access-Control-Allow-Origin' header to an existing CORS Rule. Furthermore, there is no guidance on what has to be present in the client javascript call to axios to fix or work around this problem. I found the axios instance can be customized

https://blog.logrocket.com/using-axios-set-request-headers/
But, no guidance on what headers to add and what value the header attribute should have.

ServiceNow often allows scripting. If direct editing of the 'Access-Control-Allow-Origin' header is not possible through the CORS form, explore if there are scripting options to customize the response headers.

However, there is no guidance on how to script a solution to the CORS block of HTTP PUT and HTTP POST. Yes, I checked the CORS Rule to allow GET, POST, and PUT for my site calling SN from my PC (localhost:5173).

johanepic · ‎09-19-2021

This is happening because of the CORS (Cross Origin Resource Sharing) . For every HTTP request to a domain, the browser attaches any HTTP cookies associated with that domain. This is especially useful for authentication, and setting sessions. You are doing an XMLHttpRequest to a different domain than your page is on. So the browser is blocking it as it usually allows a request in the same origin for security reasons. You need to do something different when you want to do a cross-domain request.

JSONP ( JSON with Padding ) is a method commonly used to bypass the cross-domain policies in web browsers. You’re on domain example.com , and you want to make a request to domain example.nett . To do so, you need to cross domain boundaries. JSONP is really a simple trick to overcome the XMLHttpRequest same domain policy. So, instead of using XMLHttpRequest we have to use < script > HTML tags, the ones you usually use to load JavaScript files , in order for JavaScript to get data from another domain.

Localhost

If you need to enable CORS on the server in case of localhost, you need to have the following on request header.

Access-Control-Allow-Origin: http://localhost:9999