三步完成跨域请求

  ①main.js中: Vue.prototype.HOME = '/api';
  ② config/index.js中:

module.exports = {
dev: {
// Paths
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: {
'/api':{
target:'https://www.baidu.com',
changeOrigin:true,
     pathRewrite:{
'^/api':'/api'
}
}
},
......
}

  主要是proxyTable的修改。

  ③GET请求:

axios({
method:'get',
     url:this.HOME,
}).then(function(resp){
console.log(resp.data);
}).catch(resp=>{
console.log("请求失败"+resp.status+resp.statusText);
});

  ④POST请求

      let data = new FormData();
data.append('uname','xiaowanzi');
data.append('pwd','123456');
axios.post(this.HOME+'/card/sysUserController/isUser.do',data)
.then(res=>{
this.loading = false;
console.log('res=>',res);
this.$router.push({ path: this.redirect || '/' });
},error=>{
this.loading = false;
this.$message.error(error);
console.log('error=>',error);
}

  

 

Vue三步完成跨域请求的更多相关文章

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

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

  2. VUE系列三:实现跨域请求(fetch/axios/proxytable)

    1. 在 config/index.js 配置文件中配置proxyTable 'use strict' // Template version: 1.3.1 // see http://vuejs-t ...

  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. 基于vue移动音乐webapp跨域请求失败的问题解决

    在学习一位vue大牛的课程<VUE2.0移动端音乐App开发>时,由于vue的版本原因遇到了一些问题 这是其中之一,花费了很多的时间去解决 虽然搞定了这个问题,但是很多东西理解也不是很到位 ...

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

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

  7. AJAX请求和跨域请求详解(原生JS、Jquery)

    一.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数 ...

  8. Vuex、axios、跨域请求处理和import/export的注意问题

    一.Vuex 1.介绍 vuex是一个专门为Vue.js设计的集中式状态管理架构. 对于状态,我们把它理解为在data中需要共享给其他组件使用的部分数据. Vuex和单纯的全局对象有以下不同: 1. ...

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

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

随机推荐

  1. codeforce#483div2D-XOR-pyramid+DP

    题意:求给定区间中最大的连续异或和: 思路:DP的思想,先dp求出每个区间的异或和,再dp更新成当前这个dp[i][j]和dp[i-1][j].dp[i-1][j+1]中的最大值: 这样可以保证是同一 ...

  2. codeforce440C-Maximum splitting-规律题

    题意:问一个数最多可以变成几个合数的和: 思路: 时刻提醒自己再看到题目的时候的所作所为,该找规律找规律,想什么ksm,质数判断开根号. 除了1.2.3.5.7.11外,其余的数都可以通过4,6,9获 ...

  3. SpringCloud Feign 之 Fallback初体验

    SpringCloud Feign 之 Fallback初体验 在微服务框架SpringCloud中,Feign是其中非常重要且常用的组件.Feign是声明式,模板化的HTTP客户端,可以帮助我们更方 ...

  4. SpringCloud 学习(二)-2 :Securing The Eureka Server

    由于工作等种种原因未能连续进行学习,现在继续学习微服务,不过是新建的demo,springcloud版本用的是Finchley.SR2. 之前用简单demo实现了注册中心,现在来对注册中心加安全验证: ...

  5. webpack中clean-webpack-plugin插件使用遇到的问题及解决方法

    webpack 会生成文件,然后将这些文件放置在 /dist 文件夹中,但是 webpack 无法追踪到哪些文件是实际在项目中用到的. 通常,在每次构建前清理 /dist 文件夹,是比较推荐的做法,因 ...

  6. Can't connect to MySQL server on 'localhost' (10038)

    平台:win7 已经安装好数据库,但是 在连接MySQL数据库时发生问题: 经过一系列的资料查找后,得到结论MySQL没有启动 解决方法: 将MySQL加入到Windows的服务中.切换到MySQL安 ...

  7. JDK11,JDK12没有JRE的解决方法

    jdk11和jdk12在以前版本基础上,改动有点大,安装后默认是没有jre的. 解决方法: 在JDK目录下使用bin\jlink.exe --module-path jmods --add-modul ...

  8. ZFNet(2013)及可视化的开端

    目录 写在前面 网络架构与动机 特征可视化 其他 参考 博客:blog.shinelee.me | 博客园 | CSDN 写在前面 ZFNet出自论文< Visualizing and Unde ...

  9. IPMI在linux下常用命令

    ipmitool lan print 1 ipmitool lan set 1 ipaddr 192.168.0.12 ipmitool lan set 1 netmask 255.255.255.0 ...

  10. 04 (H5*) Vue第四天

    目录: 1:父组件向子组件传值,通过属性绑定的方式. 2:父组件向子组件传方法,通过事件绑定的方式 . 3:通过ref来获取Dom元素 1:父组件向子组件传值,通过属性绑定的方式 1.1:父组件声明数 ...