This commit is contained in:
aozhiwei 2020-12-21 10:00:54 +08:00
parent 74043e236a
commit 4f6152f068
5 changed files with 130 additions and 71 deletions

View File

@ -35,16 +35,35 @@ router.beforeEach(async(to, from, next) => {
// get user info
// note: roles must be a object array! such as: ['admin'] or ,['developer','editor']
const { roles } = await store.dispatch('user/getInfo')
// 判断页面是否可见
const permissions = store.getters.userInfo.permissions
const allowed = to.meta.allowed || []
let isVisible = false
if (allowed.length > 0) {
for (let i = 0; i < allowed.length; i++) {
if (permissions.includes(allowed[i])) {
isVisible = true
break
}
}
if (isVisible) {
next()
} else {
next('/403')
}
} else {
next()
}
// generate accessible routes map based on roles
const accessRoutes = await store.dispatch('permission/generateRoutes', roles)
// // generate accessible routes map based on roles
// const accessRoutes = await store.dispatch('permission/generateRoutes', roles)
// dynamically add accessible routes
router.addRoutes(accessRoutes)
// // dynamically add accessible routes
// router.addRoutes(accessRoutes)
// hack method to ensure that addRoutes is complete
// set the replace: true, so the navigation will not leave a history record
next({ ...to, replace: true })
// // hack method to ensure that addRoutes is complete
// // set the replace: true, so the navigation will not leave a history record
// next({ ...to, replace: true })
} catch (error) {
// remove token and go to login page to re-login
await store.dispatch('user/resetToken')

View File

@ -12,6 +12,7 @@ const getters = {
roles: state => state.user.roles,
permission_routes: state => state.permission.routes,
addRoutes: state => state.permission.addRoutes,
errorLogs: state => state.errorLog.logs
errorLogs: state => state.errorLog.logs,
userInfo: state => state.user.userInfo
}
export default getters

View File

@ -6,25 +6,29 @@ const state = {
token: getToken(),
name: '',
avatar: '',
introduction: '',
roles: []
//introduction: '',
//roles: [],
userInfo: {}
}
const mutations = {
SET_TOKEN: (state, token) => {
state.token = token
},
SET_INTRODUCTION: (state, introduction) => {
state.introduction = introduction
},
SET_NAME: (state, name) => {
state.name = name
},
SET_AVATAR: (state, avatar) => {
state.avatar = avatar
},
SET_ROLES: (state, roles) => {
state.roles = roles
// SET_INTRODUCTION: (state, introduction) => {
// state.introduction = introduction
// },
// SET_NAME: (state, name) => {
// state.name = name
// },
// SET_AVATAR: (state, avatar) => {
// state.avatar = avatar
// },
// SET_ROLES: (state, roles) => {
// state.roles = roles
// }
SET_USERINFO: (state, userInfo) => {
state.userInfo = userInfo
}
}
@ -36,6 +40,7 @@ const actions = {
login({ username: username.trim(), password: password }).then(response => {
const { data } = response
commit('SET_TOKEN', data.token)
commit('SET_USERINFO', data.userInfo)
setToken(data.token)
resolve()
}).catch(error => {
@ -49,23 +54,30 @@ const actions = {
return new Promise((resolve, reject) => {
getInfo(state.token).then(response => {
const { data } = response
if (!data) {
reject('Verification failed, please Login again.')
if (!data || data.errcode !== 0) {
reject('验证失败,请重新登录!')
}
const { userInfo } = data
const { roles, name, avatar, introduction } = data
// roles must be a non-empty array
if (!roles || roles.length <= 0) {
reject('getInfo: roles must be a non-null array!')
}
commit('SET_ROLES', roles)
commit('SET_NAME', name)
commit('SET_AVATAR', avatar)
commit('SET_INTRODUCTION', introduction)
commit('SET_USERINFO', userInfo)
resolve(data)
// if (!data) {
// reject('Verification failed, please Login again.')
// }
// const { roles, name, avatar, introduction } = data.userInfo
// // roles must be a non-empty array
// if (!roles || roles.length <= 0) {
// reject('getInfo: roles must be a non-null array!')
// }
// commit('SET_ROLES', roles)
// commit('SET_NAME', name)
// commit('SET_AVATAR', avatar)
// commit('SET_INTRODUCTION', introduction)
//resolve(data)
}).catch(error => {
reject(error)
})
@ -76,8 +88,8 @@ const actions = {
logout({ commit, state }) {
return new Promise((resolve, reject) => {
logout(state.token).then(() => {
commit('SET_TOKEN', '')
commit('SET_ROLES', [])
//commit('SET_TOKEN', '')
//commit('SET_ROLES', [])
removeToken()
resetRouter()
resolve()
@ -91,33 +103,33 @@ const actions = {
resetToken({ commit }) {
return new Promise(resolve => {
commit('SET_TOKEN', '')
commit('SET_ROLES', [])
//commit('SET_ROLES', [])
removeToken()
resolve()
})
},
// Dynamically modify permissions
changeRoles({ commit, dispatch }, role) {
return new Promise(async resolve => {
const token = role + '-token'
// changeRoles({ commit, dispatch }, role) {
// return new Promise(async resolve => {
// const token = role + '-token'
commit('SET_TOKEN', token)
setToken(token)
// commit('SET_TOKEN', token)
// setToken(token)
const { roles } = await dispatch('getInfo')
// const { roles } = await dispatch('getInfo')
resetRouter()
// resetRouter()
// generate accessible routes map based on roles
const accessRoutes = await dispatch('permission/generateRoutes', roles, { root: true })
// // generate accessible routes map based on roles
// const accessRoutes = await dispatch('permission/generateRoutes', roles, { root: true })
// dynamically add accessible routes
router.addRoutes(accessRoutes)
// // dynamically add accessible routes
// router.addRoutes(accessRoutes)
resolve()
})
}
// resolve()
// })
// }
}
export default {

View File

@ -16,7 +16,8 @@ service.interceptors.request.use(
// Do something before request is sent
if (store.getters.token) {
// 让每个请求携带token-- ['X-Token']为自定义key 请根据实际情况自行修改
config.headers['X-Token'] = getToken()
config.headers.authorization = 'Bearer ' + getToken()
//config.headers['X-Token'] = getToken()
}
return config
},
@ -41,7 +42,31 @@ service.interceptors.response.use(
*/
response => {
const res = response.data
if (res.code !== 20000) {
if (res.errcode !== 0) {
Message({
message: res.errmsg,
type: 'error',
duration: 5 * 1000
})
// 50008:非法的token; 50012:其他客户端登录了; 50014:Token 过期了;
if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
// 请自行在引入 MessageBox
// import { Message, MessageBox } from 'element-ui'
MessageBox.confirm('你已被登出,可以取消继续留在该页面,或者重新登录', '确定登出', {
confirmButtonText: '重新登录',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
store.dispatch('user/resetToken').then(() => {
location.reload() // 为了重新实例化vue-router对象 避免bug
})
})
}
return Promise.reject('error')
} else {
return response;
}
/*if (res.code !== 20000) {
Message({
message: res.message,
type: 'error',
@ -64,7 +89,7 @@ service.interceptors.response.use(
return Promise.reject('error')
} else {
return res
}
}*/
},
error => {
console.log('err' + error) // for debug

View File

@ -83,28 +83,30 @@ export default {
name: 'Login',
components: { LangSelect, SocialSign },
data() {
const validateUsername = (rule, value, callback) => {
if (!validUsername(value)) {
callback(new Error('Please enter the correct user name'))
} else {
callback()
}
}
const validatePassword = (rule, value, callback) => {
if (value.length < 6) {
callback(new Error('The password can not be less than 6 digits'))
} else {
callback()
}
}
// const validateUsername = (rule, value, callback) => {
// if (!validUsername(value)) {
// callback(new Error('Please enter the correct user name'))
// } else {
// callback()
// }
// }
// const validatePassword = (rule, value, callback) => {
// if (value.length < 6) {
// callback(new Error('The password can not be less than 6 digits'))
// } else {
// callback()
// }
// }
return {
loginForm: {
username: 'admin',
password: '111111'
},
loginRules: {
username: [{ required: true, trigger: 'blur', validator: validateUsername }],
password: [{ required: true, trigger: 'blur', validator: validatePassword }]
// username: [{ required: true, trigger: 'blur', validator: validateUsername }],
// password: [{ required: true, trigger: 'blur', validator: validatePassword }]
username: [{ required: true, trigger: 'blur', message: '用户名不能为空' }],
password: [{ required: true, trigger: 'blur', message: '密码不能为空' }]
},
passwordType: 'password',
loading: false,