跨源资源共享(CORS)概念 [英] Cross-origin resource sharing (CORS) concept
问题描述
我有一个关于跨域JavaScript概念的问题。
有一个服务器(ex amazon.com),其中只有选定的域可以使用他们的Web服务。
所以,如果我尝试使用他们的服务,从我的本地,我不能。
我在我的控制台上有了这个
跨原始请求被阻止:同源策略不允许读取
远程资源
http://football20.myfantasyleague。 com / 2014 / export?TYPE = rosters& L = 52761& W =& JSON = 0 。
这可以通过将资源移动到相同的域或
来启用CORS来修复。
但是如果某些域名是被选中的域名之一,使用亚马逊的web服务,有一个JavaScript,如果我们包括在我们的html中,它工作。
< script src =http://example.com>脚本>
他们有一个方法来获得Ajax的响应。
我的问题是:
- 当我们从互联网网址引用JavaScript文件时会发生什么。
是否创建了httpRequest,将请求源作为我的域或xyz。
前面的重要信息:如果对端的服务器没有启用它,可以在您的客户端代码中执行,以允许跨源ajax请求。
让我在回答您的问题之前给您一个背景:
同源安全策略< a>
简单地说,同源安全策略确保来自一个来源的脚本不能从其他来源获取内容。现在,为了向您解释原始概念,让我引用维基百科同源安全政策文章的一部分:
下表概述了针对URL http://www.example.com/dir/page.html 。
比较URL结果原因
---------------------------- --------------------------- ------- ---------------- ------
http://www.example.com/dir/page2.html成功相同的协议和主机
http://www.example.com/dir2/other.html成功相同的协议和主机
http://用户名:password@www.example.com/dir2/other.html成功相同的协议和主机
http://www.example.com:81/dir/ other.html失败相同的协议和主机但不同的端口
https://www.example.com/dir/other.html失败不同的协议
http://en.example.com/dir/other .html故障不同的主机
http://example.com/dir/other.html故障不同的主机(需要完全匹配)
http://v2.www.example.com/dir/other。 html失败不同的主机(需要完全匹配)
http://www.example.com:80/dir/other.html依赖端口显式。取决于在浏览器中的实现。
与其他浏览器不同,Internet Explorer不包括计算原点时使用的端口,
因此,例如,您的JavaScript无法从网站下载任何东西服务器,而不是它源自的服务器。这正是为什么你不能将XmlHttpRequests(又名AJAX)转换为其他域名的原因。
CORS是一种方式服务器(而不是浏览器中的客户端代码)可以放松同源政策。
概述跨源资源共享(CORS)。
CORS标准通过添加新的HTTP标头允许服务器将资源提供给允许的源域。
$ c> http://my-cool-site.com ,并且您在网域 http://third-party-site.com 拥有第三方API, code>,您可以通过AJAX访问。
让我们假设您的服务器的一个页面 my-cool-site.com
请求 third-party-site.com
。通常情况下,用户浏览器会根据同源安全性,拒绝对自己的域/子域之外的任何其他网站的AJAX调用政策。但是,如果浏览器和第三方服务器支持CORS,则会发生以下情况:
-
浏览器将发送原始
HTTP标头至 third-party-site.com
原产地:http://my-cool-site.com
-
如果第三方伺服器接受您网域的要求,系统会以 Access-Control-Allow-Origin
HTTP标头回应:
Access-Control-Allow-Origin:http://my-cool-site.com
c> Access-Control-Allow-Origin:*
如果您的网站不允许,浏览器会抛出一个错误。
如果客户端具有相当现代的支持CORS的浏览器和您的第三方服务器
在某些过时的浏览器(例如IE8)中,您必须使用Microsoft-特定 XDomainRequest
对象而不是 XMLHttpRequest
进行调用,这已经过时,所有现代浏览器(包括来自Microsoft)处理CORS在 XMLHttpRequest
。但是,如果您需要支持过时的浏览器,请此页面描述它:
要创建CORS请求,您只需使用 XMLHttpRequest
在Firefox 3.5+,Safari 4+和Chrome和 XDomainRequest
在IE8 +中的对象。当使用 XMLHttpRequest
对象时,如果浏览器发现您正在尝试创建跨网域请求,则会无缝触发CORS行为。
这里是一个javascript函数,可以帮助你创建一个跨浏览器的CORS对象。
function createCORSRequest ){
var xhr = new XMLHttpRequest();
if(withCredentialsin xhr){
// XHR只有支持CORS的'withCredentials'属性
xhr.open(method,url,true);
} else if(typeof XDomainRequest!=undefined){//如果IE使用XDR
xhr = new XDomainRequest();
xhr.open(method,url);
} else {
xhr = null;
}
return xhr;
}
同样,只有过时的浏览器才需要。
上述原因是为什么您不能从脚本中使用Amazon的Web服务。
要回答您的编号的问题:
-
- 如果浏览器位于同一来源,文件将被下载。
$ b $
-
$ b - 如果下载成功,JavaScript文件的内容将被加载到浏览器的内存,解释和执行。
-
I have a question on the concept cross domain JavaScript.
There is server(ex amazon.com) where in only selected domains can use their web-service.
So definitely, if I try to use their service, from my local, I cannot.
I got this on my console
Cross-Origin Request Blocked: The Same Origin Policy disallows reading
the remote resource at
http://football20.myfantasyleague.com/2014/export?TYPE=rosters&L=52761&W=&JSON=0.
This can be fixed by moving the resource to the same domain or
enabling CORS.
PS: I used jquery cross domain way too, but didnt work.
But if some domain who is among the selected ones, to use Amazon's webservice, has a JavaScript, which if we include in our html, it works.
<script src="http://example.com"></script>
They have a method to get response by Ajax.
My questions are:
- What happens when we refer a JavaScript file from an internet url. Do we have a local copy running on our machine?
- Is the httpRequest created, will have a request source as my domain or the xyz.
解决方案 Important note up front: If the server at the other end doesn't enable it, there's nothing you can do in your client-side code that will allow a cross-origin ajax request.
Let me give you a background before answering your question:
Same-Origin Security Policy
Simply put, same-origin security policy makes sure that scripts from one origin may not fetch content from other origins. Now to explain you the concept of origin, let me quote part of the Wikipedia article of Same-Origin Security Policy:
The following table gives an overview of typical outcomes for checks against the URL "http://www.example.com/dir/page.html".
Compared URL Outcome Reason
------------------------------------------------------- ------- ----------------------
http://www.example.com/dir/page2.html Success Same protocol and host
http://www.example.com/dir2/other.html Success Same protocol and host
http://username:password@www.example.com/dir2/other.html Success Same protocol and host
http://www.example.com:81/dir/other.html Failure Same protocol and host but different port
https://www.example.com/dir/other.html Failure Different protocol
http://en.example.com/dir/other.html Failure Different host
http://example.com/dir/other.html Failure Different host (exact match required)
http://v2.www.example.com/dir/other.html Failure Different host (exact match required)
http://www.example.com:80/dir/other.html Depends Port explicit. Depends on implementation in browser.
Unlike other browsers, Internet Explorer does not include the port in the calculation of the origin, using the Security Zone in its place.
So, for example, your JavaScript cannot download anything from (aka, make an HTTP request to) a web server other than the server it originated from. This is exactly why you cannot make XmlHttpRequests (aka AJAX) to other domains.
CORS is one way the server at the other end (not the client code in the browser) can relax the same-origin policy.
An Oversimplified Description about Cross Origin Resource Sharing (CORS).
The CORS standard works by adding new HTTP headers which allow servers to serve resources to permitted origin domains. Browsers support these headers and respect the restrictions they establish.
Example: Say your site is http://my-cool-site.com
and, you have a third party API at domain http://third-party-site.com
, which you can access via AJAX.
And let's assume that a page from your server my-cool-site.com
made a request to third-party-site.com
. Normally, users browser will decline AJAX calls to any other site other than your own domain/subdomain per the Same-Origin Security Policy. But if the browser and the third party server supports CORS, following things happen:
Browser will send and Origin
HTTP header to third-party-site.com
Origin: http://my-cool-site.com
If the third party server accepts requests from your domain, it will respond with an Access-Control-Allow-Origin
HTTP header:
Access-Control-Allow-Origin: http://my-cool-site.com
To allow all domains, third party server can send this header:
Access-Control-Allow-Origin: *
If your site is not allowed, browser will throw an error.
If the client's have fairly modern browsers that support CORS, and your third party server supports CORS as well, CORS can be useful to you.
In some obsolete browsers (IE8, for instance), you have to use a Microsoft-specific XDomainRequest
object instead of XMLHttpRequest
to make a call that will work correctly with CORS; this outdated now, all modern browsers (including from Microsoft) handle CORS in XMLHttpRequest
instead. But if you need to support obsolete browsers, this page describes it:
To make a CORS request you simply use XMLHttpRequest
in Firefox 3.5+, Safari 4+ and Chrome and XDomainRequest
object in IE8+. When using XMLHttpRequest
object, if the browser sees that you are trying to make a cross-domain request it will seamlessly trigger CORS behaviour.
Here is a javascript function that helps you create a cross browser CORS object.
function createCORSRequest(method, url){
var xhr = new XMLHttpRequest();
if ("withCredentials" in xhr){
// XHR has 'withCredentials' property only if it supports CORS
xhr.open(method, url, true);
} else if (typeof XDomainRequest != "undefined"){ // if IE use XDR
xhr = new XDomainRequest();
xhr.open(method, url);
} else {
xhr = null;
}
return xhr;
}
Again, that's only necessary for obsolete browsers.
The above reasons are why you cannot use Amazon's web services from your script. And Amazon server will only allow downloading their JavaScript files to pages served from selected domains.
To answer your numbered questions:
- The file will be downloaded by the browser if it is in the same origin.
- If it is not in the same origin, the file will be downloaded if a CORS request succeeds.
- Or otherwise, downloading the script will fail.
- If the download succeeds, the content of the JavaScript file will be loaded to browser's memory, interpreted, and executed.
See description on CORS to understand.
这篇关于跨源资源共享(CORS)概念的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
CORS标准通过添加新的HTTP标头允许服务器将资源提供给允许的源域。
$ c> http://my-cool-site.com ,并且您在网域 http://third-party-site.com 拥有第三方API, code>,您可以通过AJAX访问。
让我们假设您的服务器的一个页面 my-cool-site.com
请求 third-party-site.com
。通常情况下,用户浏览器会根据同源安全性,拒绝对自己的域/子域之外的任何其他网站的AJAX调用政策。但是,如果浏览器和第三方服务器支持CORS,则会发生以下情况:
-
浏览器将发送原始
HTTP标头至 third-party-site.com
原产地:http://my-cool-site.com
-
如果第三方伺服器接受您网域的要求,系统会以 Access-Control-Allow-Origin
HTTP标头回应:
Access-Control-Allow-Origin:http://my-cool-site.com
c> Access-Control-Allow-Origin:*
如果您的网站不允许,浏览器会抛出一个错误。
如果客户端具有相当现代的支持CORS的浏览器和您的第三方服务器
在某些过时的浏览器(例如IE8)中,您必须使用Microsoft-特定 XDomainRequest
对象而不是 XMLHttpRequest
进行调用,这已经过时,所有现代浏览器(包括来自Microsoft)处理CORS在 XMLHttpRequest
。但是,如果您需要支持过时的浏览器,请此页面描述它:
要创建CORS请求,您只需使用
XMLHttpRequest
在Firefox 3.5+,Safari 4+和Chrome和XDomainRequest
在IE8 +中的对象。当使用XMLHttpRequest
对象时,如果浏览器发现您正在尝试创建跨网域请求,则会无缝触发CORS行为。
这里是一个javascript函数,可以帮助你创建一个跨浏览器的CORS对象。
function createCORSRequest ){
var xhr = new XMLHttpRequest();
if(withCredentialsin xhr){
// XHR只有支持CORS的'withCredentials'属性
xhr.open(method,url,true);
} else if(typeof XDomainRequest!=undefined){//如果IE使用XDR
xhr = new XDomainRequest();
xhr.open(method,url);
} else {
xhr = null;
}
return xhr;
}
同样,只有过时的浏览器才需要。
上述原因是为什么您不能从脚本中使用Amazon的Web服务。
要回答您的编号的问题:
-
- 如果浏览器位于同一来源,文件将被下载。 $ b $
- $ b
- 如果下载成功,JavaScript文件的内容将被加载到浏览器的内存,解释和执行。
I have a question on the concept cross domain JavaScript.
There is server(ex amazon.com) where in only selected domains can use their web-service. So definitely, if I try to use their service, from my local, I cannot. I got this on my console
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://football20.myfantasyleague.com/2014/export?TYPE=rosters&L=52761&W=&JSON=0. This can be fixed by moving the resource to the same domain or enabling CORS.
PS: I used jquery cross domain way too, but didnt work.
But if some domain who is among the selected ones, to use Amazon's webservice, has a JavaScript, which if we include in our html, it works.
<script src="http://example.com"></script>
They have a method to get response by Ajax.
My questions are:
- What happens when we refer a JavaScript file from an internet url. Do we have a local copy running on our machine?
- Is the httpRequest created, will have a request source as my domain or the xyz.
Important note up front: If the server at the other end doesn't enable it, there's nothing you can do in your client-side code that will allow a cross-origin ajax request.
Let me give you a background before answering your question:
Same-Origin Security Policy
Simply put, same-origin security policy makes sure that scripts from one origin may not fetch content from other origins. Now to explain you the concept of origin, let me quote part of the Wikipedia article of Same-Origin Security Policy:
The following table gives an overview of typical outcomes for checks against the URL "http://www.example.com/dir/page.html".
Compared URL Outcome Reason ------------------------------------------------------- ------- ---------------------- http://www.example.com/dir/page2.html Success Same protocol and host http://www.example.com/dir2/other.html Success Same protocol and host http://username:password@www.example.com/dir2/other.html Success Same protocol and host http://www.example.com:81/dir/other.html Failure Same protocol and host but different port https://www.example.com/dir/other.html Failure Different protocol http://en.example.com/dir/other.html Failure Different host http://example.com/dir/other.html Failure Different host (exact match required) http://v2.www.example.com/dir/other.html Failure Different host (exact match required) http://www.example.com:80/dir/other.html Depends Port explicit. Depends on implementation in browser.
Unlike other browsers, Internet Explorer does not include the port in the calculation of the origin, using the Security Zone in its place.
So, for example, your JavaScript cannot download anything from (aka, make an HTTP request to) a web server other than the server it originated from. This is exactly why you cannot make XmlHttpRequests (aka AJAX) to other domains.
CORS is one way the server at the other end (not the client code in the browser) can relax the same-origin policy.
An Oversimplified Description about Cross Origin Resource Sharing (CORS).
The CORS standard works by adding new HTTP headers which allow servers to serve resources to permitted origin domains. Browsers support these headers and respect the restrictions they establish.
Example: Say your site is http://my-cool-site.com
and, you have a third party API at domain http://third-party-site.com
, which you can access via AJAX.
And let's assume that a page from your server my-cool-site.com
made a request to third-party-site.com
. Normally, users browser will decline AJAX calls to any other site other than your own domain/subdomain per the Same-Origin Security Policy. But if the browser and the third party server supports CORS, following things happen:
Browser will send and
Origin
HTTP header tothird-party-site.com
Origin: http://my-cool-site.com
If the third party server accepts requests from your domain, it will respond with an
Access-Control-Allow-Origin
HTTP header:Access-Control-Allow-Origin: http://my-cool-site.com
To allow all domains, third party server can send this header:
Access-Control-Allow-Origin: *
If your site is not allowed, browser will throw an error.
If the client's have fairly modern browsers that support CORS, and your third party server supports CORS as well, CORS can be useful to you.
In some obsolete browsers (IE8, for instance), you have to use a Microsoft-specific XDomainRequest
object instead of XMLHttpRequest
to make a call that will work correctly with CORS; this outdated now, all modern browsers (including from Microsoft) handle CORS in XMLHttpRequest
instead. But if you need to support obsolete browsers, this page describes it:
To make a CORS request you simply use
XMLHttpRequest
in Firefox 3.5+, Safari 4+ and Chrome andXDomainRequest
object in IE8+. When usingXMLHttpRequest
object, if the browser sees that you are trying to make a cross-domain request it will seamlessly trigger CORS behaviour.Here is a javascript function that helps you create a cross browser CORS object.
function createCORSRequest(method, url){ var xhr = new XMLHttpRequest(); if ("withCredentials" in xhr){ // XHR has 'withCredentials' property only if it supports CORS xhr.open(method, url, true); } else if (typeof XDomainRequest != "undefined"){ // if IE use XDR xhr = new XDomainRequest(); xhr.open(method, url); } else { xhr = null; } return xhr; }
Again, that's only necessary for obsolete browsers.
The above reasons are why you cannot use Amazon's web services from your script. And Amazon server will only allow downloading their JavaScript files to pages served from selected domains.
To answer your numbered questions:
- The file will be downloaded by the browser if it is in the same origin.
- If it is not in the same origin, the file will be downloaded if a CORS request succeeds.
- Or otherwise, downloading the script will fail.
- If the download succeeds, the content of the JavaScript file will be loaded to browser's memory, interpreted, and executed.
See description on CORS to understand.
这篇关于跨源资源共享(CORS)概念的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!