基于VUE移动音乐WEBAPP跨域请求失败的解决方法


Posted in Javascript onJanuary 16, 2018

在学习一位vue大牛的课程《VUE2.0移动端音乐App开发》时,由于vue的版本原因遇到了一些问题

这是其中之一,花费了很多的时间去解决

虽然搞定了这个问题,但是很多东西理解也不是很到位,下面详细说:

系统windows,vue版本2.9.1

项目结构如下:

基于VUE移动音乐WEBAPP跨域请求失败的解决方法

这里就知道版本差异了,我没有dev-server这个文件,按照黄大牛的配置会报404的错误,错误具体我就不贴了

直接上解决办法

首先在config目录下配置index.js文件如下

基于VUE移动音乐WEBAPP跨域请求失败的解决方法

然后在webpack.dev.conf中配置如下

基于VUE移动音乐WEBAPP跨域请求失败的解决方法

当然,想调用数据需要在响应的逻辑中进行配置,在recommend.js中写以下

基于VUE移动音乐WEBAPP跨域请求失败的解决方法

在recommend.vue进行引入即可,然后console.log在控制台查看

基于VUE移动音乐WEBAPP跨域请求失败的解决方法

上面的问题解决上,我犯了个低级错误,在recommend.js中的getDiscList后面没有加s导致一直获取失败,发布谨记!!!

Javascript 相关文章推荐
jquery分割字符串的方法
Jun 24 Javascript
AngularJS Ajax详解及示例代码
Aug 17 Javascript
让DIV的滚动条自动滚动到最底部的3种方法(推荐)
Sep 24 Javascript
详解js中常规日期格式处理、月历渲染和倒计时函数
Dec 28 Javascript
jQuery插件echarts去掉垂直网格线用法示例
Mar 03 Javascript
利用PM2部署node.js项目的方法教程
May 10 Javascript
深入理解JavaScript和TypeScript中的class
Apr 22 Javascript
jQuery实现输入框的放大和缩小功能示例
Jul 21 jQuery
微信JS-SDK实现微信会员卡功能(给用户微信卡包里发送会员卡)
Jul 25 Javascript
小程序选项卡以及swiper套用(跨页面)
Jun 19 Javascript
JavaScript如何实现监听键盘输入和鼠标监点击
Jul 20 Javascript
详解JavaScript作用域、作用域链和闭包的用法
Sep 03 Javascript
AngularJS监听ng-repeat渲染完成的两种方法
Jan 16 #Javascript
微信小程序实现流程进度的图样式功能
Jan 16 #Javascript
使用vue官方提供的模板vue-cli搭建一个helloWorld案例分析
Jan 16 #Javascript
vue单页面打包文件大?首次加载慢?nginx带你飞,从7.5M到1.3M蜕变过程(推荐)
Jan 16 #Javascript
详解layui中的树形关于取值传值问题
Jan 16 #Javascript
基于JavaScript实现抽奖系统
Jan 16 #Javascript
详解JavaScript基础知识(JSON、Function对象、原型、引用类型)
Jan 16 #Javascript
You might like
php桌面中心(三) 修改数据库
2007/03/11 PHP
AES加解密在php接口请求过程中的应用示例
2016/10/26 PHP
js电信网通双线自动选择技巧
2008/11/18 Javascript
JavaScript 浮点数运算 精度问题
2009/10/06 Javascript
ExtJS Grid使用SimpleStore、多选框的方法
2009/11/20 Javascript
对采用动态原型方式无法展示继承机制得思考
2009/12/04 Javascript
jQuery模拟超链接点击效果代码
2013/04/21 Javascript
web css实现整站样式互相切换
2013/10/29 Javascript
BootStrap学习系列之Bootstrap Typeahead 组件实现百度下拉效果(续)
2016/07/07 Javascript
JS如何设置iOS中微信浏览器的title
2016/11/22 Javascript
bootstrap响应式表格实例详解
2017/05/15 Javascript
js自定义瀑布流布局插件
2017/05/16 Javascript
vue.js国际化 vue-i18n插件的使用详解
2017/07/07 Javascript
微信小程序移动拖拽视图-movable-view实例详解
2019/08/17 Javascript
Vue使用NProgress进度条的方法
2019/09/21 Javascript
Vue.js组件props数据验证实现详解
2019/10/19 Javascript
如何使用jQuery操作Cookies方法解析
2020/09/08 jQuery
python实现获取客户机上指定文件并传输到服务器的方法
2015/03/16 Python
Python 26进制计算实现方法
2015/05/28 Python
python实现自动网页截图并裁剪图片
2018/07/30 Python
Python中一些深不见底的“坑”
2019/06/12 Python
Django基础知识 URL路由系统详解
2019/07/18 Python
python使用多线程编写tcp客户端程序
2019/09/02 Python
pytorch实现mnist数据集的图像可视化及保存
2020/01/14 Python
Python urlencode和unquote函数使用实例解析
2020/03/31 Python
浅谈Keras的Sequential与PyTorch的Sequential的区别
2020/06/17 Python
keras中epoch,batch,loss,val_loss用法说明
2020/07/02 Python
微信浏览器取消缓存的方法
2015/03/28 HTML / CSS
Clarria化妆品官方网站:购买天然和有机化妆品系列
2018/04/08 全球购物
美国亚马逊旗下男装网站:East Dane(支持中文)
2019/09/25 全球购物
腾讯技术类校园招聘笔试试题
2014/05/06 面试题
某公司C#程序员面试题笔试题
2014/05/26 面试题
cf收人广告词
2014/03/14 职场文书
yy生日主持词
2014/03/20 职场文书
员工薪酬激励方案
2014/06/13 职场文书
行政工作试用期自我评价
2014/09/14 职场文书