signup 추가 및 @nuxtjs/auth 플러그인 설치

client/nuxt.config.js

@@ -47,6 +47,7 @@ export default {
     // Doc: https://axios.nuxtjs.org/usage
     '@nuxtjs/axios',
     '@nuxtjs/pwa',
+    '@nuxtjs/auth'
   ],
   /*
   ** Axios module configuration
@@ -56,6 +57,11 @@ export default {
     proxy:  true,
     baseURL: URL
   },
+
+  proxy: {
+    '/api': URL
+  },
+
   /*
   ** Build configuration
   */
@@ -65,5 +71,18 @@ export default {
     */
     extend (config, ctx) {
     }
+  },
+
+  auth: {
+    strategies: {
+      local: {
+        endpoints: {
+          login: {
+            propertyName: 'token'
+          },
+          logout: true
+        }
+      }
+    }
   }
 }

client/package-lock.json

@@ -1208,6 +1208,28 @@
         }
       }
     },
+    "@nuxtjs/auth": {
+      "version": "4.8.5",
+      "resolved": "https://registry.npmjs.org/@nuxtjs/auth/-/auth-4.8.5.tgz",
+      "integrity": "sha512-GqRKj+hrQhz1M4rjMyIiOcwJQBi79wlYshw26Uz79ASgTBupQjRFQVgB/nj6crdOGVVTZLQqOjALvdVmr9rqOg==",
+      "requires": {
+        "@nuxtjs/axios": "^5.9.0",
+        "body-parser": "^1.19.0",
+        "consola": "^2.11.2",
+        "cookie": "^0.4.0",
+        "is-https": "^1.0.0",
+        "js-cookie": "^2.2.1",
+        "lodash": "^4.17.15",
+        "nanoid": "^2.1.8"
+      },
+      "dependencies": {
+        "cookie": {
+          "version": "0.4.0",
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.0.tgz",
+          "integrity": "sha512-+Hp8fLp57wnUSt0tY0tHEXh4voZRDnoIrZPqlo3DPiI4y9lwg/jqx+1Om94/W6ZaPDOUbnjOt/99w66zk+l1Xg=="
+        }
+      }
+    },
     "@nuxtjs/axios": {
       "version": "5.9.0",
       "resolved": "https://registry.npmjs.org/@nuxtjs/axios/-/axios-5.9.0.tgz",
@@ -4664,6 +4686,11 @@
         "is-extglob": "^2.1.1"
       }
     },
+    "is-https": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-https/-/is-https-1.0.0.tgz",
+      "integrity": "sha512-1adLLwZT9XEXjzhQhZxd75uxf0l+xI9uTSFaZeSESjL3E1eXSPpO+u5RcgqtzeZ1KCaNvtEwZSTO2P4U5erVqQ=="
+    },
     "is-number": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
@@ -4793,6 +4820,11 @@
       "resolved": "https://registry.npmjs.org/jimp-compact/-/jimp-compact-0.8.5.tgz",
       "integrity": "sha512-BkpiX6jZyDVLU+CleO/6yF8SFHnyZXiElPryNjZx58AK1vy+bqSFvhKeFS680TISSr8IWqHlIAwDMMA0DTQkMw=="
     },
+    "js-cookie": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-2.2.1.tgz",
+      "integrity": "sha512-HvdH2LzI/EAZcUwA8+0nKNtWHqS+ZmijLA30RwZA0bo7ToCckjK5MkGhjED9KoRcXO6BaGI3I9UIzSA1FKFPOQ=="
+    },
     "js-levenshtein": {
       "version": "1.1.6",
       "resolved": "https://registry.npmjs.org/js-levenshtein/-/js-levenshtein-1.1.6.tgz",
@@ -5280,6 +5312,11 @@
       "integrity": "sha512-INOFj37C7k3AfaNTtX8RhsTw7qRy7eLET14cROi9+5HAVbbHuIWUHEauBv5qT4Av2tWasiTY1Jw6puUNqRJXQg==",
       "optional": true
     },
