鍍金池/ 問答/HTML/ Nuxtjs中的@nuxtjs/axios如何設(shè)置全局攔截器

Nuxtjs中的@nuxtjs/axios如何設(shè)置全局攔截器

問題描述

眾所周知,在vue-cli開發(fā)中,我們可以二次封裝axios(設(shè)置攔截器、baseURL、timeout等)
但是再nuxt開發(fā)中,我試過了不用@nuxt/axios,自己封裝一個axios,然后在需要用到的組件import進來,也成功用'@gauseen/nuxt-proxy進行的跨域處理,但是一直會報一個錯connect ECONNREFUSED 127.0.0.1:80,客戶端、服務(wù)端都會報錯(服務(wù)端在asyncData中使用axios請求),現(xiàn)在我改用@nuxt/axios解決,但是我想知道怎么設(shè)置一個全局的攔截器呢?

回答
編輯回答
夏夕

nuxt.config.js

{
  modules: [
    '@nuxtjs/axios',
  ],

  plugins: [
    '~/plugins/axios'
  ]
}

插件/ axios.js

export default function ({ $axios, redirect }) {
  $axios.onRequest(config => {
    console.log('Making request to ' + config.url)
  })

  $axios.onError(error => {
    const code = parseInt(error.response && error.response.status)
    if (code === 400) {
      redirect('/400')
    }
  })
}
2018年4月6日 14:31