CORS error Calling an external Web API from a landing Page using JQuery


#1

Hi,
I am trying to call an external Web API using jQuery on a landing page. I have enabled CORs on the server and am able to reach the endpoint using a sample web page. However when I add the script to my landing page, I get the following error:
XMLHttpRequest cannot load https://www.foobar.com/api/tests/GetTest. No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

Given below is my sample script.

var apiUrl = ‘https://www.foobar.com/api/tests/GetTest’;

$(document).ready(function(){
$.ajax({
url: apiUrl,
type: ‘Get’,
dataType: ‘text’
}).done(function(data){
alert('Success: ’ + data);
}).error(function (jqXHR, textStatus, errorThrown) { alert('Error: ’ + jqXHR.responseText || textStatus);});
});