vue 使用 proxyTable 解决跨域问题
1、在 main.js 中,在引入 axios:
import axios from 'axios'
Vue.config.productionTip = false Vue.prototype.$axios = axios //将axios挂载在Vue实例原型上 // 设置axios请求的token
axios.defaults.headers.common['token'] = 'f4c902c9ae5a2a9d8f84868ad064e706'
//设置请求头
axios.defaults.headers.post["Content-type"] = "application/json"
2、在 config/index.js 中,找到 dev 下的 proxyTable:
proxyTable: {
'/apis': {
// 测试环境
target: 'http://localhost:8000/', // 接口域名
changeOrigin: true, //是否跨域
pathRewrite: {
'^/apis': '' //需要rewrite重写的,
}
}
}
3、调用的接口页面中,引入:
var api = '/apis/...'
this.$http.get(api).then(function(res) {
// 打印出来
console.log(...)
},function(err) {
console.log(err)
})
vue 使用 proxyTable 解决跨域问题的更多相关文章
- vue webpack配置解决跨域问题
现在基本项目都是实行前后端分离的原则,不管是ng 或者是vue 在开发中都无法避免跨域的这个问题 本人刚上手第一个vue项目,在调用api的时候出现了跨域的这个问题 这是封装好一个简单的post 请求 ...
- proxyTable 解决跨域问题
1.使用 proxyTable(地址映射表)解决跨域问题(即通过设置代理解决跨域问题): 可以通过设置将复杂的url简化,例如我们要请求的地址是api.xxxxxxxx.com/list/1,可以按照 ...
- vue+nodejs+express解决跨域问题
nodejs+express解决跨域问题,发现网上的大部分都是误导人,花了不少时间,终于弄懂了, 我在vue+nodejs+express+mongodb的项目里面,发现本地用vue代理正常调用远程的 ...
- vue反向代理解决跨域
问题描述 在项目开发的时候,接口联调的时候一般都是同域名下,且不存在跨域的情况下进行接口联调,但是当我们现在使用vue-cli进行项目打包的时候,我们在本地启动服务器后,比如本地开发服务下是 http ...
- vue项目中解决跨域问题axios和
项目如果是用脚手架搭建的(vue cli)项目配置文件里有个proxyTable proxyTable是vue-cli搭建webpack脚手架中的一个微型代理服务器,配置如下 配置和安装axios 安 ...
- vue.js vue-jsonp解决跨域问题
安装jsonp npm install vue-jsonp --save main.js中引入 import VueJsonp from 'vue-jsonp' Vue.use(VueJsonp) 组 ...
- vue.js 本地解决跨域
1.config/index.js下添加proxyTable dev: { // Paths assetsSubDirectory: 'static', assetsPublicPath: '/', ...
- 前端vue开发中的跨域问题解决,以及nginx上线部署。(vue devServer与nginx)
前言 最近做的一个项目中使用了vue+springboot的前后端分离模式 在前端开发的的时候,使用vue cli3的devServer来解决跨域问题 上线部署则是用的nginx反向代理至后台服务所开 ...
- vue 解决跨域问题
1.后端处理允许跨域 2.反向代理跨域 代理服务器英文全称是Proxy Server,其功能就是代理网络用户去去的网络信息.形象的说:它是网络信息的中转站. vue中设置代理: 1.config/in ...
随机推荐
- 怎么给SharePoint得视图设置多个过滤条件? How to set multiple complex filter conditions to the SharePoint list view ?
平时会很容易遇到需要给视图设置复杂得过滤条件,如果是一两个条件还好多,如果条件超过四个,会比较麻烦,很容易会出现逻辑不清,或者没有按照你得意愿来过滤数据得问题. 解决方案: 设置计算列,calcula ...
- 语义SLAM的数据关联和语义定位(一)
语义SLAM和多传感器融合是自动驾驶建图和定位部分比较热门的两种技术.语义SLAM中,语义信息的数据关联相较于特征点的数据关联有所不同.我们一般用特征描述子的相似性来匹配和关联不同图像中的特征点.特征 ...
- jsp隐式对象
隐式对象使用位置 隐式对象在转译为Servlet后,是_jspService()中的局部变量.隐式对象只能在<%与%>之间,或<%=与%>之间直接使用. 无法在<%!与% ...
- Charles抓取https请求
最近公司将Windows产品的http请求,替换成https请求了,当https请求超过5次失败,就自动切换回http请求.测试时使用Charles抓包测试. 一.http抓包 http抓包比较简单, ...
- CSS样式----CSS属性:字体属性和文本属性(图文详解)
本文最初于2015-10-04发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 本文重要内容 CSS的单位 字体属性 文本属性 定 ...
- ELF文件结构描述
ELF目标文件格式最前部ELF文件头(ELF Header),它包含了描述了整个文件的基本属性,比如ELF文件版本.目标机器型号.程序入口地址等.其中ELF文件与段有关的重要结构就是段表(Sectio ...
- linux常见问题解决
1.登录环境故障的原理及解决办法? -bash-4.1$ -bash-4.1$ cp /etc/skel/.bash* .
- unknown host www.baidu.com 解决方法
今晚一开机发现无法更新yum了,本机是连着wife的,咋无法更新呢,作为小白,一脸懵逼.于是ping了一下百度,网络不可达.... 于是我查看了一下DNS,发现设置了,于是看了一下物理机的DNS,发现 ...
- Local policy - User rights assignment 对照表
"SeCreateTokenPrivilege" --> "Create a token object" "SeAssignPrimaryTo ...
- beta冲刺————第一天(1/5)
人员的再次分配: 调走人员:陈裕鹏(原来在本队伍主要进行文章推荐算法的设计) 调入人员:陈邡(原Dipper团队,负责游戏内容的策划案,以及做一些后端的探索工作.) 现队员工作划分: 王国华,吴君毅, ...