Javascript jquery 的 CORS 错误
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25923796/
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
CORS error with jquery
提问by mrHorse
I'm currently working on a project using the cloudapp APIand I'm using jquery. Here is my code:
我目前正在使用cloudapp API开发一个项目，我正在使用 jquery。这是我的代码：
$.ajax({
headers: { "Accept": "application/json"},
type: 'GET',
url: 'http://cl.ly/2wr4',
crossDomain: true,
success: function(data, textStatus, request){
console.log(data);
}
});
When I run this I get 200 OK response and this error in Firefox:
当我运行它时，我在 Firefox 中得到 200 OK 响应和这个错误：
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://cl.ly/2wr4. This can be fixed by moving the resource to the same domain or enabling CORS.
and this error in Google Chrome:
和谷歌浏览器中的这个错误：
XMLHttpRequest cannot load http://cl.ly/2wr4. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
and nothing is logged to the console. Please how can I fix this error?
并且没有任何内容记录到控制台。请问我该如何解决这个错误？
Thanks.
谢谢。
回答by codebased
CORS (Cross-Origin Resource Sharing) is an HTML5 feature that allows one site to access another site's resources despite being under different domain names.
CORS（跨域资源共享）是一项 HTML5 功能，允许一个站点访问另一个站点的资源，尽管它们位于不同的域名下。
The W3C specification for CORS actually does a pretty good job of providing some simple examples of the response headers, such as the key header, Access-Control-Allow-Origin, and other headers that you must use to enable CORS on your web server.
CORS 的 W3C 规范实际上在提供响应标头的一些简单示例（例如密钥标头Access-Control-Allow-Origin、 和其他必须用于在 Web 服务器上启用 CORS 的标头）方面做得非常好。
If you are looking for specific information on how set up CORS on a variety of common web servers, check out the Enable CORS sharing website. http://enable-cors.org/
如果您正在寻找有关如何在各种常见 Web 服务器上设置 CORS 的特定信息，请查看启用 CORS 共享网站。http://enable-cors.org/
Based on the URL that you have given above, I don't think you have a control on that server. Thus, it will simply would not work.
根据您在上面提供的 URL，我认为您无法控制该服务器。因此，它根本行不通。
Even though you have enabled crossDomain: true the server should return you required headers such as:
即使您启用了 crossDomain: true 服务器也应该返回您需要的标头，例如：
Here's a valid server response; the CORS-specific headers are bolded
这是一个有效的服务器响应；特定于 CORS 的标头以粗体显示
HTTP Response:
HTTP响应：
Access-Control-Allow-Origin: http://xyzcom
Access-Control-Allow-Credentials: true
Access-Control-Expose-Headers: FooBar
Content-Type: text/html; charset=utf-8
One thing you can try is this:
您可以尝试的一件事是：
$.ajax({
headers: { "Accept": "application/json"},
type: 'GET',
url: 'http://cl.ly/2wr4',
crossDomain: true,
beforeSend: function(xhr){
xhr.withCredentials = true;
},
success: function(data, textStatus, request){
console.log(data);
}
});
Otherwise, you need to contact API provider.
否则，您需要联系 API 提供商。
回答by backslash
An important note for those newer coders is that everything on http://enable-cors.org/server.htmlassumes you have a server running. If you're new, like I was originally, these type of answers don't help.
对于那些较新的编码人员来说，重要的一点是http://enable-cors.org/server.html上的所有内容都假定您有一台正在运行的服务器。如果您是新手，就像我最初一样，这些类型的答案无济于事。
If you've just made some code on your computer, CodePen, etc - you can't configure this.
如果您刚刚在计算机、CodePen 等上编写了一些代码，则无法进行配置。
There's an important difference between server-side and client-side scripting - your jquery is running on the client side (that is, the users computer / browser) and as such there's no such thing as setting the headers there.
服务器端和客户端脚本之间有一个重要的区别 - 您的 jquery 在客户端（即用户计算机/浏览器）运行，因此没有在那里设置标题这样的事情。
I finally started making progress with this issue when I set up my own server and my own PHP files (PHP is server-side, as such its processed on the server - not the browser) and was able to start making requests just fine.
当我设置自己的服务器和自己的 PHP 文件（PHP 是服务器端，因此它在服务器上处理 - 而不是浏览器）时，我终于开始在这个问题上取得进展，并且能够很好地开始发出请求。
Adding this for anyone who is being drowned in answers involving the "Header set Access-Control-Allow-Origin "*"answer. It really frustrated me when I started as well.
为那些被涉及答案的"Header set Access-Control-Allow-Origin "*"答案淹没的人添加这个。当我开始的时候也真的让我很沮丧。
回答by Bassel
to fix the error, you need to enable CORS on the server. The client expects to see CORS headers sent back in order to allow the request. It might even send a preflight request to make sure that the headers are there.
要修复错误，您需要在服务器上启用 CORS。客户端希望看到发回的 CORS 标头以允许请求。它甚至可能发送预检请求以确保标头在那里。
You can enable CORS server side for one, multiple, or all domains hitting your server. The configuration is different depending on the type of your server.
您可以为一个、多个或所有访问您的服务器的域启用 CORS 服务器端。配置因服务器类型而异。
Refer to the following page for more info : http://enable-cors.org/server.html
有关更多信息，请参阅以下页面：http: //enable-cors.org/server.html
You already enabled CORS requests in your request above, so client side you should be all set.
您已经在上面的请求中启用了 CORS 请求，因此客户端应该已准备就绪。
回答by Chris Dormani
To get rid of the cors errors, You need to modify the jQuery min file.
要摆脱 cors 错误，您需要修改 jQuery min 文件。
