JS cross-domain summary_javascript skills-JS Tutorial-php.cn

There are two cases of cross-domain JavaScript:
1. Between subdomains based on the same parent domain, such as: a.c.com and b.c.com
2. Between subdomains based on different parent domains, such as: www.a.com and www.b.com
3. The port is different, such as: www.a.com:8080 and www.a.com:8088
4. The protocol is different, such as: http://www.a. com and https://www.a.com
For situations 3 and 4, it needs to be solved through a background proxy. The specific method is as follows:
a. Create a proxy program under the initiator's domain
b. The initiator's js calls the proxy program under this domain
c. The proxy sends the request to the receiver and obtains the corresponding data
d. The proxy returns the obtained data to the initiator's js
The initiator page code As follows:

Copy code The code is as follows:

The initiator Proxy code is as follows:

Copy code The code is as follows:

 
using System.Data; 
using System.Linq; 
using System.Web; 
using System.Web.Services; 
using System.Web.Services.Protocols; 
using System.Xml.Linq; 
using System.IO; 
using System.Net; 
using System.Text; 
namespace WebApplication1 
{ 
///  
/// Summary description for $codebehindclassname$ 
// /  
[WebService(Namespace = "http://tempuri.org/")] 
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] 
public class Proxy : IHttpHandler 
 { 
const int BUFFER_SIZE = 8 * 1024; 
public void ProcessRequest(HttpContext context) 
{ 
context.Response.ContentType = "text/plain"; 
string src = context.Request ["src"]; 
WebRequest wr = WebRequest.Create(src); 
WebResponse wres = wr.GetResponse(); 
Encoding resEncoding = System.Text.Encoding.GetEncoding("gb2312"); 
StreamReader sr = new StreamReader(wres.GetResponseStream(), resEncoding); 
string html = sr.ReadToEnd(); 
sr.Close(); 
wres.Close(); 
context.Response.Write("



"); 
context.Response.Write(html); 
 } 
public bool IsReusable 
{ 
get 
{ 
return false; 
} 
} 
} 
} 

In addition to using background proxy, there are 7 ways to solve situations 1 and 2:
1. document.domain iframe (only case 1 can be solved):
a. On the initiator page and Set document.domain on the receiver page and set the value to the main domain name of the parent domain (window.location.hostname)
b. Create a hidden iframe on the initiator page. The source of the iframe is the receiver page
c. Depending on the browser, obtain the content of the recipient page through iframe.contentDocument || iframe.contentWindow.document
d. Interact with the recipient through the obtained content of the recipient page
This One drawback of this method is that when one domain is attacked, security holes will appear in another domain.
The initiator page code is as follows:

Copy the code The code is as follows:

接收方页面代码如下：

复制代码代码如下:

2、动态创建script：
　 a、在发起方页面动态加载一个script，script的URL指向接收方的一个处理地址（后台），该地址返回的javascript方法会被执行，另外URL中可以传入一些参数，该方法只支持GET方式提交参数。
　 b、加载的script可以在调用跨域js方法后再做一些自己的处理
发起方页面的代码如下：

复制代码代码如下:

Script Test

接收方服务器端代码如下：

复制代码代码如下:

 
protected void Page_Load(object sender, EventArgs e) 
{ 
Response.Clear(); 
Response.ContentType = "application/x-javascript"; 
Response.Write(String.Format(@"alert('{0}');", DateTime.Now)); 
Response.End(); 
} 

3、location.hash iframe：
　 a、发起方创建一个隐藏的iframe，iframe的源指向接收方的页面，并通过接收方页面的hash值来传送数据
　 b、发起方创建一个定时器，定时检查自己的location.hash并作相应的处理
c、接收方创建一个隐藏的iframe，iframe的源指向发起方所在域的一个代理页面，并将接收方根据发起方传入的数据而处理后的数据通过代理页面的hash值来传送
d、接收方创建一个定时器，定时检查自己的location.hash并作相应的处理
e、代理页面创建一个定时器，定时检查自己的location.hash并同步更新发起方页面的hash值
www.a.com/a.html#aaa，其中#aaa就是location.hash值
发起方页面代码如下：

复制代码代码如下:

