수정2...

src/router/index.js

@@ -47,7 +47,26 @@ const router = new VueRouter({
 // 참고 :
 // https://vueschool.io/lessons/how-to-configure-an-authentication-middleware-route-guard-with-vue-router
 // https://joshua1988.github.io/web-development/vuejs/vue-router-navigation-guards/
-// https://www.bottlehs.com/vue/vue-js-jwt-%EA%B8%B0%EB%B0%98-%EC%82%AC%EC%9A%A9%EC%9E%90-%EC%9D%B8%EC%A6%9D/
+// https://www.bottlehs.com/vue/vue-js-jwt-기반-사용자-인증/
+// 아래와 같이 가드는 3가지가 있음
+// 1. 전역가드 : router.beforeEach((to, from, next) 이런식으로 전체에 대해 특정조건 (meta: { requiredAuth: true })으로 사용
+// 2. 라우터 가드: 특정 Route Path아래에 직접선언-> beforeEach: function(to, from, next){}
+// 3. 컴포넌트 가드: 특정 vue 파일내에서 바로 선언해서 사용 :// view/Mypage.vue ( Mypage Components )
+// export default {
+//   name: "Mypage",
+//   beforeRouteEnter(to, from, next) {
+//     // Login 컴포넌트가 화면에 표시되기 전에 수행될 로직
+//     // Login 컴포넌트는 아직 생성되지 않은 시점
+//   },
+//   beforeRouteUpdate(to, from, next) {
+//     // 화면에 표시된 컴포넌트가 변경될 때 수행될 로직
+//     // `this`로 Login 컴포넌트를 접근할 수 있음
+//   },
+//   beforeRouteLeave(to, from, next) {
+//     // Login 컴포넌트를 화면에 표시한 url 값이 변경되기 직전의 로직
+//     // `this`로 Login 컴포넌트를 접근할 수 있음
+//   },
+// }
 // 로그인 처리 과정용
 // to : 이동할 url 정보가 담긴 라우터 객체
 // from : 현재 url 정보가 담긴 라우터 객체