vue 登錄權限

vue判斷該路由是否需要登錄權限
https://www.cnblogs.com/lalalagq/p/9898202.html

// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import VueRouter from 'vue-router'
import routers from './routers'
import axios from 'axios'
import Element from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import Vuex from 'vuex'
import { login, logout } from '@/utils/direction';
import service from '@/utils/request';

Vue.use(VueRouter)
Vue.use(Element)
Vue.use(Vuex)

// axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
// Vue.prototype.$http = axios
Vue.prototype.$http = service
Vue.config.productionTip = false


const router = new VueRouter({
  mode: 'history',
  routes: routers
})

const store = new Vuex.Store({
  state: {
    count: 0,
    adminleftnavnum:"1", //管理後臺左側導航
    color: [ '#698570', '#AE5548', '#6D9EA8', '#9CC2B0', '#C98769','#325B69'],
    token: ''
  },
  mutations: {
    increment (state) {
      state.count++
    },
    set_token(state, token) {
      state.token = token
      sessionStorage.token = token
    },
    del_token(state) {
      state.token = ''
      sessionStorage.removeItem('token')
    }
  }
})

/** 刷新在次保存token */
if (sessionStorage.getItem('token')) {
  console.info("sessionStorage token = ",sessionStorage.getItem('token'));
  store.commit('set_token', sessionStorage.getItem('token'));
}


router.beforeEach((to, from, next) => {
  if (to.meta.title) {
    document.title = to.meta.title
  }
  if (to.matched.some(record => record.meta.requiresAuth)) {
    if (to.name === 'login') {
      next()
    } else if (sessionStorage.getItem('token')) {
      service.post('/api/loginGoing').then(response => {
          console.info("/api/loginGoing", response.data);
          if(response.data){
            next();
          }else{
            alert("您的身份認證已超時,請重新登錄"); 
            store.commit('del_token');
            next('/Login');
          }
      }).catch(error => {
          console.log("error : ",error);
      })
    } else {
      next('/Login')
    }
  } else {
    next()
  }
})



/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  store,
  components: { App },
  template: '<App/>',
  data: {
    eventHub: new Vue(),
    charts: []
  }
})

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章