JQuery AJAX 请求 Sinatra 应用被 CORS 阻挡

Question

我已经苦恼了相当长一段时间。我原以为问题已经解决了，但是它又再次出现了。

以下是我的本地主机上的问题：

OPTIONS http://my.server.com/authorize Origin http://localhost is not allowed by Access-Control-Allow-Origin. jquery-1.8.2.min.js:2
XMLHttpRequest cannot load http://my.server.com/authorize. Origin http://localhost is not allowed by Access-Control-Allow-Origin. 

我正在尝试从客户端向我的Sinatra应用程序发出请求。我的客户端代码如下：

function authorize(token)
{
  $.ajax({
    url: "http://my.server.com/authorize/authorize",
    crossDomain: "true",
    jsonp: "false",
    async: true,
    headers: {"Authorization" : token},
    success: function(data){
      console.log("success");
      window.location = (envHost+"/fb/authenticate");
    }
  });
}

在我的Sinatra应用程序中，我努力启用了CORS。我尝试了以下两种方法：

options '/*' do
  headers['Access-Control-Allow-Origin'] = "*"
  headers['Access-Control-Allow-Methods'] = "GET, POST, PUT, DELETE, OPTIONS"
  headers['Access-Control-Allow-Headers'] ="accept, authorization, origin"
end

并且

before do  
  headers['Access-Control-Allow-Methods'] = 'GET, POST, PUT, DELETE, OPTIONS'
  headers['Access-Control-Allow-Origin'] = '*'
  headers['Access-Control-Allow-Headers'] = 'accept, authorization, origin'
end

即使在我的Apache Passenger虚拟主机中，我也进行了以下添加。

  <Directory    /var/Developer/MySite/public>
   Options     -MultiViews
   AllowOverride All
   Allow       from all
   Header set Access-Control-Allow-Origin "*"
   Header set Access-Control-Allow-Methods: "GET, POST, PUT, DELETE, OPTIONS"
   Header set Access-Control-Allow-Headers: "accept, authorization, origin"
  </Directory>

这真是让人头疼。如果有人能提供指导，关于为什么CORS无法工作，将不胜感激。

- Clayton Selby

---

你不需要使用 jsonp: false 或者 async: true(默认为true)，甚至是 crossdomain: true(如果是跨域请求，默认为true)。你在所有浏览器中得到了相同的结果吗？ - Kevin B

谢谢您提供的信息。我已经进行了修改，但问题仍然存在。 - Clayton Selby

Answer 1

我已找到解决问题的答案。最初，我通过我的 sites-available/defaults 文件和 Sinatra web 服务路由将头部信息添加到 Passenger Web 服务器中，同时设置了 CORS 响应头信息。这样做导致响应头信息包含有关允许的来源、方法等重复的头部信息。

一旦我从 Web 服务器中移除了头部信息，并在 Web 服务路由中保留它们，我的请求就能够成功通过。

- Clayton Selby