From 32fef52f9eb1b4da2f19b5853cf5234c9db78d3d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E1=84=8B=E1=85=B5=E1=84=8C=E1=85=B5=E1=86=AB=E1=84=89?=
 =?UTF-8?q?=E1=85=A5=E1=86=A8?= <leejinseok@wemakeprice.com>
Date: Tue, 4 Feb 2020 15:31:40 +0900
Subject: [PATCH] update

---
 src/front/src/api/articleApi.js             | 128 +++++++++-----------
 src/front/src/api/authApi.js                |  72 ++++++-----
 src/front/src/middlewares/authentication.js |   1 -
 src/front/src/pages/Welcome.vue             |  19 ++-
 src/front/src/pages/articles/List.vue       |  18 +++
 src/front/src/pages/auth/Login.vue          |  11 +-
 6 files changed, 136 insertions(+), 113 deletions(-)

diff --git a/src/front/src/api/articleApi.js b/src/front/src/api/articleApi.js
index ee4ec24..be0031f 100644
--- a/src/front/src/api/articleApi.js
+++ b/src/front/src/api/articleApi.js
@@ -1,74 +1,64 @@
 import axios from 'axios';
 import commonUtil from "../utils/commonUtil";
 
-function getArticles({page = 0, size = 10, q = ''}) {
-
-  return axios({
-    url: '/api/articles',
-    headers: {
-      'Authorization': commonUtil.getAuthenticationHeaderBearer.bind(this)()
-    },
-    params: {
-      page,
-      size,
-      q
-    }
-  });
-}
-
-function getArticle(id) {
-  return axios({
-    url: '/api/articles/' + id,
-    headers: {
-      'Authorization': commonUtil.getAuthenticationHeaderBearer.bind(this)()
-    }
-  });
-}
-
-function postArticle({title = '', content = ''}) {
-
-  return axios({
-    url: '/api/articles',
-    method: 'post',
-    headers: {
-      'Authorization': commonUtil.getAuthenticationHeaderBearer.bind(this)()
-    },
-    data: {
-      title,
-      content
-    }
-  });
-}
-
-function updateArticle(id, {title = '', content = ''}) {
-  return axios({
-    url: '/api/articles/' + id,
-    method: 'put',
-    headers: {
-      'Authorization': commonUtil.getAuthenticationHeaderBearer.bind(this)()
-    },
-    data: {
-      title,
-      content
-    }
-  });
-}
-
-function removeArticle(id) {
-
-  return axios({
-    url: '/api/articles/' + id,
-    headers: {
-      'Authorization': commonUtil.getAuthenticationHeaderBearer.bind(this)()
-    },
-    method: 'delete'
-  });
-}
-
 export default {
-  getArticles,
-  getArticle,
-  postArticle,
-  updateArticle,
-  removeArticle
+  getArticles({page = 0, size = 10, q = ''}) {
+
+    return axios({
+      url: '/api/articles',
+      headers: {
+        'Authorization': commonUtil.getAuthenticationHeaderBearer.bind(this)()
+      },
+      params: {
+        page,
+        size,
+        q
+      }
+    });
+  },
+  getArticle(id) {
+    return axios({
+      url: '/api/articles/' + id,
+      headers: {
+        'Authorization': commonUtil.getAuthenticationHeaderBearer.bind(this)()
+      }
+    });
+  },
+  postArticle({title = '', content = ''}) {
+
+    return axios({
+      url: '/api/articles',
+      method: 'post',
+      headers: {
+        'Authorization': commonUtil.getAuthenticationHeaderBearer.bind(this)()
+      },
+      data: {
+        title,
+        content
+      }
+    });
+  },
+  updateArticle(id, {title = '', content = ''}) {
+    return axios({
+      url: '/api/articles/' + id,
+      method: 'put',
+      headers: {
+        'Authorization': commonUtil.getAuthenticationHeaderBearer.bind(this)()
+      },
+      data: {
+        title,
+        content
+      }
+    });
+  },
+  removeArticle(id) {
+
+    return axios({
+      url: '/api/articles/' + id,
+      headers: {
+        'Authorization': commonUtil.getAuthenticationHeaderBearer.bind(this)()
+      },
+      method: 'delete'
+    });
+  }
 }
\ No newline at end of file
diff --git a/src/front/src/api/authApi.js b/src/front/src/api/authApi.js
index 8c2abdc..b8215da 100644
--- a/src/front/src/api/authApi.js
+++ b/src/front/src/api/authApi.js
@@ -1,42 +1,40 @@
 import axios from "axios";
 
