
--- client/views/App.vue
+++ client/views/App.vue
... | ... | @@ -18,7 +18,45 @@ |
18 | 18 |
Header: Header, |
19 | 19 |
Footer: Footer, |
20 | 20 |
}, |
21 |
+ async mounted() { |
|
22 |
+ // Access Token이 없거나 만료된 경우 새로 발급 요청 |
|
23 |
+ const token = this.$store.state.authorization; // Vuex 스토어에서 직접 가져오기 |
|
24 |
+ if (!token) { |
|
25 |
+ await this.refreshToken(); |
|
26 |
+ } |
|
27 |
+ }, |
|
21 | 28 |
methods: { |
29 |
+ async refreshToken() { |
|
30 |
+ try { |
|
31 |
+ const res = await apiClient.post("/refresh/tknReissue.json", {}, { |
|
32 |
+ headers: { |
|
33 |
+ "Content-Type": "application/json; charset=UTF-8", |
|
34 |
+ }, |
|
35 |
+ }); |
|
36 |
+ |
|
37 |
+ if (res.status === 200) { |
|
38 |
+ // 새로 발급 받은 AccessToken 저장 |
|
39 |
+ store.commit('setAuthorization', res.headers.authorization); |
|
40 |
+ // JWT 토큰 디코딩 |
|
41 |
+ const base64String = res.headers.authorization.split('.')[1]; |
|
42 |
+ const base64 = base64String.replace(/-/g, '+').replace(/_/g, '/'); |
|
43 |
+ const jsonPayload = decodeURIComponent(atob(base64).split('').map(c => { |
|
44 |
+ return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2); |
|
45 |
+ }).join('')); |
|
46 |
+ const mbr = JSON.parse(jsonPayload); |
|
47 |
+ store.commit("setUserNm", mbr.userNm); // 사용자 이름 저장 |
|
48 |
+ store.commit('setRoles', mbr.roles); // 사용자 역할 저장 |
|
49 |
+ } else { |
|
50 |
+ alert('토큰 재발급 요청 실패'); |
|
51 |
+ this.$router.push('/login.page'); |
|
52 |
+ } |
|
53 |
+ } catch (error) { |
|
54 |
+ console.error("Refresh token error:", error); |
|
55 |
+ alert('세션이 종료되었습니다.\n로그인을 새로 해주세요.'); |
|
56 |
+ store.commit("setStoreReset"); |
|
57 |
+ this.$router.push('/login.page'); // 로그인 페이지로 리다이렉트 |
|
58 |
+ } |
|
59 |
+ }, |
|
22 | 60 |
scrollToTop() { |
23 | 61 |
window.scrollTo({ |
24 | 62 |
top: 0, |
Add a comment
Delete comment
Once you delete this comment, you won't be able to recover it. Are you sure you want to delete this comment?