javascript XMLHttpRequest 请求的资源上不存在“Access-Control-Allow-Origin”标头
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25045681/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
XMLHttpRequest No 'Access-Control-Allow-Origin' header is present on the requested resource
提问by johncorser
So there are a handful of questions on StackOverflow addressing this error, but of the 10-15 I checked, I could not find a solution to my exact problem.
所以在 StackOverflow 上有一些问题可以解决这个错误，但是在我检查的 10-15 中，我找不到我的确切问题的解决方案。
I am running an Angular app (port 9000) and a Rails app (port 3000) on a remote server. The angular app sends requests to the rails app via a post request.
我在远程服务器上运行一个 Angular 应用程序（端口 9000）和一个 Rails 应用程序（端口 3000）。angular 应用程序通过 post 请求向 rails 应用程序发送请求。
When a request is made, the Javascript console shows this error message:
发出请求时，Javascript 控制台会显示以下错误消息：
XMLHttpRequest cannot load http://0.0.0.0:3000/api/query. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://10.241.16.159:9000' is therefore not allowed access.
From what I've read, I need to change something about my Rails app so that it can accept connection from other servers (which seems odd because both apps are running on the same ec2 instance).
从我读到的内容来看，我需要对我的 Rails 应用程序进行一些更改，以便它可以接受来自其他服务器的连接（这看起来很奇怪，因为两个应用程序都在同一个 ec2 实例上运行）。
I've tried adding a line like
我试过添加一行
skip_before_filter :verify_authenticity_token
to my controller in rails, but this seems to have no effect.
到我在 rails 中的控制器，但这似乎没有效果。
How can I resolve this error?
我该如何解决这个错误？
回答by Skippy Jones
In app/controllers/application_controller.rb:
在 app/controllers/application_controller.rb 中：
before_filter :add_allow_credentials_headers
def add_allow_credentials_headers
# https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS#section_5
#
# Because we want our front-end to send cookies to allow the API to be authenticated
# (using 'withCredentials' in the XMLHttpRequest), we need to add some headers so
# the browser will not reject the response
response.headers['Access-Control-Allow-Origin'] = request.headers['Origin'] || '*'
response.headers['Access-Control-Allow-Credentials'] = 'true'
end
def options
head :status => 200, :'Access-Control-Allow-Headers' => 'accept, content-type'
end
In config/routes.rb:
在 config/routes.rb 中：
match '*any' => 'application#options', :via => [:options]
Note, this is responding to OPTIONS requests which you will need if your Angular front-end is performing POST requests. The bit I am doing with Access-Control-Allow-Credentials is for my app so cookies are sent from the front-end.
请注意，这是响应 OPTIONS 请求，如果您的 Angular 前端正在执行 POST 请求，您将需要这些请求。我对 Access-Control-Allow-Credentials 所做的一点是针对我的应用程序，因此 cookie 是从前端发送的。
I highly suggest that you read the docs in that mozilla link in my code above. It has a very thorough explanation of CORS. You may find that the code above is too permissive for your purposes.
我强烈建议您阅读我上面代码中那个 mozilla 链接中的文档。它对CORS有非常详尽的解释。您可能会发现上面的代码对于您的目的来说过于宽松了。
回答by Richard Peck
In case you've not read up about it yet, let me give you some idea as to what the issue is...
如果你还没有读过它，让我给你一些关于问题是什么的想法......
You've got a problem with the CORS policyof your apps
您的应用的CORS 政策有问题
--
——
CORS (Corss Origin Resource Sharing)
CORS（Corss Origin 资源共享）
When you access an endpointon another server with XHR (XML HTTP REQUEST), your application (although I'm not sure how) will by default DENY access to the requesting resource.
当您使用endpointXHR ( XML HTTP REQUEST)访问另一台服务器上的 时，您的应用程序（虽然我不确定如何）将默认拒绝访问请求资源。
The reason why this happens is to ensure only certain data / resources are made available via XHR, and is why it's used mainly for the likes of APIs.
发生这种情况的原因是为了确保通过 XHR 只提供某些数据/资源，这也是它主要用于 API 之类的原因。
--
——
rack-CORS
机架CORS
Anyway, you need to allow access to your Java application inside your Rails application - which I personally would recommend with the rack-CORSgem:
无论如何，您需要允许在您的 Rails 应用程序中访问您的 Java 应用程序 - 我个人建议使用rack-CORSgem：
#Gemfile
gem 'rack-cors'
#config/application.rb
config.middleware.use Rack::Cors do
allow do
origins '*'
resource 'api/jquery', :headers => :any, :methods => [:get, :post]
end
end
This will "allow" the requests from your different applications, fixing the issue for you.
这将“允许”来自不同应用程序的请求，为您解决问题。
回答by Pramod Variya
Try this code
试试这个代码
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Content-Type" />
<add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS"/>
</customHeaders>
</httpProtocol>
inside the <system.webServer>
