接口封装环境配置

我们自己封装接口组件时，需要配置几个文件来作为环境配置。

.env.development文件中配置

# just a flag
ENV = 'development'

# base api
VUE_APP_BASE_API = '/api'

port = 8888
 

vue.config.js文件中设置代理

proxy: {

'/api': {

target: 'http://后端接口网站地址',

changeOrigin: true

}

}

utils文件中配置request.js

import axios from 'axios'

import { Message } from 'element-ui'

const service = axios.create({

//基准路径

  baseURL: process.env.VUE_APP_BASE_API,

  timeout: 5000

})

service.interceptors.request.use()

service.interceptors.response.use(

  res => {

    const { message, success, data } = res.data

    if (success) {

      return data

    } else {

      Message.error(message)

      return Promise.reject(new Error(message))

    }

  },

  err => {

    Message.error(err.message)

    return Promise.reject(new Error(err.message))

  }

)

export default service