Access-Control-Allow-Origin Rails 项目，跨域，没有路由匹配 [OPTIONS]

Question

我正在我的 Rails 项目中实施 API：我有一个示例 HTML 页面来测试我在 rails 网站上的实施...我无法更改发送请求的站点上的编码。（下面的代码）。我必须让我的 rails 项目接受请求。

我已将此包含在我的 ApplicationController

  before_filter :allow_cross_domain_access
  def allow_cross_domain_access
    response.headers["Access-Control-Allow-Origin"] = '*'
    response.headers["Access-Control-Allow-Methods"] = "GET, PUT, POST, DELETE, OPTIONS"
  end

当我使用它 post 到我的网站时，我得到

XMLHttpRequest cannot load http://192.168.1.65:3000/post_everywhere/0/loads. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 404

rails 控制台显示：

  Started OPTIONS "/post_everywhere/0/loads" for 192.168.1.184 at 2015-02-02 09:20:42 -0600
  2015-02-02 09:20:42 FATAL --
  ActionController::RoutingError (No route matches [OPTIONS] "/post_everywhere/0/loads"):

问题是我希望它 POST 不使用 OPTIONS

我这样设置我的路线：

  resources :post_everywhere do
    post :create_account
    post :update_account
    post :validate_account
    post :loads
    post :trucks
  end

我试过了，但它对我不起作用，因为它正在寻找模板：

match 'post_everywhere/0/loads' => 'post_everywhere#loads', :via => [:get, :post, :options]

我无法更改的代码：这是其他站点向我发送信息的方式。

function postLoad(remove) {
    try {
        var postToURL = document.getElementById("postToURL").value;
        var xmlhttp;
        if (window.XMLHttpRequest) xmlhttp=new XMLHttpRequest(); // code for IE7+, Firefox, Chrome, Opera, Safari
        else if (window.ActiveXObject) xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); // code for IE6, IE5
        else alert("Your browser does not support XMLHTTP!");
        xmlhttp.open("POST", postToURL, true);
        xmlhttp.setRequestHeader('Content-Type', "text/xml");
        xmlhttp.send(formatLoadPost(remove));
    }
    catch(e) { alert(e); }
}
function formatLoadPost(remove) {
    try {
        postXML = "<PELoadPostings><PostingAccount>";
        postXML += "<UserName>" + document.getElementById("login").value + "</UserName>";
        postXML += "<Password>" + document.getElementById("password").value + "</Password>";
        postXML += "<ContactName>" + document.getElementById("contactName").value + "</ContactName>";
        postXML += "<ContactPhone>" + document.getElementById("contactPhone").value + "</ContactPhone>";
        postXML += "<ContactFax>" + document.getElementById("contactFax").value + "</ContactFax>";
        postXML += "<ContactEmail>" + document.getElementById("contactEmail").value + "</ContactEmail>";
        postXML += "<CompanyName>" + document.getElementById("companyName").value + "</CompanyName>";
        postXML += "<UserID>" + document.getElementById("userID").value + "</UserID>";
        if (remove) postXML += "</PostingAccount><RemoveLoads>" + document.getElementById("loadData").value + "</RemoveLoads></PELoadPostings>";
        else postXML += "</PostingAccount><PostLoads>" + document.getElementById("loadData").value + "</PostLoads></PELoadPostings>";
        return postXML;
    }
    catch(e) { alert(e); }
}

我已经实施了您的解决方案，现在我明白了：

Started OPTIONS "/api/v3/post_everywhere/loads" for 192.168.1.184 at 2015-02-02 11:40:33 -0600
2015-02-02 11:40:33 INFO -- Processing by Api::V3::PostEverywhereController#loads as */*
2015-02-02 11:40:33 WARN -- WARNING: Can't verify CSRF token authenticity
2015-02-02 11:40:34 INFO --   Rendered text template (0.0ms)
2015-02-02 11:40:34 INFO -- Filter chain halted as :cors_preflight_check rendered or redirected
2015-02-02 11:40:34 INFO -- Completed 200 OK in 131ms (Views: 11.9ms | ActiveRecord: 0.0ms)
Filter chain halted as :cors_preflight_check rendered or redirected

控制台日志

 XMLHttpRequest cannot load http://192.168.1.65:3000/api/v3/post_everywhere/loads. Request header field Content-Type is not allowed by Access-Control-Allow-Headers.

我不想要文本模板，我想引入参数...

但它没有显示参数（XML）

  def loads
    puts params
    render json: { success: true }
  end

我现在终于弄明白了如何 XML 文档...

  def loads
    xml_doc = Nokogiri::XML(request.body.read)
    render json: { success: true }
  end

Answer 1

CORS 要求您在接受任何其他请求之前响应 OPTIONS。 This gist 举例说明如何做到这一点。重要的部分是

before_filter :cors_preflight_check
after_filter :cors_set_access_control_headers

def cors_set_access_control_headers
  headers['Access-Control-Allow-Origin'] = '*'
  headers['Access-Control-Allow-Methods'] = 'POST, GET, PUT, DELETE, OPTIONS'
  headers['Access-Control-Allow-Headers'] = 'Origin, Content-Type, Accept, Authorization, Token'
  headers['Access-Control-Max-Age'] = "1728000"
end

def cors_preflight_check
  if request.method == 'OPTIONS'
    headers['Access-Control-Allow-Origin'] = '*'
    headers['Access-Control-Allow-Methods'] = 'POST, GET, PUT, DELETE, OPTIONS'
    headers['Access-Control-Allow-Headers'] = 'X-Requested-With, X-Prototype-Version, Token'
    headers['Access-Control-Max-Age'] = '1728000'

    render :text => '', :content_type => 'text/plain'
  end
end

这将捕获使用方法 'OPTIONS' 的任何请求，并以正确的 headers 且无内容进行响应。然后客户端应用程序可以发送 post，它将根据您的 routes.rb 文件进行路由。另见 wikipedia's entry

Access-Control-Allow-Origin Rails 项目，跨域，没有路由匹配 [OPTIONS]

Access-Control-Allow-Origin Rails project, Cross Domain, No route matches [OPTIONS]

ruby-on-rails

ruby-on-rails-3

cors