H5W3
当前位置:H5W3 > 其他技术问题 > 正文

【前端问题精选】axios可以修改默认baseUrl吗?或者有什么别的方案

需求就是当默认的host访问失败之后,需要换一个host,
我重新设置了axios.defaults.baseURL = ‘http://baidu.com/‘,
但是没生效,还是用的默认的

回答:

axios.interceptors.request.use((config) => {
    config.baseURL = newUrl
})

回答:

像这种配置一般都放在环境变量里面,因为大部分时间,开发和生产的基础url都不一样。

我贴一段代码里面,如何配置axios的示例代码。
以下为封装的axios代码requests.js文件

import axios from 'axios'
import { MessageBox, Message } from 'element-ui'
import store from '@/store'
import { getToken } from '@/utils/auth'

// create an axios instance
const service = axios.create({
  baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
  // withCredentials: true, // send cookies when cross-domain requests
  timeout: 5000 // request timeout
})

// request interceptor
service.interceptors.request.use(
  config => {
    // do something before request is sent

    if (store.getters.token) {
      // let each request carry token
      // ['X-Token'] is a custom headers key
      // please modify it according to the actual situation
      config.headers['token'] = getToken()
    }
    return config
  },
  error => {
    // do something with request error
    console.log(error) // for debug
    return Promise.reject(error)
  }
)

环境变量里面存放基础请求路径vue.config.js同级目录下创建.env.development文件
可以参考 vue-cli 环境变量配置官方文档 https://cli.vuejs.org/zh/guid…

# just a flag
ENV = 'development'

# base api
VUE_APP_BASE_API = 'http://xxxx/xxx'

本文地址:H5W3 » 【前端问题精选】axios可以修改默认baseUrl吗?或者有什么别的方案

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址