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 ...
随机推荐
- Flutter 网络请求库http
http 集成http库 https://pub.dartlang.org/packages/http 添加依赖 dependencies: http: ^ 安装 flutter packages g ...
- react native中的聊天气泡以及timer封装成的发送验证码倒计时
今天看来情书写的文章,研究了一下大佬写的文章,自己做一点总结. 其实,今天我想把我近期遇到的坑都总结一下:1.goBack的跨页面跳转,又两种方法,一可以像兔哥那样修改navigation源码,二可以 ...
- redis之安装与简单使用
python操作redis: https://www.cnblogs.com/melonjiang/p/5342505.html https://www.jianshu.com/p/2639549be ...
- load file within a jar
String examplejsPrefix = "example"; String examplejsSuffix = "js"; String exampl ...
- 50家硅谷IT公司技术博客
分享一下 50 家硅谷优秀 IT 公司技术博客,从中可以了解企业文化,技术特色和设计语言,如果直接列出来很单调,加上点评,算吐槽版吧. 知名大厂 1. Facebook https://www.f ...
- Java 重写 hashCode() 和 equals() 方法
1. hashCode 1.1 基本概念 hashCode 是 JDK 根据对象的地址算出来的一个 int 数字(对象的哈希码值),代表了该对象再内存中的存储位置. hashCode() 方法是超级类 ...
- Win7 user profile cant logon
1.local user:testlb1 1234@cat can login safe model 1.重新启动计算机开机时连续点击F8,选择进入安全模式.2.开始-在搜索栏中输入services. ...
- (转)glew的安装
http://blog.sina.com.cn/s/blog_858820890100vbys.html 下载链接: https://sourceforge.net/project/downloadi ...
- 邮件客户端修改密码—OWA
邮件客户端修改密码—OWA 1.登录OWA 2.输入用户名 3.点击选项 4.更改密码
- 用JS制作《飞机大作战》游戏_第1讲(素材查找和界面框架搭建)-陈远波
一.查找素材: 二.分析游戏界面框架: 登录界面.游戏界面.暂停游戏界面.玩家死亡后弹出界面:并对应的界面包含什么元素: 三.分别搭建以上四个界面: 1.登录界面与游戏界面框架(隐藏游戏界面,四个界面 ...