Vue三步完成跨域请求
三步完成跨域请求
①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三步完成跨域请求的更多相关文章
- vue.js学习之 跨域请求代理与axios传参
vue.js学习之 跨域请求代理与axios传参 一:跨域请求代理 1:打开config/index.js module.exports{ dev: { } } 在这里面找到proxyTable{}, ...
- VUE系列三:实现跨域请求(fetch/axios/proxytable)
1. 在 config/index.js 配置文件中配置proxyTable 'use strict' // Template version: 1.3.1 // see http://vuejs-t ...
- Vue.js 2.0 跨域请求数据
Vuejs由1.0更新到了2.0版本.HTTP请求官方也从推荐使用Vue-Resoure变为了 axios .接下来我们来简单地用axios进行一下异步请求.(阅读本文作者默认读者具有使用npm命令的 ...
- vue 使用axios 出现跨域请求的两种解决方法
最近在使用vue axios发送请求,结果出现跨域问题,网上查了好多,发现有好几种结局方案. 1:服务器端设置跨域 header(“Access-Control-Allow-Origin:*”); h ...
- 基于vue移动音乐webapp跨域请求失败的问题解决
在学习一位vue大牛的课程<VUE2.0移动端音乐App开发>时,由于vue的版本原因遇到了一些问题 这是其中之一,花费了很多的时间去解决 虽然搞定了这个问题,但是很多东西理解也不是很到位 ...
- $Django 前后端之 跨域问题(同源策略) vue项目(axios跨域请求数据)
1 跨域问题(多个域之间的数据访问) #同源策略(ip port 协议全部相同) #本站的只能请求本站域名的数据 #CORS实现(跨域资源共享) #实现CORS通信的关键是服务器.只要服务器实现了CO ...
- AJAX请求和跨域请求详解(原生JS、Jquery)
一.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数 ...
- Vuex、axios、跨域请求处理和import/export的注意问题
一.Vuex 1.介绍 vuex是一个专门为Vue.js设计的集中式状态管理架构. 对于状态,我们把它理解为在data中需要共享给其他组件使用的部分数据. Vuex和单纯的全局对象有以下不同: 1. ...
- vue-cli项目开发/生产环境代理实现跨域请求+webpack配置开发/生产环境的接口地址
一.开发环境中跨域 使用 Vue-cli 创建的项目,开发地址是 localhost:8080,需要访问非本机上的接口http://10.1.0.34:8000/queryRole.不同域名之间的访问 ...
随机推荐
- CF988D Points and Powers of Two 数学结论题 规律 第十题
Points and Powers of Two time limit per test 4 seconds memory limit per test 256 megabytes input sta ...
- Quartz.Net使用教程
在项目的开发过程中,难免会遇见后需要后台处理的任务,例如定时发送邮件通知.后台处理耗时的数据处理等,这个时候你就需要Quartz.Net了. Quartz.Net是纯净的,它是一个.Net程序集,是非 ...
- MySQL连接方式小结
1. 连接方式 1.1 方式1 /usr/local/mysql5./bin/mysql -p 此方法默认采用root@localhost用户登录, 1.2 方式2 /usr/local/my ...
- [1]尝试用Unity3d制作一个王者荣耀(持续更新)->AssetBundle管理器
如果已经看过本章节:目录传送门:这是目录鸭~ 1.AssetBundleManager: 首先我们创建一个文件夹,叫AssetBundleManager,再创建Csharp(即C#)脚本,名为Asse ...
- 体验一下:AndroidX
背景 今天在更新 ButterKnife 到最新版本的时候出现了一个问题,我引入的是 10.1.0 最新版本: implementation 'com.jakewharton:butterknife: ...
- Java后端面试经验总结分享(一)
今天下午两点的时候,我去面了一家招Java开发的公司,本人工作经验2年多一丢丢. 跟大部分公司类似,先做一份笔试题,题目都比较简单,基本都写完了.我把题目以及答案列在下面一下,给自己做一下总结的,也分 ...
- CCPC桂林
在得知我们队伍前往桂林参加CPPC区域赛后,我是非常激动的,因为我们网络赛并没有得到名额,如果不是新都赠予我们名额,我们都没有出去打比赛的机会,同时,我们也不想浪费这个名额,我们也想打出成绩来,于是我 ...
- Java第二次作业第四题
文本行输入学生姓名,下来框选择课程名称,文本行输入课程成绩:点击"录入"按钮,相关信息显示在文本区:点击"统计"按钮,将所有录入的成绩的平均成绩显示在另一个文本 ...
- 详细的App推广前的准备工作
App开发完成后,推广App自然就成为下一步工作的重点.兵马未动,粮草先行,这里为大家整理了一份App推广前需要准备一些事项,希望能给正在准备开展App推广的小伙伴们一些帮助. 众所周知,App推广的 ...
- preg_relace_callback不起作用匿名函数不启作用替换字符串中的所有图片
遇到这样的一个需求,即替换新闻正文中的所有图片,将其图片地址补充为完整的地址. 刚开始的时候,采用匿名函数的方法可以使用,但有一个问题,好像是php的匿名函数5.4以前的版本支持的并不好. 然后在内部 ...