跨域通讯原则
| 说明 | 是否允许通信 | |
|---|---|---|
| http://www.a.com/a.jshttp://www.a.com/b.js | 同一域名下 | 允许 |
| http://www.a.com/lab/a.jshttp://www.a.com/script/b.js | 同一域名下不同文件夹 | 允许 |
| http://www.a.com:8000/a.jshttp://www.a.com/b.js | 同一域名,不同端口 | 不允许 |
| http://www.a.com/a.jshttps://www.a.com/b.js | 同一域名,不同协议 | 不允许 |
| http://www.a.com/a.jshttp://70.32.92.74/b.js | 域名和域名对应ip | 不允许 |
| http://www.a.com/a.jshttp://script.a.com/b.js | 主域相同,子域不同 | 不允许 |
| http://www.a.com/a.jshttp://a.com/b.js | 同一域名,不同二级域名(同上) | 不允许(cookie这种情况下也不允许访问) |
| http://www.cnblogs.com/a.jshttp://www.a.com/b.js | 不同域名 | 不允许 |
第一,如果是协议和端口造成的跨域问题“前台”是无能为力的,
第二:在跨域问题上,域仅仅是通过“URL的首部”来识别而不会去尝试判断相同的ip地址对应着两个域或两个域是否在同一个ip上。 “URL的首部”指window.location.protocol +window.location.host,也可以理解为“Domains, protocols and ports must match”。
我的解决方案是:document.domain+iframe的设置
对于主域相同而子域不同的例子,可以通过设置document.domain的办法来解决。具体的做法是可以在http://www.a.com/a.html和http://script.a.com/b.html两个文件中分别加上document.domain = ‘a.com’;然后通过a.html文件中创建一个iframe,去控制iframe的contentDocument,这样两个js文件之间就可以“交互”了。
同域名通讯
//父页面获取子页面元素
let iframeHeight=$("#iframeName").contents().height();
$("#iframeName").contents().find(".sfbtn").text()
$("#iframeName").contents().find(".sfbtn").text("ccc")
//子页面获取子页面元素
parent.$(window.parent.document).find(".layui-layer-max").click()
跨域通讯 Iframe
//跨域传参
window.onload=function(){
window.frames[0].postMessage('getcolor','http://lslib.com');
}
//跨域接收
window.addEventListener('message',function(e){
if(e.source!=window.parent) return;
varcolor=container.style.backgroundColor;
window.parent.postMessage(color,'*');
},false);