728x90
반응형
- [ 언어·프레임워크/Vue.js ][Vue.js] Axios interceptors 관련, 로그인 후 API호출 시 JWT 토큰이 header에 실리지 않는 문제2023-02-02 09:36:48Axios로 REST API를 연동하고 있다. 로그인 후 새로운 토큰을 받았지만 API호출 시 해당 토큰이 header에 실리지 않아 [그림 1]과 같이 401 에러와 함께 로그인 화면으로 리다이렉션 되어 버렸다. 기존에 interceptors에 response 코드만 적용했었던 것이 문제였다. 따라서 request 할 때 토큰을 실어 보내는 아래의 코드를 추가하여 문제를 해결할 수 있었다. instance.interceptors.request.use( function (config) { console.log('config : ', config) config.headers.Authorization = `Bearer ${localStorage.getItem('jwt')}` return config }, f..
- [ 영광의 시대!/2022 개발자의 품격 부트캠프 1기 ][개발자의품격][부트캠프][1기][24차시] Vue.js #17 | 로그인 기능(vuex-persistedstate, vue-cookies 등 사용)2022-03-20 20:51:42로그인 기능 src/views/LoginView.vue 컴포넌트를 생성한 후 src/router/index.js에 경로 설정을 한다. vuex 관련 코드는 일단 주석 처리한다. // src/router/index.js ... import LoginView from '../views/LoginView.vue' // import store from '../store' ... const routes = [ ... { path: '/login', name: 'LoginView', component: LoginView }, ... // router.beforeEach((to, from, next) => { // if (to.path === '/') { // next() // } else if (to.path ==..
728x90
반응형