版权声明:避免百度一下通片同一篇文章,未经博主允许不得转载。本博客作为笔记使用,正确性请自行验证。 https://blog.csdn.net/u014071104/article/details/80361888

这篇文章纯属湿货。

随着MVVM框架的大行其道,前端接触网路请求的机会越来越普及。

跨域也开始成为开发的家常便饭。

跨域处理方法有以下几点:

  1. iframe
  2. script(JSONP)
  3. cors

iframe是N年前 的东西,在邮件网站上可以看到它的影子

JSONP一直都存在,在PC上没兼容问题,并且使用方便,局限是只能通过get方式发送数据

CORS可以让前端在某些情况下可以像不跨域一样请求数据,所以我们这篇只说它。

CORS配置主要在后端

可以参考:阮一峰的博客

IE8&IE9上不能使用XMLHttpRequest来通过cors来处理跨域,他们提供了一个特别的对象XDomainRequest来处理CORS跨域通讯。

可以参考:CORS

它的回掉函数和XMLHttpRequest基本一致,这里不重叙。

下面只要说几个坑点:

1.要保持请求协议和当前访问网站的协议一致。

例如:浏览器地址栏的协议是https,那么你的XDomainRequest只能发起https请求,否则“拒绝访问”

2. 如果你使用vue同时使用CORS,想要兼容IE8!不用多想了。

XDomainRequest是支持IE8 CORS的,但是vue不支持,这个锅并不是XDomainRequest的,XDomainRequest不背(●'◡'●)。

贴代码:

  1. return new Promise((resolve, reject) => {
    let appliance = new window.XDomainRequest()
    appliance.onprogress = function () { }; // no aborting
    appliance.ontimeout = function () {
    // alert("timeout")
    reject({ eror: "timeout" });
    }; // "
    appliance.onload = function (e) {
    // do something with appliance.responseText
    // alert("onload" + appliance.responseText)
    resolve(appliance.responseText);
    };
    appliance.onerror = function (e, b) {
    // error handling
    // alert("error" + JSON.stringify(e) + JSON.stringify(b))
    reject({ eror: e });
    };
    //appliance.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    appliance.withCredentials = true; // to support sending cookies with CORS
    appliance.open("POST", axios.defaults.baseURL + url);
    appliance.send(dataToString);
    });

2018-05-31更新:

可以发送请求,但是无法携带数据

XDomainRequest IE8&IE9 cors 跨域通讯的处理方法的更多相关文章

  1. Springboot 配置cors 跨域的几种方法

    作记录用 请参考https://blog.csdn.net/lizc_lizc/article/details/81155895 第一种: 在每个controller上添加 @CrossOrigin ...

  2. 填个小坑,Vue不支持IE8及以下,跨域ajax不支持IE9

    这特么就尴尬了,说好的Vue支持IE8及以下的呢,引入jquery,测试IE个浏览器,IE9仍然显示不正常, 然而命令行测试Vue仍然存在, 数据回不来!数据回不来!数据回不来! 好吧  肉包子打狗$ ...

  3. CORS——跨域请求那些事儿

    在日常的项目开发时会不可避免的需要进行跨域操作,而在实际进行跨域请求时,经常会遇到类似 No 'Access-Control-Allow-Origin' header is present on th ...

  4. IE9 下面, XMLHttpRequest 是不支持跨域请求的解决方法

    在 IE9 下面, XMLHttpRequest 是不支持跨域请求的. IE10 的 XMLHttpRequest 支持跨域, 而 IE8, IE9 需要使用 XDomainRequest 来实现跨域 ...

  5. 一篇文章搞明白CORS跨域

    面试问到数据交互的时候,经常会问跨域如何处理.大部分人都会回答JSONP,然后面试官紧接着就会问:"JSONP缺点是什么啊?"这个时候坑就来了,如果面试者说它支持GET方式,然后面 ...

  6. 跨域问题及其解决方法(JSONP&CORS)

    一.什么是跨域 当a.qq.com域名下的页⾯或脚本试图去请求b.qq.com域名下的资源时,就是典型的跨域行为.跨域的定义从受限范围可以分为两种,⼴义跨域和狭义跨域. (一)广义跨域 ⼴义跨域通常包 ...

  7. CORS跨域资源共享你该知道的事儿

    "唠嗑之前,一些客套话" CORS跨域资源共享,这个话题大家一定不陌生了,吃久了大转转公众号的深度技术好文,也该吃点儿小米粥溜溜胃里的缝儿了,今天咱们就再好好屡屡CORS跨域资源共 ...

  8. 彻底理解CORS跨域原理

    背景 现在的前端开发中都是前后端分离的开发模式,数据的获取并非同源,所以跨域的问题在我们日常开发中特别常见.其实这种资料网上也是一搜一大堆,但是都不够全面,理解起来也不够透彻.这篇文章就结合具体的示例 ...

  9. jsonp与cors跨域的一些理解(转)

    CORS其实出现时间不短了,它在维基百科上的定义是:跨域资源共享(CORS )是一种网络浏览器的技术规范,它为Web服务器定义了一种方式,允许网页从不同的域访问其资源.而这种访问是被同源策略所禁止的. ...

