nuxt中在middleware中间件中拦截错误

2019-12-11 03:39

椰子皮

6295

Vue

“ 在使用nuxt开发中，我们希望请求出错时，直接跳转到错误页面，在后台自定义错误中跳转到相关页面，提升用户体验。 ”

在middleware文件夹中新建一个js文件，例如我这里将它命名为intercept.js。接着填写如下代码：

复制代码


export default function({ store, route, redirect, $axios, error }) {
  // 根据后台返回的自定义错误码进行拦截
  $axios.onResponse(res => {
    const code = res.data.code
    if (code === 500) {
      return Promise.reject()
    }
    if (code === 404) {
      return error ({
        statusCode: 404
      })
    }
  })
  // 错误请求拦截跳转错误页面
  $axios.onError(() => {
    return error ({
      statusCode: 500
    })
  })
}

赏

支付宝微信

关注公众号获取更多内容

nuxt