+    "nanoid": {
+      "version": "2.1.8",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-2.1.8.tgz",
+      "integrity": "sha512-g1z+n5s26w0TGKh7gjn7HCqurNKMZWzH08elXzh/gM/csQHd/UqDV6uxMghQYg9IvqRPm1QpeMk50YMofHvEjQ=="
+    },
     "nanomatch": {
       "version": "1.2.13",
       "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.13.tgz",

client/package.json

@@ -11,11 +11,12 @@
     "generate": "nuxt generate"
   },
   "dependencies": {
-    "nuxt": "^2.0.0",
-    "bootstrap-vue": "^2.0.0",
-    "bootstrap": "^4.1.3",
+    "@nuxtjs/auth": "^4.8.5",
     "@nuxtjs/axios": "^5.3.6",
-    "@nuxtjs/pwa": "^3.0.0-0"
+    "@nuxtjs/pwa": "^3.0.0-0",
+    "bootstrap": "^4.1.3",
+    "bootstrap-vue": "^2.0.0",
+    "nuxt": "^2.0.0"
   },
   "devDependencies": {}
 }

client/pages/signup.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="registerPage">
     <div class="container">
-      <row>
+      <div class="row">
         <div class="col-sm-4"></div>
         <div class="col-sm-4">
           <div class="text-center">
@@ -15,6 +15,7 @@
                 <div class="a-row a-spacing-base">
                   <label for="" class="a-form-label">Ypur name</label>
                   <input
+                    v-model="name"
                     type="text"
                     id="ap_customer_name"
                     class="a-input-text form-control auth-autofocus auth-required-field auth-contract-verification-request-info"
@@ -24,6 +25,7 @@
                 <div class="a-row a-spacing-base">
                   <label for="" class="a-form-label">Ypur Email</label>
                   <input
+                    v-model="email"
                     type="text"
                     id="ap_customer_email"
                     class="a-input-text form-control auth-autofocus auth-required-field auth-contract-verification-request-info"
@@ -33,6 +35,7 @@
                 <div class="a-row a-spacing-base">
                   <label for="" class="a-form-label">Ypur Password</label>
                   <input
+                    v-model="password"
                     type="password"
                     id="ap_customer_password"
                     class="a-input-text form-control auth-autofocus auth-required-field auth-contract-verification-request-info"
@@ -45,7 +48,7 @@
                 <div class="a-row a-spacing-extra-large mb-4">
                   <span class="a-button-primary">
                     <span class="a-button-inner">
-                      <span class="a-button-text">Create your Amazon account</span>
+                      <span @click="onSignup" class="a-button-text">Create your Amazon account</span>
                     </span>
                   </span>
                   <div class="a-row a-spacing-top-medium a-size-small">
@@ -67,7 +70,7 @@
             </div>
           </div>
         </div>
-      </row>
+      </div>
     </div>
   </div>
 </template>
@@ -75,6 +78,45 @@
 
 <script>
 export default {
-  layout: 'none'
+  layout: 'none',
+
+  data () {
+    return {
+      name: '',
+      email: '',
+      password: ''
+    }
+  },
+
+  methods: {
+    async onSignup () {
+      try {
+        let  data = {
+          name: this.name,
+          email: this.email,
+          password: this.password
+        }
+
+        let response = await this.$axios.$post('/api/auth/signup', data)
+
+        console.log(response)
+
+        if (response.success) {
+          this.$auth.loginWith('local', {
+            data: {
+              email: this.email,
+              password: this.password
+            }
+          })
+
+          debugger
+
+          this.$router.push('/')
+        }
+      } catch (err) {
+        console.log(err)
+      }
+    }
+  }
 }
 </script>

server/routes/auth.js

@@ -54,6 +54,7 @@ router.get('/auth/user', virifyToken, async (req, res) => {
 router.post('/auth/login', async (req, res) => {
   try {
     let foundUser = await User.findOne({ email: req.body.email})
+    console.log(foundUser)
     if (!foundUser) {
       res.status(403).json({
         success: false,
@@ -64,7 +65,6 @@ router.post('/auth/login', async (req, res) => {
         let token = jwt.sign(foundUser.toJSON(), process.env.SECRET, {
           expiresIn: 604800
         })
-s
         res.json({ success: true, token})
       } else {
         res.status(403).json({