-function login(data) {
-  const { email, password } = data;
-  return axios({
-    method: 'post',
-    url: '/api/auth/login',
-    data: {
-      email,
-      password
-    }
-  });
-}
-
-function register(data) {
-  const { email, name, password } = data;
-  return axios({
-    method: 'post',
-    url: '/api/auth/register',
-    data: {
-      email,
-      name,
-      password
-    }
-  });
-}
-
-function session(token) {
-  return axios({
-    method: 'get',
-    url: '/api/users',
-    headers: {
-      'Authorization': 'Bearer ' + token
-    }
-  });
-}
 
 export default {
-  login,
-  session,
-  register
+  login(data) {
+    const { email, password } = data;
+    return axios({
+      method: 'post',
+      url: '/api/auth/login',
+      data: {
+        email,
+        password
+      }
+    });
+  },
+  session(token) {
+    return axios({
+      method: 'get',
+      url: '/api/users',
+      headers: {
+        'Authorization': 'Bearer ' + token
+      }
+    });
+  },
+  register(data) {
+    const { email, name, password } = data;
+    return axios({
+      method: 'post',
+      url: '/api/auth/register',
+      data: {
+        email,
+        name,
+        password
+      }
+    });
+  },
+  logout() {
+    this.$cookie.set('accessToken', null, 0);
+  }
 }
\ No newline at end of file
diff --git a/src/front/src/middlewares/authentication.js b/src/front/src/middlewares/authentication.js
index 8bf8c4d..f478283 100644
--- a/src/front/src/middlewares/authentication.js
+++ b/src/front/src/middlewares/authentication.js
@@ -8,5 +8,4 @@ export default async function () {
       'Authorization': 'Bearer ' + this.$cookie.get('accessToken')
     }
   });
-
 }
\ No newline at end of file
diff --git a/src/front/src/pages/Welcome.vue b/src/front/src/pages/Welcome.vue
index 835f828..5059387 100644
--- a/src/front/src/pages/Welcome.vue
+++ b/src/front/src/pages/Welcome.vue
@@ -1,15 +1,24 @@
 <template>
    <div>
-       home
-       <router-link to="/auth/login">로그인</router-link>
-       <router-link to="/auth/register">회원가입</router-link>
-       <router-link to="/articles">게시글</router-link>
+       <router-link to="/auth/login">로그인</router-link> <br>
+       <router-link to="/auth/register">회원가입</router-link> <br>
    </div>
 </template>
 
 <script>
+    import authApi from "../api/authApi";
+
     export default {
-        name: "Welcome"
+        name: "Welcome",
+      async beforeCreate() {
+        const accessToken = this.$cookie.get('accessToken');
+        try {
+          await authApi.session.bind(this)(accessToken);
+          await this.$router.replace('/articles');
+        } catch (e) {
+          console.log(e);
+        }
+      }
     }
 </script>
 
diff --git a/src/front/src/pages/articles/List.vue b/src/front/src/pages/articles/List.vue
index c35a90f..861f980 100644
--- a/src/front/src/pages/articles/List.vue
+++ b/src/front/src/pages/articles/List.vue
@@ -9,12 +9,17 @@
         <div>
             <router-link to="/articles/write">글쓰기</router-link>
         </div>
+
+        <div>
+            <button type="button" @click="logout">로그아웃</button>
+        </div>
     </div>
 </template>
 
 <script>
     import articleApi from "../../api/articleApi";
     import authentication from "../../middlewares/authentication";
+    import authApi from "../../api/authApi";
 
     export default {
         name: "List",
@@ -41,6 +46,19 @@
             alert('문제가 발생하였습니다.');
             console.log(err.response);
           }
+        },
+        methods: {
+          async logout() {
+            if (!confirm('정말 로그아웃 하시겠습니까?')) return;
+
+            try {
+              await authApi.logout.bind(this)();
+              await this.$router.push('/');
+            } catch (e) {
+                console.log(e);
+            }
+
+          }
         }
     }
 </script>
diff --git a/src/front/src/pages/auth/Login.vue b/src/front/src/pages/auth/Login.vue
index d4ea0a6..3064c92 100644
--- a/src/front/src/pages/auth/Login.vue
+++ b/src/front/src/pages/auth/Login.vue
@@ -23,7 +23,16 @@
                 password: ''
             }
         },
-        methods: {
+      async beforeCreate() {
+          const accessToken = this.$cookie.get('accessToken');
+          try {
+            await authApi.session.bind(this)(accessToken);
+            await this.$router.replace('/articles');
+          } catch (e) {
+            console.log(e);
+          }
+      },
+      methods: {
             submit: async function(evt) {
                 evt.preventDefault();
                 const { email, password } = this;