nuxtjs的axios二次封装

一、在nuxt.config.js中的plugins引入axios文件

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

二、在项目根目录新建plugins/axios.js

export default ( { $axios,store } )=>{

    //Request拦截器，设置token
    $axios.onRequest((config)=>{
        console.log( 111 );
        config.headers['Authorization'] = store.state.token;
    })

    //Error拦截器 : 出现错误的时候被调用
    $axios.onRequest((error)=>{
        console.log( 222 );
    })

    $axios.onResponse((response)=>{
        console.log( 333);
        return response.data;
    })

}

三、middleware/auth.js

export default ( {store,redirect} )=>{
    store.commit('getToken');
    if( !store.state.token ){
        redirect('/login');
    }
}

四、store/index.js

export const state = {
    token : '小鹿线:www.xuexiluxian.cn'
}
export const mutations = {
    setToken( state , token ){
        state.token = token;
        this.$cookies.set('token',token);
    },
    getToken( state ){
        state.token = this.$cookies.get('token');
    }
}