为什么添加额外的标头使AJAX调用失败

AJAX电话：

$.ajax({ url: "http://myserver2:296/api/Demo/HelloWorld", type: "GET", dataType: 'JSONP', jsonp: "callback", headers: { 'API_KEY': 'mykey09090' }, success: function (result) { console.log(result); }, error: ajaxFailed }); function ajaxFailed(xmlRequest) { alert(xmlRequest.status + ' \n\r ' + xmlRequest.statusText + '\n\r' + xmlRequest.responseText); } 

我收到以下错误： Failed to load resource: the server responded with a status of 403 (Forbidden) 。 但是当我使用Postman时，我只需要添加带有http://myserver2:296/api/Demo/HelloWorld url的头文件，它会返回字符串。

我可以请一些帮助来解决这个问题。

我的目标是允许原始服务器和正确提供的API密钥从Web Api获取数据。

Answer 1

将API_KEY标头添加到请求会触发浏览器首先发送CORS预检OPTIONS请求 。 除了定义为CORS-safelisted请求标头的标头之外，您添加到请求的任何标头都将触发您的浏览器发送CORS预检OPTIONS请求。

我无法确定，但看起来你看到的403是来自你的服务器响应OPTIONS请求，并说它不期望获得OPTIONS请求并且不允许它们。

你没有从Postman得到这个的原因是，与浏览器引擎不同，Postman没有实现CORS，所以它不发送OPTIONS请求。 （邮递员不在浏览器为Web应用程序强制执行的同源Web安全模型下运行。）

因此，要使客户端应用程序按预期的方式工作，以便对该服务器进行脚本化跨域访问，您必须配置服务器以正确的方式响应该CORS预检OPTIONS请求。