Javascript cross-domain access solution _javascript Tips

Source: Internet
Author: User
Tags script tag domain server in domain to domain
There are two types of situations:
One, access to the page between subdomains based on the same parent domain; see the following 3 domain domains: taobao.com, jipiao.taobao.com, promotion.taobao.com; they have the same parent domain taobao.com.
Second, based on the different parent domain pages between the access; see the following 3 domain domains: taobao.com, baidu.com, sina.com.cn; they have different parent domains.

Solutions to cross domains between them are:
Scenario 1: Server Proxy
Domain A's page JS needs access to the link under Domain B to obtain data, the scheme in domain A server-side to establish a proxy program (may be ASP, servlet and any other service-side program), domain A page JS directly call the proxy program in this domain, The proxy program is responsible for sending the request to the link under Domain B and obtaining the data, and then using proxy to return the data to the page JS.
After the access process is: Domain A under the JS--> domain A proxy--> Domain B under the link
Example:
First step:
Domain A: http://Jipiao.taobao.com/test.htm
JavaScript script on page:

Copy Code code as follows:

<script type= "Text/javascript" ><!--
Var surl= "Http://Jipiao.taobao.com/proxy.do"; Proxy address under this domain
var callback =
{
Success:function (res) {alert (res.responsetext);},
Failure:function (res) {alert (' failure ');},
argument:{}
}
YAHOO.util.Connect.asyncRequest (' Get ', sURL, callback, NULL);
--></script>

Step Two:
Complete the proxy program on domain A server (assumed to be a servlet here), the pseudo code is as follows:
Copy Code code as follows:

public class Proxy extends .... {
.. Doget (...) {
HttpClient client= ...;
GetMethod get=new GetMethod ("www.baidu.com/xxxxx.do");//access to domain B links
int statusCode = Client.executemethod (get);
if (StatusCode!= httpstatus.sc_ok) {
byte[] Responsebody = Get.getresponsebody ();
String Res=new string (responsebody);
Httpresponse.getwriter (). Write (res),//Return data to Domain A
}
}
}

Scenario 2: Through the script tag:
Write an empty script tag in the head of the Domain A page http://Jipiao.taobao.com/test.htm:
Copy Code code as follows:

<script id= "Remotescript" type= "Text/javascript" src= ""/><!--
<body>
<script type= "Text/javascript" >
Var Remotescript=document.getelementbyid ("Remotescript");
Remotescript.src= "www.baidu.com/xxxxx.do";//link to domain B
alert (remote.test);//using the JSON data returned by Domain B
Alert (f[0]);
--></script>
</body>

Note: This scenario requires that the data returned by Domain B must be in a valid JSON format or in the format of a JS file, such as the data format returned by Domain B as follows:
Var remote={test: ' Hello '};
Var f=[2,1];

Scenario 3: Hide iframe, share domain:
The domain A page http://jipiao.taobao.com/yyyy.htm the page to write a hidden iframe:
Copy Code code as follows:

<body>
<script type= "Text/javascript" ><!--
Document.domain= "Taobao.com";
Var Remotehtml=document.getelementbyid ("remotehtml");
Remotehtml.src= "promotion.taobao.com/xxxx.htm"; Access links to Domain B
var document=remotehtml.contentdocument; Here you can use document to manipulate the data in the page xxx.htm in domain B.
--></script>
<iframe id= "remotehtml" src= "style=" Diapay:none "style=" Diapay:none "/>"
</body>

Note: Here http://promotion.taobao.com/xxxx.htm page also needs to set document.domain= "Taobao.com", this method can be effective.
The method of this iframe does not fit across domains between different parent domains because setting document.domain can only be set to its own parent domain instead of being set to another domain, for example: Jiapiao.taobao.com can only set document.domain= "Taobao.com", and can not be document.domain= "baidu.com";
Each of the three scenarios listed here has advantages and disadvantages:
The advantage of the proxy scheme is that it can be applied to almost all cross-domain access, and only need to be developed in one domain, and the other can provide data of any type format. The disadvantage is that this scenario passes through the intermediate proxy, so the latency may be slightly larger and the load on the domain server is increased, and the development effort is slightly larger.
The script tag's scheme can be said to be very simple, do not need a few lines of code to fix it, but it is a bit strict to return the data format, can only be JSON format data, if the data in other formats, then this method is powerless.
Hiding the IFRAME is also very simple, it can handle any returned data format, but it only applies to a Cross-domain request with the same parent domain, and requires other domains to cooperate with development, that is, the need to set document.domain.
The original post is as detailed as: http://blog.csdn.net/lovingprince/archive/2008/09/20/2954675.aspx
--------------------------------------------------------------------------------
--------------------------------------------------------------------------------
For JS cross-domain access meaning, I would like to add a few points:
Cross-domain access, in short, is the JavaScript code for A website trying to access the B site, including the submission of content and access to content, such as the page a site to execute another B site within a page of the JS object, or want to be in a site page with JS to resolve a page in B site DOM elements, etc. The scenario where this Cross-domain access problem occurs is typically a page embedded in a different domain in an iframe, or an AJAX request being sent to a different domain;
Cross-domain access is prohibited by default for security reasons, but browsers do not prohibit the referencing of JS files in other fields on the page, and are free to execute the function in the JS file being introduced.
Whether Cross-domain judgment rules are compared to three: domain name, protocol, port; if one of the three is not the same, a cross-domain problem occurs; We often say that cross-domain problems generally refer to different domain names because the probability of this scenario is the highest and there are some ways to solve it. , such as the above mentioned Taobao.com domain level two domain name Cross-domain problem;
For the main domain is not the same, or different protocol (such as HTTPS and HTTP) cross-domain problems (such as *.taobao.com domain to access the content of the *.baidu.com domain), want to solve from the web side is completely impossible, only through the server proxy solution;
Common page constraints among different domains DOM elements include:
Window.location can be set, but cannot be read. Other location properties and methods are prohibited;
Document.href can be set, but cannot be read. Other document attributes and methods are prohibited from accessing;
<iframe> src can be set, but cannot be read;

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.