云枢智联视角

提供人工智能与数字化解决方案

前端解决跨域问题的8种方案(最新最全)

时间:2019-02-18 18:19:01    阅读:68656次 分类:开发案例
原文:http://www.cnblogs.com/jchen666/p/3399951.html 1.同源策略如下: url 说明 是否允许通信 http://www.a.com/a.js http://www.a.com/b.js 同一域名下 允许 http://www.a.com/lab/a.js http://www.a.com//b.js 同一域名下不同文件夹 允许 http://ww...


http://www.a.com/a.http://www.a.com/b.js
同一域名下 允许
http://www.a.com/script/b.js 同一域名下不同文件夹 允许
http://www.a.com:8000/a.js
http://www.a.com/b.js
同一域名,不同端口 不允许
http://www.a.com/a.js
https://www.a.com/b.js
同一域名,不同协议 不允许
http://www.a.com/a.js
http://70.32.92.74/b.js
域名和域名对应ip 不允许
http://www.a.com/a.js
http://script.a.com/b.js
主域相同,子域不同 不允许
http://www.a.com/a.js
http://a.com/b.js
同一域名,不同二级域名(同上) 不允许(cookie这种情况下也不允许访问)
http://www.cnblogs.com/a.js
http://www.a.com/b.js
不同域名 不允许

  • 2. 前端解决跨域问题
  • 1) 在www.a.com/a.html中:

    复制代码

    ; );
    ifr.src = 'http://www.script.a.com/b.html' none;
    document.body.appendChild(ifr);
    ifr.onload = (){  ifr.contentWindow.document; 在这里操作doc,也就是b.html ifr.onload = ;
    };

    2) 在www.script.a.com/b.html中:

    document.domain = 'a.com';

    2> 动态创建script


    loadScript(url, func) { ]; );  script.src =functionif(!this.readyState=='loaded' || ){      func();      script.onload = script.onreadystatechange = ;    }  };  head.insertBefore(script, 0 {  sug: (data){    console.log(data);  } } loadScript('http://suggestion.baidu.com/su?wd=w',)}); 我们请求的内容在哪里?我们可以在chorme调试面板的source中看到script引入的内容


    原理是利用location.hash来进行传值。


    startRequest(){ );    ifr.style.display = 'none';    document.body.appendChild(ifr); } checkHash() { { ; (console.log) {            console.log('Now the data is '+catch复制代码


    模拟一个简单的参数处理操作 (location.hash){ :        callBack(); ; : do something…… ; } callBack(){ {        parent.location.hash = 'somedata'catch////var ifrproxy = document.createElement('iframe';        ifrproxy.src = 'http://a.com/test/cscript/cs3.html#somedata'; 注意该文件在"a.com"域下 复制代码

    //

    window.name 的美妙之处:name 值在不同的页面(甚至不同域名)加载后依旧存在,并且可以支持非常长的 name 值(2MB)。

    2) 创建a.com/proxy.html,并加入如下代码

    复制代码

    functionvar isFirst = ,
            ifr = document.createElement('iframe'functionif;
                isFirst = ;
              }{
                func(ifr.contentWindow.name);
                ifr.contentWindow.close();
                document.body.removeChild(ifr);
                ifr.src = ''null url;
        ifr.style.display = 'none'if(ifr.attachEvent) ifr.attachEvent('onload'else ifr.onload =<span style="box-sizing:border-box;outline:0px;font-family:"word-wrap:break-word;line-height:1.5 !important;"> loadFunc;
    
        document.body.appendChild(iframe);
      }

云枢智联(海南)信息技术有限公司专注于新一代信息技术与行业场景深度融合,面向政务警务、商业运营、城市治理、交通基建、智慧民生等多领域提供全栈式数字化解决方案。公司核心产品与服务体系完备,涵盖商管ERP系统、小票数据采集系统、涉案车辆管理系统、智慧园区系统、智慧农贸系统、低空经济应用平台、资产管理系统、数字孪生系统、公路养护系统、家政服务系统、警服体验系统、生态警务系统及AI智能体定制开发;同时依托强大自研技术能力和技术团队,提供小程序定制开发、智能硬件定制集成等增值服务,以技术创新赋能产业升级,为客户打造安全、高效、智能、可扩展的数字化整体解决方案。

云枢智联
智慧园区系统开发