Vue中的axios请求设置base_url几种方式
方式1. 通过全局的vue组件实现(在main.js中定义全局变量)Vue.prototype.$base_url = 'http://172.17.10.109:7600';let url=this.$base_url + '/version/list';方式2.在入口文件main.js中实现1.import axios from ‘axios’axios.defaults....
·
方式1. 通过全局的vue组件实现(在main.js中定义全局变量)
Vue.prototype.$base_url = 'http://172.17.10.109:7600';
let url=this.$base_url + '/version/list';
方式2.在入口文件main.js中实现
1.import axios from ‘axios’
axios.defaults.baseURL=‘http://www.liulongbin.top:3005/’;
Vue.prototype.$http = axios
2. created(){
axios({
url:‘api/getlunbo’,
method: ‘get’,
})
方式3.vue中使用axios给生产环境和开发环境配置不同的baseUrl
第一步:设置不同的接口地址
找到文件:/config/dev.env.js代码修改为:
var merge = require('webpack-merge')
var prodEnv = require('./prod.env')
module.exports = merge(prodEnv, {
NODE_ENV: '"development"', //添加
API_ROOT: '"//192.168.1.8/api"'
}
/config/prod.env.js代码修改为:
module.exports = {
NODE_ENV: '"production"',
//添加
API_ROOT: '"//www.baidu.com/api"'
}
第二步:调用axios的文件下修改baseUrl
axios.defaults.baseURL = process.env.API_ROOT
第三步:重启项目,这样在开发环境执行npm run dev 的时候,就调用的是192.168.1.8/api而在执行npm run build打包的时候则调用的是www.baidu.com/api
官网:bbsmax
4.参考
vue跨域处理(vue项目中baseUrl设置问题)
https://www.wandouip.com/t5i259396/
更多推荐
所有评论(0)