vue2学习计划1-2 浏览器跨域问题
来源:互联网 发布:圣塔克拉拉大学 知乎 编辑:程序博客网 时间:2024/06/07 18:29
最近学习vue2,对网上的看到的内容和自己看到vue组件源码,进行记录。
过去跨域都是用JSONP, window.name,postMessage() 等方法模拟,但都不是很纯粹的AJAX解决方案。
参考文章 http://blog.csdn.net/zzk220106/article/details/71214495
先上vue-resource 上的实例
XHR Level2
HTML5中 XMLHttpRequest Level 2 的推出。可以通过在返回的HTTP请求头中加入 Access-Control-Allow-Origin 的设置,让浏览器支持对不同域的AJAX请求。这个情况下前端AJAX的代码不用做任何更改,只需要在服务端的返回中设置以下头信息即可:
Access-Control-Allow-Origin: * //*代表任何域。也可以指定地址
Access-Control-Allow-Methods: POST,GET //支持的方法
另外XHR2也带有更多高级功能,例如progress进度,文件上传,获取二进制数据等。详见 https://dev.opera.com/articles/xhr2/
XDR (IE 8-9 Only)
对于XHR2,IE浏览器的支持是IE10以上。但是IE早在IE8时就推出了 XDomainRequest 对象进行跨域操作,一直沿用到IE10才被取代掉。因此在IE8,IE9中应该使用 XDomainRequest (XDR)来实现。
XDR在创建时是通过 new XDomainRequest() 进行创建。其他操作和XHR有细微差别。比如open方法只有method和url两个参数,XDR只支持异步不支持同步操作。详细见文档: XDomainRequest object
var xdr = new XDomainRequest();
xdr.open(“get”, “http://www.example.com“);
xdr.onload = function() {
//success(xdr.responseText);
}
xdr.send();
另外使用XDR时也需要服务器端设置上面提到的 Access-Control-Allow-Origin 头信息。
- vue2学习计划1-2 浏览器跨域问题
- vue2学习计划1-1 浏览器跨域问题
- vue2学习计划1-3 浏览器跨域问题(mock-api)
- 浏览器跨域问题
- 浏览器跨域问题
- 浏览器跨域问题
- 浏览器跨域问题
- 关于vue2.x使用axios以及http-proxy-middleware代理处理跨域的问题
- Vue2环境搭建问题
- vue2数组的问题
- Vue2路由问题汇总
- Vue2.0组件问题
- vue2 开发问题整理
- 学习计划2
- 学习计划2
- 学习计划--1
- 浏览器跨域问题 jsonp
- Chrome浏览器跨域问题
- C++第5次实验报告
- 机器人相关的会议期刊
- centOS7系统安装jdk异常报错解决方法
- String.Compare(String, String, StringComparison)方法
- 十字链表
- vue2学习计划1-2 浏览器跨域问题
- 数组作为函数参数
- ProgressBar和Seekbar
- JavaScript基础之数据类型
- malloc原理和内存碎片化
- 简单选择排序算法(Simple Selection Sort) Java实现
- c++实验5-数组分离
- c++实验五-项目一数组分离
- JMeter学习笔记21-如何添加思考时间