JavaScript | vuejs 로그인 체크 router 예제
페이지 정보
- 작성자:
- 핵탐
- 작성일
- 12.06 16:36
- 조회
- 2,862
- 댓글
- 0
본문
[code]
import Vue from 'vue'
import Router from 'vue-router'
import Home from './views/Home.vue'
import _ from 'lodash'
Vue.use(Router)
const router = new Router({
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
name: 'home',
component: Home,
},
{
path: '/login',
name: 'login',
component: () =>
import(/* webpackChunkName: "login" */ './views/Login.vue'),
meta: {
permision: 'guest', // 손님만 접근가능
},
},
{
path: '/signup',
name: 'signup',
component: () =>
import(/* webpackChunkName: "signup" */ './views/Signup.vue'),
meta: {
permision: 'guest', // 손님만 접근가능
},
},
{
path: '/myaccount',
name: 'myaccount',
component: () =>
import(/* webpackChunkName: "myaccount" */ './views/MyAccount.vue'),
meta: {
permision: 'member', // 회원만 접근가능
},
},
{
path: '/forgot',
name: 'forgot',
component: () =>
import(/* webpackChunkName: "forgot" */ './views/Forgot.vue'),
meta: {
permision: 'guest', // 손님만 접근가능
}
},
{
path: '/mylink',
name: 'mylink',
component: () =>
import(/* webpackChunkName: "mylink" */ './views/MyLink.vue'),
meta: {
permision: 'member',
}
},
]
})
router.beforeEach(async (to, from, next) => {
const permission = _.get(to, 'meta.permision')
// meta.permission 이 member 이고 token 쿠키가 없으면 로그인 화면으로 보냄
if (permision === 'member' && Vue.$cookies.get('token') === null) {
return next({ name: 'login' })
// meta.permission 이 guest 이고 token 쿠키가 있으면 홈으로 보냄
} else if (permision === 'guest' && Vue.$cookies.get('token')) {
return next({ name: 'home' })
}
return next()
})
export default router
[/code]
댓글 0개
등록된 댓글이 없습니다.