Плагин для vuex не работает

Моя цель:

Я не буду создавать плагин, который будет устанавливать заголовок с токеном для всех запросов.

Проблема:

Плагин не работает.

Комментарии:

Плагин нужно добавить в модуль хранилища. (Может быть, в данном случае это имеет какое-то значение. Не знаю)

Код плагина:

export default function(store){
    store.subscribe((mutation, state) => {

        if(mutation.type === "GetToken"){

            console.log('TOKEN: ' + state.token);

            Vue.http.interceptors.push((request, next) => {

                request.headers.set('Authorization', 'Bearer ' +state.token);
                next();

            });

        }

    });
}

код хранения:

import AuthenticationPlugin from "../plugins/authorization"
export default {

    namespaced: true,

    plugins: [AuthenticationPlugin],

    state:{
        token: null,
        email: null,
        signinResponse:{
            ok:         null,
            status:     null,
            statusText: null,
            url:        null,
            data:       null,
        },
    },

    getters:{
        userToken(state){
            return state.token;
        },
        userSigninResponseOk(state){
            return state.signinResponse.ok;
        },
        userSigninResponseStatus(state){
            return state.signinResponse.status;
        },
        userSigninResponseStatusText(state){
            return state.signinResponse.statusText;
        },
        userSigninResponseUrl(state){
            return state.signinResponse.url;
        },
        userSigninResponseData(state){
            return state.signinResponse.data;
        },
    },

    mutations:{
        GetToken(state, credentials){

            let c = credentials;
            let s = state;

            s.email       = c.email;

            Vue.http.post('api/admin/signin', {
                'email':    c.email ,
                'password': c.password,
            }).then(response=>{

                let r = response,
                    d = r.data,
                    s = state,
                    sr= s.signinResponse;

                s.token       = d.hasOwnProperty('token') ? d.token : null;
                sr.ok         = r.ok;
                sr.status     = r.status;
                sr.statusText = r.statusText;
                sr.url        = r.url;
                sr.data       = r.data;

            }, response=>{

                let r = response,
                    d = r.data,
                    s = state,
                    sr= s.signinResponse;

                sr.token      = null;
                sr.ok         = r.ok;
                sr.status     = r.status;
                sr.statusText = r.statusText;
                sr.url        = r.url;
                sr.data       = r.data;

            });

        }
    },

    actions:{
        GetToken(context, credentials){
            context.commit('GetToken', credentials);
        }
    },

}

vue.js vuex vuejs2 vue-resource
person Evgeniy Miroshnichenko    schedule 14.05.2017    source источник
comment
Где настоящая ошибка?   -  person Frnak    schedule 15.05.2017
comment
@FrankProvost Я не знаю, была ли ошибка. Я просто знаю, что это не работает. Консоль IDE была пуста, консоль браузера тоже была пуста. Когда я поместил функцию console.log () в плагин, просто чтобы проверить, вызван ли плагин или нет, я не получил никакого сообщения от этой функции в консоли моего браузера.   -  person Evgeniy Miroshnichenko    schedule 15.05.2017
comment
@FrankProvost На самом деле я понял, что идея хранить токен в хранилище vuex была неправильной. Потому что, если пользователь перезагрузит страницу браузера, токен будет удален, и ему придется снова войти в систему. Но если абстрагироваться от понимания неправильной концепции, думаю, плагин все равно должен работать.   -  person Evgeniy Miroshnichenko    schedule 15.05.2017

Ответы (1)


arrow_upward
1
arrow_downward

Если вы хотите прослушивать мутации модуля, вы должны вызвать мутацию с именем регистра модуля. И я не знаю, что плагин может вводить в модуль, поэтому я думаю, что плагин должен вводить в файл store.js

My

import ObservePlugin from "./ObservePlugin";

Vue.use(Vuex);

export default new Vuex.Store({
...
    modules: {
        'sampleModule': SampleModule
    }
    plugins :[
        ObservePlugin
    ]
})

Подпишитесь на мутацию модуля с пространством имен:

store.subscribe((mutation, state) => {
    if(mutation.type === 'sampleModule/mutationName') {
        console.log(mutation)
    }
})
person eyaylagul    schedule 04.09.2018