三步完成跨域请求

  ①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. 洛谷P3951 小凯的疑惑 - 数学 /扩展欧几里得

    传送门 题意:求出a和b不能通过线性组合(即n*a+m*b)得到的最大值: 思路:摘自洛谷: 不妨设 a<b 假设答案为 x 若 x≡m*a ( mod b )(1≤m≤b−1) (mod3)什 ...

  2. codeforces 459 E. Pashmak and Graph(dp)

    题目链接:http://codeforces.com/contest/459/problem/E 题意:给出m条边n个点每条边都有权值问如果两边能够相连的条件是边权值是严格递增的话,最长能接几条边. ...

  3. C++ STL vector的学习

    vector就是一个不定长数组,vector是动态数组,随着元素的加入,它的内部机制会自行扩充空间以容纳新元素,使用vector之前,必须包含相应的头文件和命名空间. #include <vec ...

  4. 【Offer】[33] 【二叉搜索树的后序遍历序列】

    题目描述 思路分析 测试用例 Java代码 代码链接 题目描述 输入一个整数数组,判断该数组是不是某二叉搜索树的后序遍历结果.如果是则返回true, 否则返回false. 假设输入的数组的任意两个数字 ...

  5. 使用 jupyter-notebook + python + matplotlib 进行数据可视化

    上次用 python 脚本中定期查询数据库,监视订单变化,将时间与处理完成订单的数量进行输入写入日志,虽然省掉了人为定时查看数据库并记录的操作,但是数据不进行分析只是数据,要让数据活起来! 为了方便看 ...

  6. opencv边缘检测报错

    cnts = cv2.findContours(edged_image.copy(), cv2.RETR_LIST, cv2.CHAIN_APPROX_SIMPLE)cnts = cnts[0] if ...

  7. JAVA学习笔记—review基本知识[反射与异常]

    JAVA学习笔记—review基本知识[反射与异常] 1.异常: 1.1异常的分类: Java会将所有的异常封装成对象,其根本父类为Throwable. Throwable有两个子类:Error 和E ...

  8. jmeter 遍历数据库

  9. 按插入顺序排序的map

    LinkedHashMap HashMap是无序的,HashMap在put的时候是根据key的hashcode进行hash然后放入对应的地方.所以在按照一定顺序put进HashMap中,然后遍历出Ha ...

  10. hadoop之hdfs架构详解

    本文主要从两个方面对hdfs进行阐述,第一就是hdfs的整个架构以及组成,第二就是hdfs文件的读写流程. 一.HDFS概述 标题中提到hdfs(Hadoop Distribute File Syst ...