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 相关文章推荐
JavaScript中的Window窗口对象
Jan 16 Javascript
js对象转json数组的简单实现案例
Feb 28 Javascript
jquery单行文字向上滚动效果的实现代码
Sep 05 Javascript
javascript获得当前的信息的一些常用命令
Feb 25 Javascript
JS实现的自定义右键菜单实例二则
Sep 01 Javascript
关于webuploader插件使用过程遇到的小问题
Nov 07 Javascript
js实现数组去重方法及效率?Ρ? target=
Feb 14 Javascript
javascript观察者模式实现自动刷新效果
Sep 05 Javascript
JavaScript怎样在删除前添加确认弹出框?
May 27 Javascript
vue使用prop可以渲染但是打印台报错的解决方式
Nov 13 Javascript
vue打包静态资源后显示空白及static文件路径报错的解决
Sep 02 Javascript
利用js实现简易红绿灯
Oct 15 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
Smarty实现页面静态化(生成HTML)的方法
2016/05/23 PHP
检测input每次的输入是否合法遇到汉字输入就有问题
2012/05/23 Javascript
js里怎么取select标签里的值并修改
2012/12/10 Javascript
javascript制作sql转换为stringBuffer的小工具
2015/04/03 Javascript
详谈javascript中的cookie
2015/06/03 Javascript
javascript弹出拖动窗口
2015/08/11 Javascript
jQuery实现的仿百度分页足迹效果代码
2015/10/30 Javascript
JavaScript导航脚本判断当前导航
2016/07/12 Javascript
Vue2实现组件props双向绑定
2016/12/02 Javascript
js遍历添加栏目类添加css 再点击其它删除css【推荐】
2018/06/12 Javascript
JS实现数组的增删改查操作示例
2018/08/29 Javascript
解决百度Echarts图表坐标轴越界的方法
2018/10/17 Javascript
详解axios中封装使用、拦截特定请求、判断所有请求加载完毕)
2019/04/09 Javascript
vuex存储复杂参数(如对象数组等)刷新数据丢失的解决方法
2019/11/05 Javascript
vue点击页面空白处实现保存功能
2019/11/06 Javascript
js实现飞机大战游戏
2020/08/26 Javascript
搭建vscode+vue环境的详细教程
2020/08/31 Javascript
python实现调用其他python脚本的方法
2014/10/05 Python
Python的自动化部署模块Fabric的安装及使用指南
2016/01/19 Python
python 容器总结整理
2017/04/04 Python
对python抓取需要登录网站数据的方法详解
2018/05/21 Python
python特性语法之遍历、公共方法、引用
2018/08/08 Python
python3 cvs将数据读取为字典的方法
2018/12/22 Python
python如何调用百度识图api
2020/09/29 Python
python爬取抖音视频的实例分析
2021/01/19 Python
国外平面设计第一市场:99designs
2016/10/25 全球购物
美国顶级水上运动专业店:Marine Products
2018/04/15 全球购物
Bally澳大利亚官网:瑞士奢侈品牌
2018/11/01 全球购物
Fanatics法国官网:美国体育电商
2019/08/27 全球购物
机电一体化职业规划书
2014/01/07 职场文书
学习雷锋做美德少年寄语大全
2014/04/09 职场文书
三关爱志愿服务活动方案
2014/08/17 职场文书
学校世界艾滋病日宣传活动总结
2015/05/05 职场文书
vue+element ui实现锚点定位
2021/06/29 Vue.js
让JavaScript代码更加精简的方法技巧
2022/06/01 Javascript
python库Tsmoothie模块数据平滑化异常点抓取
2022/06/10 Python