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

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

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

系统windows,vue版本2.9.1

项目结构如下:

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

直接上解决办法

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

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

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

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

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

基于vue移动音乐webapp跨域请求失败的问题解决的更多相关文章

  1. vue.js学习之 跨域请求代理与axios传参

    vue.js学习之 跨域请求代理与axios传参 一:跨域请求代理 1:打开config/index.js module.exports{ dev: { } } 在这里面找到proxyTable{}, ...

  2. Vue三步完成跨域请求

    三步完成跨域请求 ①main.js中: Vue.prototype.HOME = '/api'; ② config/index.js中: module.exports = { dev: { // Pa ...

  3. Vue.js 2.0 跨域请求数据

    Vuejs由1.0更新到了2.0版本.HTTP请求官方也从推荐使用Vue-Resoure变为了 axios .接下来我们来简单地用axios进行一下异步请求.(阅读本文作者默认读者具有使用npm命令的 ...

  4. vue 使用axios 出现跨域请求的两种解决方法

    最近在使用vue axios发送请求,结果出现跨域问题,网上查了好多,发现有好几种结局方案. 1:服务器端设置跨域 header(“Access-Control-Allow-Origin:*”); h ...

  5. js 跨域请求失败

    注:错误返回:Failed to load http://xxxxxxxxxxx: No 'Access-Control-Allow-Origin' header is present on the ...

  6. $Django 前后端之 跨域问题(同源策略) vue项目(axios跨域请求数据)

    1 跨域问题(多个域之间的数据访问) #同源策略(ip port 协议全部相同) #本站的只能请求本站域名的数据 #CORS实现(跨域资源共享) #实现CORS通信的关键是服务器.只要服务器实现了CO ...

  7. vue-cli项目开发/生产环境代理实现跨域请求+webpack配置开发/生产环境的接口地址

    一.开发环境中跨域 使用 Vue-cli 创建的项目,开发地址是 localhost:8080,需要访问非本机上的接口http://10.1.0.34:8000/queryRole.不同域名之间的访问 ...

  8. Ajax跨域请求 同源策略与Jsonp

    同源策略 同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响.可以说Web是构建在同源策略基础之上的 ...

  9. NGINX: 配置跨域请求

    说明: 内容全部来自 SegmentFault Developer Nginx 配置跨域请求 跨域请求失败, nginx 报错: 403 No 'Access-Control-Allow-Origin ...

随机推荐

  1. 使用shiro框架,注销问题的解决

    在使用shiro框架的时候,有时候会因为登录问题找不到注销的controller.所以会报404的错误,下面是解决办法: 1.首先写一个类SystemLogoutFilter继承LogoutFilte ...

  2. ARM基础

    ARM汇编:(APCS过程调用标准) 汇编:用助记符(如$ # .)代替操作码,用地址符号或标签代替地址码的编程语言 特点: 优点:可以直接访问硬件,目标代码简短,执行速度快(CPU启动时需要直接操作 ...

  3. Day 10733 使用独立安装包安装.Net Framework 4.6.2时,提示『无法建立到信任根颁发机构的证书链』

    出现该问题的原因是未能更新本机的受信任证书颁发机构证书列表,导致安装包验证失败,以下几种情况可以造成此问题: 1.安装该运行库的系统未接入互联网: 2.安装该运行库的系统所在的网络环境,屏蔽了对微软受 ...

  4. 王之泰201771010131《面向对象程序设计(java)》第六周学习总结

    第一部分:理论知识学习部分 第五章 第五章学习内容主要分为七个模块,分别为: 1.类.超类和子类: a. 类继承的格式: class 新类名extends已有类名. b. 已有类称为:超类(super ...

  5. ssh hibernate修改数据库

     org.springframework.dao.InvalidDataAccessApiUsageException: Write operations are not allowed in rea ...

  6. stlcky footers布局小技巧

    sticky-footer解决方案 在网页设计中,Sticky footers设计是最古老和最常见的效果之一,大多数人都曾经经历过.它可以概括如下:如果页面内容不够长的时候,页脚块粘贴在视窗底部:如果 ...

  7. _spellmod

    -- 技能修改 -- 小技巧:可以针对技能进行修改 (进行会对其进行更新,增加技能开关) `comment` 备注 `spellId` 技能ID `reqId`需求ID `dmgMod`伤害倍数 `h ...

  8. ado.net 批量添加 更新 删除

    自曾列就别往下看 别折腾了   使用 SqlBulkCopy ,dataTable 必须跟sql里面的表字段完全一样 下面在sqlserver中演示 mysql 请google MySqlBulkLo ...

  9. IDEA去除自动检测bean是否存在

    操作步骤如下图所示:

  10. .NET Core / C# 开发 IOT 嵌入式设备的个人见解

    https://www.cnblogs.com/whuanle/p/10589496.html