Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
533 views
in Technique[技术] by (71.8m points)

vue axios 封装请求 遇到一个问题

当我页面访问出错的时候 我想获取后天返回的错误信息 获取不到
image.png
image.png

这是我封装的

import axios from 'axios'
// import store from '@/store'
import { Notify, Toast } from 'vant'

const service = axios.create({
  baseURL: process.env.VUE_APP_BASE_URL,
  timeout: process.env.VUE_APP_TIME_OUT
})
let isPrompt = false

service.interceptors.request.use(config => {
  // 防止 重复请求
  console.log(config.url)

  // 自定义请求头
  //     if (store.state.token) {
  //     }
  return config
}, error => {
  return Promise.reject(error)
})

service.interceptors.response.use(response => {
  console.log(response)
  if (response.status === 200 && response.data.code === 200) {
    return response.data
  } else {
    Notify({ type: 'warning', message: response.msg, duration: 3000 })
  }
  return response
}, error => {
  console.log(error)

  if (error && error.response) {
    switch (error.response.status) {
      case 400:
        error.message = '错误请求'
        break
      case 401:
        error.message = '未授权,请重新登录'
        break
      case 403:
        error.message = '拒绝访问'
        break
      case 404:
        error.message = '请求错误,未找到该资源'
        break
      case 405:
        error.message = '请求方法未允许'
        break
      case 500:
        error.message = '服务器出错'
        break
      case 501:
        error.message = '网络未实现'
        break
      default:
        error.message = `连接错误${error.response.status}`
    }
  } else {
    error.message = '网络出现问题,请稍后在试'
  }
  if (!isPrompt) {
    isPrompt = true
    const toast = Toast.loading({
      forbidClick: true,
      message: error.message
    })
    setTimeout(() => {
      toast.clear()
      isPrompt = false
    }, 3000)
  }
  return Promise.resolve(error)
})

export default service

问题出现的环境背景及自己尝试过哪些方法

相关代码

粘贴代码文本(请勿用截图)

你期待的结果是什么?实际看到的错误信息又是什么?


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

你现在接口返回code=400的时候,其实error.response.status=200,response并不会走error


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...