axios憨比式配置

129 阅读1分钟

1、设置请求拦截和响应拦截

//生产环境
const PRODUCT_URL = 'httsps://xxxx.com'
//开发环境
const MOCK_URL = 'http://xxxx.com'
let http = axios.create({
  baseURL: process.env.NODE_ENV === 'production' ? PRODUCT_URL : MOCK_URL,
})
// 请求拦截器
http.interceptors.request.use(
  (config) => {
    // 设置token,Content-Type
    var token = sessionStorage.getItem('token')
    config.headers['token'] = token
    config.headers['Content-Type'] = 'application/json;charset=UTF-8'
    return config
  },
  (error) => {
    return Promise.reject(error)
  }
)
// 响应拦截器
http.interceptors.response.use(
  (res) => {
    // 再返回之前进行响应处理
    if (res.data.code === xxx) {
    }
    return res
  },
  (error) => {
    return Promise.reject(error)
  }
)

2、get和post请求封装

import axios from 'axios'
const qs = require('qs');
export const get = ({
  url,
  params
}) => {
  return axios({
      url,
      params
    })
    .then((result) => {
      return result.data
    })
    .catch((err) => {
      return err.message
    })
}

export const post = (
  url,
  data
) => {
//将post请求的数据进行一个序列化
  return axios.post(url, qs.stringify(data))
    .then((result) => {
      return result.data
    })
    .catch((err) => {
      return err.message
    })
}