Vue2, Vuex - используйте Axios во всех модулях из одного места - PullRequest
Новая
       16

Vue2, Vuex - используйте Axios во всех модулях из одного места

0 голосов
/ 06 марта 2019

Как я могу сделать axios доступным во всех модулях из одного места?На данный момент мне нужно импортировать axios во все модули, все добавить все заголовки и токены еще раз.Как я могу избежать этого?В настоящее время у меня есть это в качестве основного файла для моего Vuex (пользовательский модуль довольно большой, но часть axios повторяется: 

import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'
import user from '@/store/modules/user'

Vue.use(Vuex)

axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

axios.defaults.baseURL = 'http://localhost:9999'

let token = document.head.querySelector('meta[name="csrf-token"]');

if (token) {
    axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
} else {
    console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
}


export const store = new Vuex.Store({
    modules: {
        user
    },
    state: {
      token: localStorage.getItem('access_token') || null,
    },
    getters: {
        loggedIn(state){
            return state.token !== null
        }
    },
    mutations: {
        retrieveToken(state, token){
            state.token = token
        },
        destroyToken(state) {
            state.token = null
        }
    },
    actions: {

        retrieveToken(context, credentials){

            return new Promise((resolve, reject) => {
                axios.post('/api/auth/login', {
                  email: credentials.email,
                  password: credentials.password,
                })
                  .then(response => {
                    localStorage.setItem('access_token', response.data.access_token)
                    context.commit('retrieveToken', response.data.access_token)
                    resolve(response)
                  })
                  .catch(error => {
                    reject(error)
                  })
            })

        },

        destroyToken(context) {
            axios.defaults.headers.common['Authorization'] = 'Bearer ' + context.state.token

            if (context.getters.loggedIn) {

                return new Promise((resolve, reject) => {
                    axios.post('/api/auth/logout')
                        .then(response => {
                            localStorage.removeItem('access_token')
                            context.commit('destroyToken')
                            resolve(response)
                        })
                        .catch(error => {
                            localStorage.removeItem('access_token')
                            context.commit('destroyToken')
                            reject(error)
                        })
                })
            }
        }
    }
  })
...