随机推荐

  1. UOJ 449 【集训队作业2018】喂鸽子 【生成函数,min-max容斥】

    这是第100篇博客,所以肯定是要水过去的. 首先看到这种形式的东西首先min-max容斥一波,设\(f_{c,s}\)表示在\(c\)只咕咕中,经过\(s\)秒之后并没有喂饱任何一只的概率. \[ \ ...

  2. Java学习日记基础篇(九) —— 集合框架,泛型,异常

    集合框架 有事我们会需要一个能够动态的调整大小的数组,比如说要添加新员工但是数组已经满了,并且数组的大小是在定义的时候定死的,所以我们就需要一个能够动态调整大小的数组或者用链表解决,而java中提供了 ...

  3. HDU 4609 3-idiots ——(FFT)

    这是我接触的第一个关于FFT的题目,留个模板. 这题的题解见:http://www.cnblogs.com/kuangbin/archive/2013/07/24/3210565.html. FFT的 ...

  4. ICEM-带肋圆柱

    原视频下载地址:https://yunpan.cn/cqUj6H9un37F2  访问密码 91af

  5. chrome中的base64和nodejs中的base64

    谷歌浏览器的base64 window["atob"](_0x1c0cdf) nodejs对应的是 Buffer.from(_0x1c0cdf,"base64" ...

  6. 2018-2019-2 《网络对抗技术》Exp8 Web基础 Week11-12 20165233

    Exp8 Web基础 目录 一.基础问题 二.实验步骤 实验点一:Web前端HTML 能正常安装.启停Apache.理解HTML,理解表单,理解GET与POST方法,编写一个含有表单的HTML. 实验 ...

  7. My algorithmic road

    序言 初窥门径 1 第一题 素数的烦恼 离开了家乡,你到达了数字之地,在这里数字2总感觉自己是自然数中最独特的一个,他只有一和它本身两个因数,为此它十分苦恼.为了不再寂寞,他建立了素数王国,他请求许多 ...

  8. delphi 解决android 9上无法使用http协议

    delphi 解决android 9上无法使用http协议 安卓9不让客户端通过非https方式访问服务端数据(不允许发送明文http请求)的问题. 解决方法: 1.选择安卓平台编译一次程序,在项目根 ...

  9. Python JSON 字符串 转 json 基本使用

    字符串 转  json import json jsonData = '{"a":1,"b":2,"c":3,"d":4 ...

  10. python datetime库使用和时间加减计算

    datetime库使用 一.操作当前时间 1.获取当前时间 >>> import datetime >>> print datetime.datetime.now( ...