javascript - 使用跨源资源共享的跨域 POST 查询没有返回数据

Question

我正在通过 POST 请求跨域发送数据，但响应不起作用，特别是 jQuery 的成功处理程序从未被调用。

正在使用的东西:Django、Apache、jQuery。

因此，我设置了一个与此非常相似的请求:

$.ajax({
    url: "http://somesite.com/someplace",
    type: "POST",
    cache: false,
    dataType: "json",
    data: { ... },
    success: function( msg ) {
        alert(msg);
    },
});

众所周知，CORS允许我适本地响应 OPTIONS 查询说“是的，你可以 POST 给我”。我在做什么。 Firebug 确认我正在获取我的 200 状态代码，并且返回类型实际上是 application/json。但是，Firebug 还确认上面的成功处理程序未被调用。

作为引用，我对OPTIONS 的回应是:

elif request.method == "OPTIONS":
    response = HttpResponse("")
    response['Access-Control-Allow-Origin'] = "*"
    response['Access-Control-Allow-Methods'] = "POST, GET, OPTIONS"
    response['Access-Control-Allow-Headers'] = "X-Requested-With"
    return response

相比之下，如果我设置一个 complete: function()... 处理程序，它就可以工作。

因此，问题是:发生了什么(或没有发生)以及为什么？我正在获取数据，我只是希望能够返回响应。

---

更新:这解决了我在某些浏览器上的问题，但由于我没有对此行为的完整明确解释，所以我将其保持打开状态。

好的，所以我读了the manual据我了解，应用的算法大致是这样的:

1. 用户代理可以实现预检调用。这是 OPTIONS 请求。这个想法是他们发出这个请求，这个请求给他们一个关于所请求资源的答案，然后他们应该缓存这些资源。 我没有传回 max-age 字段，所以我怀疑虽然返回成功并且允许 X 请求，但用户代理的缓存中没有任何东西允许我这样做，所以应用默认规则(隔离请求)。
2. 当您发出实际请求时，我相信用户代理应该检查飞行前缓存的权限。没有我的 max-age 字段，我相信它找不到这些权限。但是，在 POST 上使用相同的 header 进行响应似乎允许 Firefox 和 Google Chrome 浏览器查看响应。歌剧不能。 IE 目前仍未经过测试。

我目前不明白，手册中也不清楚(至少对我而言)CORS 请求是否也应在请求中使用这些 header 以及 OPTIONS 进行回答。我将试验 Max-Age header ，看看允许或不允许的内容。但是，我对这个问题仍然缺乏一些明确的权威理解，所以如果这里有人知道，我会洗耳恭听。

Answer 1

好的，所以我认为正确的做法是这样的:

if request.method == "POST":
    response = HttpResponse(simplejson.dumps(data),mimetype='application/json')
    response['Access-Control-Allow-Origin'] = "*"
    return response
elif request.method == "OPTIONS":
    response = HttpResponse("")
    response['Access-Control-Allow-Origin'] = "*"
    response['Access-Control-Allow-Methods'] = "POST, OPTIONS"
    response['Access-Control-Allow-Headers'] = "X-Requested-With"
    response['Access-Control-Max-Age'] = "1800"
else:
    return HttpResponseBadRequest()

这是基于 documentation I dug up from Mozilla在预检请求上。

所以，我相信会发生的是:

1. 如果预检缓存中没有任何内容，发送 OPTIONS 时将 X-Requested-With 设置为 XMLHttpRequest 我认为这是必要的允许 Javascript 访问任何内容，以及 Origin header 。
2. 服务器可以检查该信息。 这就是 CORS 的安全性。就我而言，我的回应是“任何来源都可以”和“您可以发送 X-Requested-With 东西”。我是说 OPTIONS 和 POST 是允许的，并且这个响应应该缓存 30 分钟。
3. 然后客户端继续进行 POST，这之前是有效的。
4. 我最初修改了响应以包括 Allow-Methods 和 Allow-Headers 但根据上述链接文档中的交流，这不是必需的。这是有道理的，访问检查已经完成。
5. 我相信接下来发生的事情是 resource sharing check described here .基本上，一旦发出上述请求，浏览器就会再次检查 Allow-Origin 字段的有效性，这是针对 POST 等请求。如果通过，客户端可以访问数据，否则，请求已经完成，但浏览器拒绝实际的客户端应用程序 (Javascript) 访问该数据。

我相信这是对正在发生的事情的正确总结，而且在任何情况下它似乎都有效。如果我说的不对，请大声喊叫。