美文网首页
跨域的解决方式

跨域的解决方式

作者: 大主教小豪 | 来源:发表于2017-09-11 01:18 被阅读13次

    1.JSONP(JSON with Padding)
    可用于解决主流浏览器的跨域数据访问的问题。
    由于Web 页面上调用 js 文件不受浏览器同源策略的影响,所以可以通过 Script 便签可以进行跨域的请求。

    QQ截图20170911002052.png QQ截图20170911002116.png

    2.CORS (Cross-Origin Resource Sharing)
    CORS定义一种跨域访问的机制,可以让AJAX实现跨域访问。CORS 允许一个域上的网络应用向另一个域提交跨域 AJAX 请求。实现此功能非常简单,只需由服务器发送一个响应标头即可。(使用时IE浏览器不能低于IE10。)

    Paste_Image.png

    CORS与JSONP的使用目的相同,但是比JSONP更强大。
    JSONP只支持GET请求,CORS支持所有类型的HTTP请求。JSONP的优势在于支持老式浏览器,以及可以向不支持CORS的网站请求数据。

    3.降域
    通过双向设置 document.domain 的值,解决主域名下的跨域问题。(document.domain:获取/设置当前文档的原始域部分, 用于同源策略。)

    有两个二级域名:a.jirengu.com 和 b.jirengu.com,可通过设定 document.domain 的值为主域名:jirengu.com 的方式,突破浏览器的同源策略限制,来获取对方的元素
    a —— document.domain ='jirengu.com'
    b —— document.domain ='jirengu.com'

    降域具有很大的局限性,适用范围较小,适合在同一主域名下使用

    4.postmessage
    HTML5中新增postMessage方法,可以实现跨文档消息传输。该方法可以通过绑定window的message事件来监听发送跨文档消息传输内容。

    a页面


    QQ截图20170911011238.png

    b页面

    QQ截图20170911011343.png

    相关文章

      网友评论

          本文标题:跨域的解决方式

          本文链接:https://www.haomeiwen.com/subject/stazjxtx.html