Add auth store

frontend/package.json

@@ -19,6 +19,7 @@
     "@toast-ui/vue-editor": "^1.1.1",
     "chart.js": "^2.8.0",
     "codemirror": "^5.48.2",
+    "js-cookie": "^2.2.1",
     "nuxt": "^2.0.0",
     "papaparse": "^5.0.2",
     "tui-editor": "^1.4.5",

frontend/store/auth.js

@@ -0,0 +1,90 @@
+import Cookie from 'js-cookie'
+
+export const state = () => ({
+  token: null
+})
+
+export const mutations = {
+  setToken(state, token) {
+    state.token = token
+  },
+  clearToken(state) {
+    state.token = null
+  }
+}
+
+export const getters = {
+  isAuthenticated(state) {
+    return state.token != null
+  }
+}
+
+export const actions = {
+  authenticateUser({ commit }, authData) {
+    let authUrl =
+      'https://www.googleapis.com/identitytoolkit/v3/relyingparty/verifyPassword?key=' +
+      process.env.fbAPIKey
+    if (!authData.isLogin) {
+      authUrl =
+        'https://www.googleapis.com/identitytoolkit/v3/relyingparty/signupNewUser?key=' +
+        process.env.fbAPIKey
+    }
+    return this.$axios
+      .$post(authUrl, {
+        email: authData.email,
+        password: authData.password,
+        returnSecureToken: true
+      })
+      .then((result) => {
+        commit('setToken', result.idToken)
+        localStorage.setItem('token', result.idToken)
+        localStorage.setItem(
+          'tokenExpiration',
+          new Date().getTime() + Number.parseInt(result.expiresIn) * 1000
+        )
+        Cookie.set('jwt', result.idToken)
+        Cookie.set(
+          'expirationDate',
+          new Date().getTime() + Number.parseInt(result.expiresIn) * 1000
+        )
+      })
+      .catch(e => alert(e))
+  },
+  initAuth({ commit, dispatch }, req) {
+    let token
+    let expirationDate
+    if (req) {
+      if (!req.headers.cookie) {
+        return
+      }
+      const jwtCookie = req.headers.cookie
+        .split(';')
+        .find(c => c.trim().startsWith('jwt='))
+      if (!jwtCookie) {
+        return
+      }
+      token = jwtCookie.split('=')[1]
+      expirationDate = req.headers.cookie
+        .split(';')
+        .find(c => c.trim().startsWith('expirationDate='))
+        .split('=')[1]
+    } else {
+      token = localStorage.getItem('token')
+      expirationDate = localStorage.getItem('tokenExpiration')
+    }
+    if (new Date().getTime() > +expirationDate || !token) {
+      dispatch('logout')
+      return
+    }
+    commit('setToken', token)
+  },
+  logout({ commit }) {
+    commit('clearToken')
+    Cookie.remove('jwt')
+    Cookie.remove('expirationDate')
+    if (process.client) {
+      localStorage.removeItem('token')
+      localStorage.removeItem('tokenExpiration')
+    }
+  }
+}

frontend/yarn.lock

@@ -5726,6 +5726,11 @@ js-beautify@^1.6.14:
     mkdirp "~0.5.1"
     nopt "~4.0.1"
 
+js-cookie@^2.2.1:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/js-cookie/-/js-cookie-2.2.1.tgz#69e106dc5d5806894562902aa5baec3744e9b2b8"
+  integrity sha512-HvdH2LzI/EAZcUwA8+0nKNtWHqS+ZmijLA30RwZA0bo7ToCckjK5MkGhjED9KoRcXO6BaGI3I9UIzSA1FKFPOQ==
+
 js-levenshtein@^1.1.3:
   version "1.1.6"
   resolved "https://registry.yarnpkg.com/js-levenshtein/-/js-levenshtein-1.1.6.tgz#c6cee58eb3550372df8deb85fad5ce66ce01d59d"