IE8、9 下的资源跨域请求

作者: 流星狂飙 | 来源:发表于2015-09-09 10:53 被阅读7339次

    Web 浏览器具有一个称为相同站点源策略的安全策略,此策略可阻止网页访问另一个域中的数据。 网站通常会让其服务器在后端请求其他站点服务器中的内容,由此避开浏览器中的检查,从而绕开此策略。

    关于同源策略或者是跨域请求的概念,可以先读我的前一篇文章:同源策略——浏览器的安全卫士

    不同源的资源读取带来了方便,也带来了弊端。作为开发者也不得不做出一些妥协的事情。 实际上 IE 7、8、9、10 对于跨域ajax 是默认不支持的。
    我在http://caniuse.com/#search=cors 中搜索 cors 得到以下的结果。

    浏览器的支持程度

    IE 10 以下的支持都是很糟糕的,如果你一定要开启,那就按照很多网友说的方法试一下,

    解决方法如下:点击IE浏览器的的“工具->Internet 选项->安全->自定义级别”将“其他”选项中的“通过域访问数据源”选中为“启用”或者“提示”,点击确定就可以了。

    **但是作为一个普通用户,谁知道这么设置呢?所以,必须从代码层面上解决这个问题。 **

    在 stackoverflow 中有一个问题, IE9 jQuery AJAX with CORS returns “Access is denied”

    This is a known bug with jQuery. The jQuery team has "no plans to support this in core and is better suited as a plugin." (See this comment). IE does not use the XMLHttpRequest, but an alternative object named XDomainRequest.

    解决办法——XDomainRequest

    通过使用 Internet Explorer 8 中的跨域请求(缩写为“XDR”),开发人员可以创建跨网站数据聚合方案。 这个名为XDomainRequest 的请求与 XMLHttpRequest 对象类似,但编程模型更加简单,它可以提供一种最简单的方式来向支持 XDR 的第三方站点发出匿名请求,并选择使这些站点的数据可跨域使用。 只需三行代码即可生成基本的跨站点请求。 这将确保针对公共站点(例如,博客或其他社交网络应用程序)的数据聚合简单、安全和快速。

    跨域请求需要经过网页和服务器的相互同意。 通过利用 window 对象创建 XDomainRequest 对象,并打开到特定域的连接,可以在网页中启动一个跨域请求。 浏览器将通过发送带有源值的 Origin 标头,从特定域的服务器中请求数据。 如果服务器响应的 Access-Control-Allow-Origin 标头为 * 或请求页面的确切 URL,则浏览器将仅仅完成连接。 此行为是万维网联盟 (W3C) 的 Web 应用程序工作组制定的、针对与 XDomainRequest 对象集成的客户端跨域通信的草稿框架的一部分。

    更优雅的解决办法

    jQuery-ajaxTransport-XDomainRequest

    这是一个基于 XDomainRequest 实现 jquery ajxa 的 jquery 插件,为了支持 IE8、9的cors。

    demo

    $.getJSON('http://jsonmoon.jsapp.us/').done(function(data) {
      console.log(data.name.first);
    });
    
    // POST
    $.ajax({
      url: 'http://frozen-woodland-5503.herokuapp.com/cors.json',
      data: 'this is data being posted to the server',
      contentType: 'text/plain',
      type: 'POST',
      dataType: 'json'
    }).done(function(data) {
      console.log(data.name.last);
    });
    

    注意

    为了在IE 浏览器中使用 XDomainRequest,以下是必须的,

    1. Only GET or POSTWhen POSTing, the data will always be sent with a Content-Type of text/plain

    2. Only HTTP or HTTPS Protocol must be the same scheme as the calling page

    3. Always asynchronous

    相关文章

      网友评论

      • 0054b2815375:xdomin这个插件只支持get请求,ie上post请求参数发不出去,其实后端只要支出了cors ,jQuery.support.cors=true;就可以了
        半夜虾叫:post请求,一直说我传的参数为空,实际有值,jQuery.support.cors=true设置了,但是IE9以下,还是不能请求数据
      • 晗笑书生:为什么我的还是不行 axios 要兼容IE9 真心无语了
        果子煎饼同学:@晗笑书生 兄弟 你解决了吗 我也要兼容到ie9
      • Jacarri_Chan:是不是掉了一句话:
        jQuery.support.cors = true;
      • Yaphets_123456:我就想问一下,为什么必须是异步的?感觉影响不是很大啊
      • d25949258ce4:公司项目大部分都是针对IE10以下的。各种不爽呀。

      本文标题:IE8、9 下的资源跨域请求

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