Vue开发中遇到的跨域问题及解决方法


Posted in Javascript onFebruary 11, 2020

跨域是指a页面想获取b页面资源,如果a、b页面的协议、域名、端口、子域名不同,或是a页面为ip地址,b页面为域名地址,所进行的访问行动都是跨域的,而浏览器为了安全问题一般都限制了跨域访问,也就是不允许跨域请求资源。

1.jsonp

原理是:动态插入script标签,通过script标签引入一个js文件,这个js文件载入成功后会执行我们在url参数中指定的函数,并且会把我们需要的json数据作为参数传入。

由于同源策略的限制,XmlHttpRequest只允许请求当前源(域名、协议、端口)的资源,为了实现跨域请求,可以通过script标签实现跨域请求,然后在服务端输出JSON数据并执行回调函数,从而解决了跨域的数据请求。

优点是兼容性好,简单易用,支持浏览器与服务器双向通信。

缺点是只支持GET请求。

2.core

采用的是CORS(Cross-origin resource sharing)。后台在响应头中添加Access-Control-Allow-Origin。这样就可以跨域调后台接口了。 

3.vue开发期间的api代理

当将此样板与现有后端集成时,通常需要在使用dev服务器时访问后端API。为了实现这一点,我们可以并行(或远程)运行dev服务器和API后端,并让dev服务器将所有API请求代理到实际的后端。

Vue开发中遇到的跨域问题及解决方法

以上就是本次介绍的全部相关知识点,如果大家有任何补充可以联系三水点靠木小编。

Javascript 相关文章推荐
jquery select多选框的左右移动 具体实现代码
Jul 03 Javascript
javascript强大的日期函数代码分享
Sep 04 Javascript
在JS方法中返回多个值的方法汇总
May 20 Javascript
Vue.js 表单校验插件
Aug 14 Javascript
Javascript 6里的4个新语法
Aug 25 Javascript
详解Jquery的事件操作和文档操作
Dec 19 Javascript
canvas绘制环形进度条
Feb 23 Javascript
vue中如何实现变量和字符串拼接
Jun 19 Javascript
Vue CLI3 开启gzip压缩文件的方式
Sep 30 Javascript
JavaScript设计模式之观察者模式实例详解
Jan 16 Javascript
jQuery实现动态添加和删除input框实例代码
Mar 26 jQuery
react用Redux中央仓库实现一个todolist
Sep 29 Javascript
Vue data的数据响应式到底是如何实现的
Feb 11 #Javascript
JS实现TITLE悬停长久显示效果完整示例
Feb 11 #Javascript
vue.config.js中配置Vue的路径别名的方法
Feb 11 #Javascript
vue-resourc发起异步请求的方法
Feb 11 #Javascript
js实现圆形显示鼠标单击位置
Feb 11 #Javascript
JavaScript实现省份城市的三级联动
Feb 11 #Javascript
node.js使用yargs处理命令行参数操作示例
Feb 11 #Javascript
You might like
晶体管单管来复再生式收音机
2021/03/02 无线电
discuz authcode 经典php加密解密函数解析
2020/07/12 PHP
php写的简易聊天室代码
2011/06/04 PHP
PHP数组实例总结与说明
2011/08/23 PHP
php sybase_fetch_array使用方法
2014/04/15 PHP
PHP_SELF,SCRIPT_NAME,REQUEST_URI区别
2014/12/24 PHP
取得一定长度的内容,处理中文
2006/12/20 Javascript
js对象的构造和继承实现代码
2010/12/05 Javascript
div拖拽插件——JQ.MoveBox.js(自制JQ插件)
2013/05/17 Javascript
JavaScript的arguments对象应用示例
2014/09/15 Javascript
四种参数传递的形式——URL,超链接,js,form表单
2015/07/24 Javascript
Eclipse引入jquery报错如何解决
2015/12/01 Javascript
BootStrap网页中代码显示用法详解
2016/10/21 Javascript
Bootstrap模态框插入视频的实现代码
2017/06/25 Javascript
详谈js对url进行编码和解码(三种方式的区别)
2017/08/16 Javascript
基于vue,vue-router, vuex及addRoutes进行权限控制问题
2018/05/02 Javascript
vue forEach循环数组拿到自己想要的数据方法
2018/09/21 Javascript
nodejs简单抓包工具使用详解
2019/08/23 NodeJs
详解Python的Django框架中的通用视图
2015/05/04 Python
Python的Socket编程过程中实现UDP端口复用的实例分享
2016/03/19 Python
详解python实现线程安全的单例模式
2018/03/05 Python
Python干货:分享Python绘制六种可视化图表
2018/08/27 Python
使用python Fabric动态修改远程机器hosts的方法
2018/10/26 Python
django解决跨域请求的问题详解
2019/01/20 Python
python列表插入append(), extend(), insert()用法详解
2019/09/14 Python
pyqt5 QlistView列表显示的实现示例
2020/03/24 Python
BONIA波尼亚新加坡官网:皮革手袋,鞋类和配件
2016/08/25 全球购物
英国领先的在线礼品店:Getting Personal
2019/09/24 全球购物
Stührling手表官方网站:男女高品质时尚手表的领先零售商
2021/01/07 全球购物
计算机软件个人的自荐信范文
2013/12/01 职场文书
五一口号
2014/06/19 职场文书
2014年秋季新学期寄语
2014/08/02 职场文书
社区娱乐活动方案
2014/08/21 职场文书
五年级小学生评语
2014/12/26 职场文书
Python torch.flatten()函数案例详解
2021/08/30 Python
Spring Boot实战解决高并发数据入库之 Redis 缓存+MySQL 批量入库问题
2022/02/12 Redis