Issue when fetching card information from device

Question

0.00/5 (No votes)

See more:

Hi
I have an issue when fetching card information from device in windows 11 browser(Chrome, Firefox) but it is working fine in Windows 10
Error:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://127.0.0.1/MyKAD/GetMyKAD?LoadPhoto=NO&VerifyFP=NO&Format=JSON. (Reason: CORS header ‘Access-Control-Allow-Origin’ does not match

I am using VS 2022 and backend is MSSQL 2019. I am using localhost/vms and using CORS.

Pls advice me.
Thank you
Maideen

What I have tried:

I am using this to fetch data from Card on Both windows 10 and window 11. But failed in windows 11.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>

    <script type="text/javascript">
var xmlhttp;
function loadXMLDoc(url)
{
	xmlhttp=null;
	if (window.XMLHttpRequest)
	{// code for IE7, Firefox, Opera, etc.
		xmlhttp=new XMLHttpRequest();
	}
	else if (window.ActiveXObject)
	{// code for IE6, IE5
		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}
	if (xmlhttp!=null)
	{
		xmlhttp.onreadystatechange=state_Change;
		xmlhttp.open("GET",url,true);
		xmlhttp.send(null);
	}
	else
	{
		alert("Your browser does not support XMLHTTP.");
	}
}
function loadMyKAD(fmt)
{
	var url = "";
	if (fmt == "XML") {
		url = document.getElementById("idURIXML").value;
	}
	else if (fmt == "JSON") {
		url = document.getElementById("idURIJSON").value;
	}
	loadXMLDoc(url);
}
function state_Change()
{
	if (xmlhttp.readyState==4) {// 4 = "loaded"
		if (xmlhttp.status==200) {// 200 = "OK"
			document.getElementById('A1').innerHTML=xmlhttp.status;
			document.getElementById('A2').innerHTML=xmlhttp.statusText;
//			document.getElementById('A3').innerHTML=xmlhttp.responseText;

				document.getElementById("A3").innerHTML =
					//"Response:<br>" +
					"<textarea rows=\"8\" cols=\"120\" style=\"border:none;\">" +
					xmlhttp.responseText +
					"</textarea>";
			alert(xmlhttp.responseText);
		}
		else {
			alert("Problem retrieving XML data:" + xmlhttp.statusText);
		}
	}
}
    </script>

</head>
<body>
	<h2>Consume MyKAD Host Web Service Using the HttpRequest Object</h2>

	<p>
		Status:
		<span id="A1"></span>
	</p>

	<p>
		Status text:
		<span id="A2"></span>
	</p>

	<p>
		Response:
		<br /><span id="A3"></span>
	</p>
	<input id="idURIXML" name="URIXML" value="" Style="Width: 60%">
	<button onclick="loadMyKAD('XML')">Get XML</button><br>
	<input id="idURIJSON" name="URIJSON" value="" Style="Width: 60%">
	<button onclick="loadMyKAD('JSON')">Get JSON</button><br>
	<script>
		document.getElementById("idURIXML").value = "http://127.0.0.1/MyKAD/GetMyKAD?LoadPhoto=NO&VerifyFP=NO&Format=XML";
		document.getElementById("idURIJSON").value = "http://127.0.0.1/MyKAD/GetMyKAD?LoadPhoto=NO&VerifyFP=NO&Format=JSON";
	</script>
</body>
</html>

Posted 28-Aug-24 19:11pm

Maideen Abdul Kader

Updated 28-Aug-24 19:27pm

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Richard Deeming · Answer 1 · 2024-08-28T21:34:00

Quote:
CORS header 'Access-Control-Allow-Origin' does not match

You haven't shown any of the CORS headers returned by your site, nor the code that sets them. But the error message is perfectly clear: the headers returned do not match the calling site.

You need to check the URL of the calling site, and the headers returned from the remote site. Use your browser's developer tools in the "network" tab to see the request and response information.