Rails跨域ajax get请求(CORS)

时间:2016-05-16 13:27:48

标签: ruby-on-rails ajax api cors rack-cors

我试图在我的rails应用中实现google places api。

这是我在尝试使用从ajax请求中获取数据的函数时遇到的错误:

XMLHttpRequest cannot load . Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access.

我正在使用rack-cors gem,并且已将此代码段添加到我的config / application.rb文件中:

config.middleware.insert_before 0, "Rack::Cors" do
      allow do
        origins '*'
        resource '*', :headers => :any, :methods => [:get, :post, :options]
      end
    end

这是我视图中的ajax请求(coffeescript):

    $.ajax
      url: url
      dataType: "json"
      type: "GET"

我已将此部分添加到我的application_controller

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, OPTIONS'
headers['Access-Control-Allow-Headers'] = '*'
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, OPTIONS'
  headers['Access-Control-Allow-Headers'] = '*'
  headers['Access-Control-Max-Age'] = '1728000'
  render :text => '', :content_type => 'text/plain'
end
end

这就是我的路线文件

 match '*path' => 'application#cors_preflight_check', :via => :options

我注意到" cors_preflight_check"方法不是由我的请求触发的。 (当我点击视图中的某个链接时,我发出了AJAX请求)

并且我注意到我的请求标头保持不变。

(Access-Control-Allow-Origin未添加到请求标头中)

jsonp不是一个选项,因为地方api

不支持它

尝试了在这些主题中写下的所有内容:

1 个答案:

答案 0 :(得分:0)

  

我试图在我的rails应用中实现google places api。

你似乎对CORS的作用感到困惑。如果您尝试执行ajax调用,例如https://maps.googleapis.com,唯一重要的是CORS标头sent in the response by Google。如果这不起作用,您可能会尝试使用过时的api版本端点。

请按照以下步骤操作: https://developers.google.com/maps/documentation/javascript/examples/place-search

如果您希望应用程序能够向其他域提供数据,那么您将提供CORS标头。但这不太可能导致你的问题,除非你正在做一个由单独的前端消耗的Rails api应用程序。

有关CORS如何工作的教程,请参阅Using CORS

另一方面,CSP (content security policy)允许您为跨域请求设置更宽松的规则。但在这种情况下不应该需要,因为Google为其Web服务提供了CORS标头。