Store_Vuex init...

This commit is contained in:
최준흠 2022-09-09 16:09:17 +09:00
parent 5fd60169bf
commit f4bc08d851
4 changed files with 63 additions and 19 deletions

View File

@ -79,21 +79,49 @@ export default {
getValidationState({ dirty, validated, valid = null }) {
return dirty || validated ? valid : null
},
onSubmit() {
this.$store
async onSubmit() {
try {
//1.
const accessToken = await this.getAccessToken()
//2. BackEnd
//console.log(accessToken)
await this.sendAccessToken(accessToken)
//3.next
const return_url = this.$route.params.return_url || 'home'
alert('로그인 성공..\n' + return_url)
this.$router.push({ name: return_url }).catch((e) => {
throw new Error(return_url + '로 Redirect 실패\n' + e.message)
})
} catch ({ message }) {
alert('로그인 실패...\n' + message)
}
},
async getAccessToken() {
return await this.$store
.dispatch('AuthStore/login', {
email: this.form.email,
password: this.form.password
})
.then((response) => {
console.log(response)
const return_url = this.$route.params.return_url || 'home'
alert('로그인 성공... -> ' + return_url)
this.$router.push({ name: return_url }).catch((e) => {
console.log(e)
})
//console.log(response)
//alert(' ..')
return response.data.access_token
})
.catch((e) => {
throw new Error('인증서버에서 인증코드 받기 실패..\n' + e.message)
})
},
async sendAccessToken(accessToken) {
return await this.$store
.dispatch('TodoStore/sendAccessToken', accessToken)
.then((response) => {
console.log(response)
alert('인증코드 전송 성공..')
return response.data
})
.catch((e) => {
throw new Error('인증코드 전송 실패..\n' + e.message)
})
.catch(({ message }) => alert('로그인 실패...:' + message))
}
}
}

View File

@ -2,18 +2,18 @@ import axios from 'axios'
import jwt from './jwt'
//참조: https://yamoo9.github.io/axios/guide/interceptors.html
const authAxios = axios.create({
const apiServer = axios.create({
baseURL: process.env.VUE_APP_AUTH_HOST,
headers: { 'content-type': 'application/json' }
})
authAxios.interceptors.request.use(
apiServer.interceptors.request.use(
(config) => jwt.getAuthorizationHeader(config),
(error) => {
// Do something with request error
Promise.reject(error)
}
)
authAxios.defaults.headers.post['Content-Type'] =
apiServer.defaults.headers.post['Content-Type'] =
'application/x-www-form-urlencoded'
// count state 속성 추가
@ -50,7 +50,7 @@ const actions = {
password: payload.password
}
return new Promise((resolve, reject) => {
authAxios
apiServer
.post('/auth/login', params)
.then((response) => {
const { data } = response
@ -79,8 +79,8 @@ const actions = {
name: payload.name
}
return new Promise((resolve, reject) => {
authAxios
.post('/user/register', params)
apiServer
.post('/auth/register', params)
.then((response) => {
const { data } = response
context.commit('login', {

View File

@ -1,5 +1,6 @@
const Payload_KEY_NAME = 'access_token'
const getToken = () => {
document.cookie.g
return window.localStorage.getItem(Payload_KEY_NAME)
}
const saveToken = (token) => {

View File

@ -2,18 +2,18 @@ import axios from 'axios'
import jwt from './jwt'
//참조: https://yamoo9.github.io/axios/guide/interceptors.html
const todoAxios = axios.create({
const apiServer = axios.create({
baseURL: process.env.VUE_APP_BACKEND_HOST,
headers: { 'content-type': 'application/json' }
})
todoAxios.interceptors.request.use(
apiServer.interceptors.request.use(
(config) => jwt.getAuthorizationHeader(config),
(error) => {
// Do something with request error
Promise.reject(error)
}
)
todoAxios.defaults.headers.post['Content-Type'] =
apiServer.defaults.headers.post['Content-Type'] =
'application/x-www-form-urlencoded'
// count state 속성 추가
@ -36,11 +36,26 @@ const mutations = {
}
}
const actions = {
sendAccessToken: function (context, accessToken) {
//주의 .get의 parameter는 { params: params} 처럼 보내야함
return new Promise((resolve, reject) => {
apiServer
.get('/todo/accessToken', { params: accessToken })
.then((response) => {
const { data } = response
context.commit('setData', data)
resolve(response)
})
.catch((error) => {
reject(error)
})
})
},
setData: function (context, params) {
console.log(params)
//주의 .get의 parameter는 { params: params} 처럼 보내야함
return new Promise((resolve, reject) => {
todoAxios
apiServer
.get('/todo', { params: params })
.then((response) => {
const { data } = response