Vue2_Frontend 수정1...
This commit is contained in:
parent
64838d5e1f
commit
989e56fbce
2
.env
2
.env
@ -10,4 +10,4 @@ VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin="*"
|
||||
|
||||
#LocalStorage는 Edge 브라우저의 개발툴 > 응용프로그램 > 로컬 저장소에서 확인가능
|
||||
VUE_APP_LOCALSTORAGE_NAME="access_token"
|
||||
|
||||
VUE_APP_SESSIONSTORAGE_REDIRECT_NAME = "RedirectPATH"
|
||||
|
||||
@ -82,43 +82,51 @@ export default {
|
||||
return dirty || validated ? valid : null
|
||||
},
|
||||
async onSubmit() {
|
||||
const result = await this.callAPI(
|
||||
'/auth/login',
|
||||
JSON.stringify({
|
||||
email: this.form.email,
|
||||
password: this.form.password
|
||||
})
|
||||
)
|
||||
if (result.access_token) {
|
||||
// localStorage를 사용하면, 브라우저에 key-value 값을 Storage에 저장할 수 있습니다
|
||||
localStorage.setItem(process.env.VUE_APP_LOCALSTORAGE_NAME, result)
|
||||
alert('로그인 성공...')
|
||||
console.log(this.$router)
|
||||
//this.$router.push(this.$router.path)
|
||||
} else {
|
||||
const result = await this.callAPI('/auth/login', {
|
||||
email: this.form.email,
|
||||
password: this.form.password
|
||||
})
|
||||
console.log(result)
|
||||
if (!result) {
|
||||
console.log(result)
|
||||
localStorage.removeItem(process.env.VUE_APP_LOCALSTORAGE_NAME)
|
||||
alert('로그인 실패...')
|
||||
this.$router.back()
|
||||
//this.$router.back()
|
||||
} else {
|
||||
// localStorage를 사용하면, 브라우저에 key-value 값을 Storage에 저장할 수 있습니다
|
||||
localStorage.setItem(process.env.VUE_APP_LOCALSTORAGE_NAME, result)
|
||||
alert('로그인 성공...')
|
||||
//저장된 redirect path를 이용 이동시킴
|
||||
this.$router.replace(
|
||||
sessionStorage.getItem(
|
||||
process.env.VUE_APP_SESSIONSTORAGE_REDIRECT_NAME
|
||||
)
|
||||
) || '/'
|
||||
//저장된 정보 CLear
|
||||
this.onReset()
|
||||
}
|
||||
},
|
||||
onReset() {
|
||||
// Reset our form values
|
||||
this.form.email = ''
|
||||
this.form.pasword = ''
|
||||
//저장된 redirect path Clear
|
||||
sessionStorage.removeItem(
|
||||
process.env.VUE_APP_SESSIONSTORAGE_REDIRECT_NAME
|
||||
)
|
||||
// Trick to reset/clear native browser form validation state
|
||||
this.$nextTick(() => {
|
||||
this.$refs.observer.reset()
|
||||
})
|
||||
// this.$nextTick(() => {
|
||||
// this.$refs.observer.reset()
|
||||
// })
|
||||
},
|
||||
async callAPI(url, params) {
|
||||
console.log('CallAPI..', [url, params])
|
||||
axios.defaults.baseURL = process.env.VUE_APP_BACKEND_HOST
|
||||
//전송 Header에 CORP정보 추가
|
||||
// axios.defaults.headers.post['Content-Type'] =
|
||||
// process.env.VUE_APP_BACKEND_HEADERS_Content_Type
|
||||
// axios.defaults.headers.post['Access-Control-Allow-Origin'] =
|
||||
// process.env.VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin
|
||||
axios.defaults.headers.post['Content-Type'] =
|
||||
process.env.VUE_APP_BACKEND_HEADERS_Content_Type
|
||||
axios.defaults.headers.post['Access-Control-Allow-Origin'] =
|
||||
process.env.VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin
|
||||
return await axios
|
||||
.post(url, params)
|
||||
.then((response) => {
|
||||
|
||||
@ -141,10 +141,10 @@ export default {
|
||||
console.log('CallAPI..', [url, params])
|
||||
axios.defaults.baseURL = process.env.VUE_APP_BACKEND_HOST
|
||||
//전송 Header에 CORP정보 추가
|
||||
// axios.defaults.headers.post['Content-Type'] =
|
||||
// process.env.VUE_APP_BACKEND_HEADERS_Content_Type
|
||||
// axios.defaults.headers.post['Access-Control-Allow-Origin'] =
|
||||
// process.env.VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin
|
||||
axios.defaults.headers.post['Content-Type'] =
|
||||
process.env.VUE_APP_BACKEND_HEADERS_Content_Type
|
||||
axios.defaults.headers.post['Access-Control-Allow-Origin'] =
|
||||
process.env.VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin
|
||||
//전송 Header에 인증키 추가
|
||||
const headers = {
|
||||
// Authorization:
|
||||
|
||||
@ -54,6 +54,7 @@
|
||||
:sort-by.sync="sortBy"
|
||||
:sort-desc.sync="sortDesc"
|
||||
:sort-direction="sortDirection"
|
||||
@sort-changed="sortClick"
|
||||
label-sort-asc=""
|
||||
label-sort-desc=""
|
||||
label-sort-clear=""
|
||||
@ -65,6 +66,7 @@
|
||||
:no-border-collapse="commonTableAttributes.noBorderCollapse"
|
||||
:striped="commonTableAttributes.striped"
|
||||
:hover="commonTableAttributes.hover"
|
||||
:no-local-sorting="commonTableAttributes.noLocalSorting"
|
||||
:bordered="commonTableAttributes.bordered"
|
||||
:dark="commonTableAttributes.dark"
|
||||
:head-variant="commonTableAttributes.headVariant"
|
||||
@ -86,7 +88,7 @@
|
||||
</template>
|
||||
<!-- 제목부분 출력용 -->
|
||||
<template #cell(title)="row">
|
||||
{{ row.item.title }}
|
||||
{{ row.item.title }}[{{ row.item.id }}]
|
||||
</template>
|
||||
<!-- 상세 내용 출력용 -->
|
||||
<template #cell(content)="row">
|
||||
@ -203,6 +205,7 @@ export default {
|
||||
//noBorderCollapse: false,
|
||||
striped: true,
|
||||
hover: true,
|
||||
noLocalSorting: true,
|
||||
bordered: true,
|
||||
dark: false,
|
||||
headVariant: 'light'
|
||||
@ -237,7 +240,7 @@ export default {
|
||||
const results = await this.callAPI('/todo', {
|
||||
params: {
|
||||
sortBy: this.sortBy,
|
||||
sortDirection: this.sortDirection,
|
||||
sortDesc: this.sortDesc,
|
||||
searchFields: this.searchFields,
|
||||
search: this.search,
|
||||
page: page,
|
||||
@ -249,6 +252,8 @@ export default {
|
||||
this.total = results.total
|
||||
this.perPage = results.perPage
|
||||
this.currentPage = results.page
|
||||
this.sortBy = results.sortBy
|
||||
this.sortDesc = results.sortDesc === 'true' ? true : false
|
||||
this.rows = results.rows
|
||||
this.isBusy = false
|
||||
},
|
||||
@ -265,6 +270,12 @@ export default {
|
||||
console.log(this.perPage)
|
||||
this.getDatas()
|
||||
},
|
||||
sortClick(event) {
|
||||
console.log(event)
|
||||
this.sortBy = event.sortBy
|
||||
this.sortDesc = event.sortDesc
|
||||
this.getDatas()
|
||||
},
|
||||
busyToggle() {
|
||||
this.isBusy = !this.isBusy
|
||||
},
|
||||
@ -291,10 +302,10 @@ export default {
|
||||
async callAPI(url, params) {
|
||||
console.log('CallAPI..', [url, params])
|
||||
axios.defaults.baseURL = process.env.VUE_APP_BACKEND_HOST
|
||||
// axios.defaults.headers.post['Content-Type'] =
|
||||
// process.env.VUE_APP_BACKEND_HEADERS_Content_Type
|
||||
// axios.defaults.headers.post['Access-Control-Allow-Origin'] =
|
||||
// process.env.VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin
|
||||
axios.defaults.headers.post['Content-Type'] =
|
||||
process.env.VUE_APP_BACKEND_HEADERS_Content_Type
|
||||
axios.defaults.headers.post['Access-Control-Allow-Origin'] =
|
||||
process.env.VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin
|
||||
return await axios
|
||||
.get(url, params)
|
||||
.then((response) => {
|
||||
|
||||
@ -58,6 +58,11 @@ router.beforeEach((to, from, next) => {
|
||||
//localStorage에 Access-Token이 없으면 Login페이지로 전송
|
||||
if (!localStorage.getItem(process.env.VUE_APP_LOCALSTORAGE_NAME)) {
|
||||
console.log(from.path + ' => 인증않됨 => Login 페이지 이동')
|
||||
//다음 이동할 URL 저장
|
||||
sessionStorage.setItem(
|
||||
process.env.VUE_APP_SESSIONSTORAGE_REDIRECT_NAME,
|
||||
to.path
|
||||
)
|
||||
next({ name: 'login' })
|
||||
}
|
||||
console.log(from.path + ' => 인증 통과 => ' + to.path)
|
||||
|
||||
Loading…
Reference in New Issue
Block a user