1 个调用发出 2 个 Ajax 请求，1 个失败，另一个是 CORS答案

【问题标题】：2 Ajax requests are being made from 1 call, 1 is failing the other is CORS1 个调用发出 2 个 Ajax 请求，1 个失败，另一个是 CORS
【发布时间】：2015-10-20 21:22:52
【问题描述】：

我正在开发一个启用了 ASP.NET MVC 5 WEB API 的站点，该站点使用 CORS 来允许两者之间的通信。我的问题是，当我通过 API 进行删除时，我进行了一次 ajax 调用，但发出了两次请求。正如您在下面看到的，一个是常规请求，另一个是符合 CORS 的请求，并且 CORS 请求显然通过了，它正在删除项目。但是我不明白为什么另一个人甚至在那里。有任何想法吗？我已经检查过元素上是否有多个事件处理程序以及与之相关的任何问题。所以它肯定只被调用一次。

REQUEST 1(CORS) - 我实际调用的那个

HTTP/1.1 200 OK
Cache-Control: no-cache
Pragma: no-cache
Expires: -1
Server: Microsoft-IIS/8.5
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: DELETE
X-AspNet-Version: 4.0.30319
X-Powered-By: ASP.NET
Date: Wed, 29 Jul 2015 17:18:09 GMT
Content-Length: 0

请求 2(???)

HTTP/1.1 500 Internal Server Error
Cache-Control: private
Content-Type: text/html; charset=utf-8
Server: Microsoft-IIS/8.5
X-AspNet-Version: 4.0.30319
X-Powered-By: ASP.NET
Date: Wed, 29 Jul 2015 17:18:09 GMT
Content-Length: 8167

删除 AJAX 函数

function deleteItem() {
    console.log(event.target.parentNode.parentNode)
    killParent = event.target.parentNode.parentNode;
    targetID = event.target.id
    confirmDel = confirm("Are you sure you want to delete site #" + targetID + "?");
    if (confirmDel == true) {
         $.ajax({
             type: 'DELETE',
             url: 'http://intranet/APITest/api/sites/' + targetID + '/',
             crossDomain: true,
             success: function() {
                 $("#row" + targetID).remove();
             },
             error: function (error) {
                 alert(error);
             }
         }); 
    } else if(confirmDel == false){
        alert("Site #" + targetID + " was not deleted.")
        return false;
    }
};

【问题讨论】：

ajax目标页面有重定向操作吗？
无，它甚至不刷新，我只是在它成功后删除该行。 API 也不重定向。

标签： jquery asp.net ajax asp.net-mvc-5

【解决方案1】：

由于您使用的是 DELETE，因此第一个可能是 pre-flight OPTIONS request

如果您在浏览器工具中检查第一个实际使用的 HTTP 方法，您可能会在请求中看到类似 OPTIONS http://intranet/APITest/api/sites/123 的内容。

当您发起跨域 AJAX 请求时，浏览器通常会执行其中一项，尤其是在使用 DELETE 等非标准方法时。

来自 MDN 文档（在上面的链接中）：

在 CORS 中，发送带有 OPTIONS 方法的预检请求，因此服务器可以响应是否可以接受发送请求有了这些参数。 Access-Control-Request-Method 标头作为预检请求的一部分通知服务器，当发送实际请求时，将使用 POST 请求方法发送。 Access-Control-Request-Headers 标头通知服务器发送实际请求时，将使用 X-PINGOTHER 发送和 Content-Type 自定义标题。服务器现在有机会确定它是否希望接受根据这些要求的请求情况。

【讨论】：