接收方页面代码如下：

复制代码代码如下:

发起方域下的代理页面代码如下：

复制代码代码如下:

4、window.name：
a、发起方页面创建一个隐藏的iframe，并且源指向接收方页面
b、接收方在自己页面通过script将需要传送的数据放入window.name里
c、发起方在iframe的onload方法里将iframe的源改为和自己在同一个域下的代理页面(因为只能是同一个域下才能访问window.name的值)
d、获取window.name的值(虽然iframe的源改变了，但是window.name的值不会变)
window.name的值差不多可以有2MB大小
发起方页面代码如下：

复制代码代码如下:

接收方页面代码如下：

复制代码代码如下:

发起方域下的代理页面代码如下：

（其实什么都不用写）
5、HTML5的postMessage
a、receiverWindow.postMessage(msg, targetOrigin)，receiverWindow就是对接收消息的window的引用，可以是iframe的contentWindow/window.open的返回值/window.frames中的一个；msg就是要发送的消息，string类型；targetOrigin用于限制receiverWindow的URI，包括主域名和端口，使用“*”表示无限制，但是为了安全起见还是需要设置下，以防把消息发送给恶意的网站，如果targetOrigin的URI和receiverWindow的不符，则放弃发送消息。
b、接收方通过message事件来获得消息，并且通过event.origin的属性来验证发送方并通过event.data来获得传送的消息内容，event.source来获得发送方的window对象
发起方页面代码如下：

复制代码代码如下:

接收方页面代码如下：

复制代码代码如下:

6、window.opener（适用于IE6、7，也就是operner hack方法，不过貌似现在已经不管用了，只要打过微软的安全补丁.kb2497640就不能用了）
　 a、发起方页面创建一个隐藏的iframe，并且源指向接收方页面
b、发起方页面通过iframe.contentWindow.opener = {a: function(params){...}, b: function(params){...} ...}来定义可被接收方调用的方法
c、接收方页面通过window.opener.a/window.opener.b来调用发起方定义的方法
d、接收方页面通过parent.opener = {c: function(params){...}, d: function(params){...} ...}来定义可被发起方调用的方法
e、发起方页面通过opener.c/opener.d来调用接收方定义的方法
其实原理就是重置opener对象
发起方页面代码如下：

复制代码代码如下:

 
 
&lt ;/iframe> <br></body> <br><script language="javascript" type="text/javascript"> <br>var ifr = document.getElementById('ifr'); <br> ifr.contentWindow.opener = { a: function(msg) { alert('I called the a method and got the message:' msg); } } <br></script> <br>
</div> <br>Receive The square page code is as follows: <br><div class="codetitle">
<span><a style="CURSOR: pointer" data="98904" class="copybut" id="copybut98904" onclick="doCopy('code98904')"><u>Copy code </u></a></span> The code is as follows: </div>
<div class="codebody" id="code98904"> <br><body> <br> </body> <br><script language="javascript" type="text/javascript"> <br>window.opener.a('aaa'); <br></script> <br> </div> <br>7. window.navigator (applicable to IE6 and 7, seems to be still available and has not been patched yet) <br>a. The initiator page creates a hidden iframe, and the source points to the recipient page <br>b. The initiator page uses window.navigator.a = function(params){...}; window.navigator.b = function(params){...}; to define the method called by the receiver<br>c. The receiver page calls the method defined by the initiator through window.navigator.a(params); window.navigator.b(params);<br>d. The receiver page uses window.navigator.c = function( params){...}; window.navigator.d = function(params){...}; to define the method called by the initiator<br>e. The initiator page passes window.navigator.c(params); window.navigator.d(params); to call the method defined by the receiver <br>The initiator page code is as follows: <br><div class="codetitle">
<span><a style="CURSOR: pointer" data="26416" class="copybut" id="copybut26416" onclick="doCopy('code26416')"><u>Copy code</u></a></span> The code is as follows: </div>
<div class="codebody" id="code26416"> <br><body> <br><iframe id="ifr" src="http://www.b.com/test/NavigatorTest2.htm" style=" display:none"> 
 
 

The receiver page code is as follows:

Copy code The code is as follows: