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 相关文章推荐
showModelessDialog()使用详解
Sep 21 Javascript
基于jQuery UI CSS Framework开发Widget的经验
Aug 21 Javascript
让AJAX不依赖后端接口实现方案
Dec 03 Javascript
jQuery中:password选择器用法实例
Jan 03 Javascript
javascript实现图像循环明暗变化的方法
Feb 25 Javascript
jQuery往返城市和日期查询实例讲解
Oct 09 Javascript
基于JavaScript实现高德地图和百度地图提取行政区边界经纬度坐标
Jan 22 Javascript
分享JS代码实现鼠标放在输入框上输入框和图片同时更换样式
Sep 01 Javascript
jQuery+HTML5实现WebGL高性能烟花绽放动画效果【附demo源码下载】
Aug 18 jQuery
微信小程序使用map组件实现路线规划功能示例
Jan 22 Javascript
JS实现的对象去重功能示例
Jun 04 Javascript
JS实现炫酷雪花飘落效果
Aug 19 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
杏林同学录(一)
2006/10/09 PHP
PHP遍历某个目录下的所有文件和子文件夹的实现代码
2013/06/28 PHP
php获取中文拼音首字母类和函数分享
2014/04/24 PHP
PHP页面跳转实现延时跳转的方法
2016/12/10 PHP
jquery异步跨域访问代码
2013/06/28 Javascript
JS中如何判断传过来的JSON数据中是否存在某字段
2014/08/18 Javascript
IE中鼠标经过option触发mouseout的解决方法
2015/01/29 Javascript
jQuery实现手机号码输入提示功能实例
2015/04/30 Javascript
超详细的JS弹出窗口代码大全
2020/04/18 Javascript
angular ngClick阻止冒泡使用默认行为的方法
2016/11/03 Javascript
jQuery内容筛选选择器实例代码
2017/02/06 Javascript
解决Vue.js 2.0 有时双向绑定img src属性失败的问题
2018/03/14 Javascript
angularjs1.X 重构controller 的方法小结
2019/08/15 Javascript
JS 逻辑判断不要只知道用 if-else 和 switch条件判断(小技巧)
2020/05/27 Javascript
[05:13]TI4 中国战队 机场出征!!
2014/07/07 DOTA
[46:59]完美世界DOTA2联赛PWL S2 GXR vs Ink 第二场 11.19
2020/11/20 DOTA
Windows上使用virtualenv搭建Python+Flask开发环境
2016/06/07 Python
python中的turtle库函数简单使用教程
2018/07/23 Python
python3.6根据m3u8下载mp4视频
2019/06/17 Python
django 实现celery动态设置周期任务执行时间
2019/11/19 Python
python实现对列表中的元素进行倒序打印
2019/11/23 Python
python实现五子棋程序
2020/04/24 Python
如何用Python和JS实现的Web SSH工具
2021/02/23 Python
Tory Burch德国官网:美国时尚生活品牌
2018/01/03 全球购物
La Senza官网:北美顶尖性感内衣品牌
2018/08/03 全球购物
医学专业毕业生推荐信
2013/11/14 职场文书
大学生的自我鉴定范文
2014/01/21 职场文书
小学生秋游活动方案
2014/02/23 职场文书
行政部工作岗位职责范本
2014/03/05 职场文书
标准的毕业生自荐信
2014/04/20 职场文书
询价采购方案
2014/06/09 职场文书
设计专业自荐信
2014/06/19 职场文书
2014年班组长工作总结
2014/11/20 职场文书
2015年招商引资工作总结
2015/04/25 职场文书
2016年第十四个公民道德宣传日活动总
2016/04/01 职场文书
python自动化之如何利用allure生成测试报告
2021/05/02 Python