使用 jQuery 和 Tornado 进行跨域资源共享 (CORS)答案

【问题标题】：cross-origin resource sharing (CORS) with jQuery and Tornado使用 jQuery 和 Tornado 进行跨域资源共享 (CORS)
【发布时间】：2012-07-12 21:40:17
【问题描述】：

假设我有一个 Tornado 网络服务器 (localhost) 和一个网页 (othermachine.com)，后者包含需要对 Tornado 服务器进行跨域 ajax 调用的 javascript。

所以我这样设置我的 Tornado：

class BaseHandler(tornado.web.RequestHandler):
    def set_default_headers(self):
        self.set_header("Access-Control-Allow-Origin", "http://www.othermachine.com")
        self.set_header("Access-Control-Allow-Credentials", "true")
        self.set_header("Access-Control-Allow-Methods", "GET,PUT,POST,DELETE,OPTIONS")
        self.set_header("Access-Control-Allow-Headers",
            "Content-Type, Depth, User-Agent, X-File-Size, X-Requested-With, X-Requested-By, If-Modified-Since, X-File-Name, Cache-Control")

我的 javascript 进行了 jQuery 调用：

$.ajax({
    type: 'GET',
    url: "http://localhost:8899/load/space",
    data: { src: "dH8b" },
    success: function(resp){
        console.log("ajax response: "+resp);
    },
    dataType: 'json',
    beforeSend: function ( xhr ) {
        xhr.setRequestHeader('Content-Type', 'text/plain');
        xhr.setRequestHeader('Access-Control-Request-Method', 'GET');
        xhr.setRequestHeader('Access-Control-Request-Headers', 'X-Requested-With');
        xhr.withCredentials = true;
    }
});

但我得到了可爱的XMLHttpRequest cannot load http://localhost:8899/load/space?src=dH8b. Origin http://www.othermachine.com is not allowed by Access-Control-Allow-Origin 错误。我不知道 jQuery / Tornado 的哪一侧（或两者都有？）我没有正确设置。

根据开发工具，这些是 jQuery 请求发送的标头：

请求标头

Accept:*/*
Origin:http://www.othermachine.com
Referer:http://www.othermachine.com/athletes.html?src=BCYQ&msgid=6xjb
User-Agent:Mozilla/5.0 ...

如果我只是从浏览器的 url 字段发出请求，我会得到“200 OK”：

响应标头

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:Content-Type, User-Agent, X-Requested-With, X-Requested-By, Cache-Control
Access-Control-Allow-Methods:GET,POST
Access-Control-Allow-Origin:http://www.othermachine.com
Content-Length:0
Content-Type:text/html; charset=UTF-8
Server:TornadoServer/2.2.1

这是否意味着 Tornado 正在发挥作用？我尝试遵循所有 stackoverflow CORS+jQuery 帖子（例如this）的建议，但无济于事。概念上的 CORS 似乎很简单，但也许我从根本上误解了 CORS 交易中应该发生的事情......请帮忙！提前致谢。

【问题讨论】：

我想通了，请看下面的答案；只要我的 2 天时间限制允许，我会尽快标记它。
我也遇到了这个问题。但是上面的方法不能为我解决。我使用 github.com/globocom/tornado-cors ，一切正常。

标签： javascript jquery cross-domain tornado cors

【解决方案1】：

没关系，编码太晚和太长会导致一个人被错别字大小的东西绊倒。记录一下，这就是 jQuery 所需要的全部内容：

var data = { msgid: "dH8b" },
    url = "http://localhost:8899/load" + '?' + $.param(data);
$.getJSON( url, function(resp){
    console.log("ajax response: "+resp+" json="+JSON.stringify(resp));
});

这就是 Tornado 所需要的一切：

class BaseHandler(tornado.web.RequestHandler):
    def set_default_headers(self):
        self.set_header("Access-Control-Allow-Origin", "http://www.othermachine.com")

使用 jQuery 1.7.2、Tornado 2.2.1。

【讨论】：

【解决方案2】：

尝试将原点设置为：othermachine.com。它应该是一个域名，而不是一个网站地址

【讨论】：

origin 必须是 FQDN，包括方案和端口。