Today is ready to call through JavaScript to ask questions and answers to the content, because of the use of different two-level domain names, encountered a cross-domain problem, although you can use JSON or XML to solve this problem, but we can Access-Control-Allow-Origin
solve the cross-domain problem, the following look at Access-Control-Allow-Origin
A workaround for cross-domain issues.
What is cross-domain?
As the name implies, cross-domain is a different domain name under the resource access, will be blocked by the browser's local security policy, For example www.uedsc.com to Ajax request a wenda.uedsc.com resources, they are actually different two two level domain name, the top-level domain name is uedsc.com, there will be cross-domain access issues.
The following table provides a clear explanation of those that are cross-domain, when they are not part of a cross-domain
URL |
Description |
whether to allow communication |
http://www.a.com/a.js http://www.a.com/ B.js |
under the same domain name |
allow |
http://www.a.com/lab/a.js Http://www.a.com/script/b.js |
different folders under the same domain name |
Allow |
http://www.a.com:8000/a.js http://www.a.com/b.js |
same domain name, different ports |
do not allow |
http://www.a.com/a.js https://www.a.com/b.js |
same domain name, different protocol |
does not allow |
http://www.a. Com/a.js http://170.32.82.74/b.js |
domain name and domain name corresponding IP |
do not allow |
http://www.a.com/a.js Http://script.a.com/b.js |
Same domain name, different level two domain name |
not allowed |
http://www.a.com/a.js HTTP://A.C Om/b.js |
level two domain name and first-level domain name |
not allowed (cookies are not allowed in this case) |
http://www.b.com/a.js http://www . a.com/b.js |
different domain names |
not allowed |
With the understanding of the basic concepts of cross-domain, you can go directly to the topic of this article.
Cross-domain Access workaround
If you are using the PHP language on the server that receives the request, abc.com/b the page header, note that it must be before you output any information:
Specify a trusted domain name to receive response information, recommend header (' access-control-allow-origin:http://a.abc.com ');
Or you can set a resource that responds to any domain name
Use wildcard *, indicates the current server-side call any domain name initiation request, does not recommend the header (' access-control-allow-origin:* ');
Just add a response header to the server Responese headers declaration, a cross-domain request will not be blocked by the browser's homologous security policy!
Attention
When adding a response header responese headers
, allow cross-domain requests for domain names with no slash/or difference, with slash/error:
XMLHttpRequest cannot load abc.com/b. The ' Access-control-allow-origin ' header has a value ' http://A.abc.org/' which is not equal to the supplied Origin. Origin ' http://A.abc.org ' is therefore not allowed access.
header(‘Access-Control-Allow-Origin:*‘);
is a HTML5 new standard feature, so IE10 the following versions of the browser is not supported, so if the requirements of IE9 or lower version of Internet Explorer, will lead to the use of such a way cross-domain requests and delivery Cookie
of the plan aborted, eventually return to JSONP, the current mainstream The processing method is to use JSONP, easy to implement, compatibility is good, can be found a lot of information.
After a cross-domain resolution, if you want to do so Cookie
, you still have to add the response header:
Header (' access-control-allow-credentials:true ');
To set the properties of the XMLHttpRequest object to withCredentials
true
, jquery1.5.1+ begins to provide the appropriate fields, using the following methods:
$.ajax ({url: "b.abc.com", xhrfields:{withcredentials:true}, crossdomain:true});
The requests that are set up withCredentials
true
will contain all of the a.abc.com side Cookie
, and these Cookie
still follow the same Origin policy, so you can only access cookies within and abc.com/b the same root domain, but not other domains.
Access-Control-Allow-Origin
In fact, HTML5 cross-origin Resource sharing implementation of the most important point parameter configuration.
Cross-origin Resource sharing, cross-domain resource sharing, or CORS, can be used as a cross-domain request and response solution.
Attached: Disabling browser security Policy
Disable chrome Local Security policy and initiate AJAX requests without a server environment:
Chrome Desktop Shortcuts Right-click on the "Target" box under the Shortcut tab to restart your --disable-web-security
browser
(turn) Access-control-allow-origin cross-domain problem in HTML5 development