From 5b97cbab95c61afef4bb3bf38c937d7f5d5ddbb5 Mon Sep 17 00:00:00 2001 From: Avris Date: Thu, 15 Oct 2020 19:23:53 +0200 Subject: [PATCH] #54 user accounts - use cookies, not localStorage (for SSR) --- nuxt.config.js | 3 ++- package.json | 1 + plugins/auth.js | 13 ++++++------- routes/user.vue | 2 ++ src/helpers.js | 24 ------------------------ store/index.js | 19 ++++++++++--------- yarn.lock | 26 ++++++++++++++++++++++++++ 7 files changed, 47 insertions(+), 41 deletions(-) diff --git a/nuxt.config.js b/nuxt.config.js index cb631f9d..00b37726 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -53,7 +53,8 @@ export default { '@nuxtjs/axios', ['@nuxtjs/redirect-module', { rules: config.redirects, - }] + }], + 'cookie-universal-nuxt', ], pwa: { manifest: { diff --git a/package.json b/package.json index bfa7cb69..07b4d7fc 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,7 @@ "@nuxtjs/redirect-module": "^0.3.1", "body-parser": "^1.19.0", "canvas": "^2.6.1", + "cookie-universal-nuxt": "^2.1.4", "dotenv": "^8.2.0", "jsonwebtoken": "^8.5.1", "mailer": "^0.6.7", diff --git a/plugins/auth.js b/plugins/auth.js index 4ee62f49..952e8de0 100644 --- a/plugins/auth.js +++ b/plugins/auth.js @@ -1,10 +1,9 @@ -import { Session } from "../src/helpers"; - -export default ({store}) => { - if (Session.isAvailable()) { - const token = Session.get('token'); - if (token) { - store.commit('setToken', token); +export default ({app, store}) => { + const token = app.$cookies.get('token'); + if (token) { + store.commit('setToken', token); + if (!store.state.token) { + app.$cookies.removeAll(); } } } diff --git a/routes/user.vue b/routes/user.vue index 68881eea..8c66a109 100644 --- a/routes/user.vue +++ b/routes/user.vue @@ -83,6 +83,7 @@ } this.$store.commit('setToken', this.token); + this.$cookies.set('token', this.$store.state.token); return jwt.verify(this.token, process.env.PUBLIC_KEY, { algorithm: 'RS256', @@ -124,6 +125,7 @@ logout() { this.token = null; this.$store.commit('setToken', null); + this.$cookies.removeAll(); } }, head() { diff --git a/src/helpers.js b/src/helpers.js index bbe83e36..f76d49d6 100644 --- a/src/helpers.js +++ b/src/helpers.js @@ -72,27 +72,3 @@ export const makeId = (length, characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghi return result; } - -export class Session { - static isAvailable() { - return typeof localStorage !== 'undefined'; - } - - static set(key, value) { - localStorage.setItem(key, JSON.stringify(value)); - } - - static get(key) { - const value = localStorage.getItem(key); - - return key === null ? null : JSON.parse(value); - } - - static has(key) { - return localStorage.getItem(key) !== null; - } - - static remove(key) { - localStorage.removeItem(key); - } -} diff --git a/store/index.js b/store/index.js index 34db025c..3ba66f36 100644 --- a/store/index.js +++ b/store/index.js @@ -1,5 +1,4 @@ import jwt from 'jsonwebtoken'; -import { Session } from '../src/helpers'; export const state = () => ({ token: null, @@ -11,25 +10,27 @@ export const mutations = { if (!token) { state.token = null; state.user = null; - Session.remove('token'); return; } - const user = jwt.verify(token, process.env.PUBLIC_KEY, { - algorithm: 'RS256', - audience: process.env.BASE_URL, - issuer: process.env.BASE_URL, - }); + let user; + try { + user = jwt.verify(token, process.env.PUBLIC_KEY, { + algorithm: 'RS256', + audience: process.env.BASE_URL, + issuer: process.env.BASE_URL, + }); + } catch { + user = null; + } if (user && user.authenticated) { state.token = token; state.user = user; - Session.set('token', token); return; } state.token = null; state.user = null; - Session.remove('token'); } } diff --git a/yarn.lock b/yarn.lock index 42abdc28..ccbe2b16 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1198,6 +1198,11 @@ resolved "https://registry.yarnpkg.com/@types/color-name/-/color-name-1.1.1.tgz#1c1261bbeaa10a8055bbc5d8ab84b7b2afc846a0" integrity sha512-rr+OQyAjxze7GgWrSaJwydHStIhHq2lvY3BOC2Mj7KnzI7XK0Uw1TOOdI9lDoajEbSWLiYgoo4f1R51erQfhPQ== +"@types/cookie@^0.3.3": + version "0.3.3" + resolved "https://registry.yarnpkg.com/@types/cookie/-/cookie-0.3.3.tgz#85bc74ba782fb7aa3a514d11767832b0e3bc6803" + integrity sha512-LKVP3cgXBT9RYj+t+9FDKwS5tdI+rPBXaNSkma7hvqy35lc7mAokC2zsqWJH0LaqIt3B962nuYI77hsJoT1gow== + "@types/html-minifier-terser@^5.0.0": version "5.1.0" resolved "https://registry.yarnpkg.com/@types/html-minifier-terser/-/html-minifier-terser-5.1.0.tgz#551a4589b6ee2cc9c1dff08056128aec29b94880" @@ -2622,6 +2627,22 @@ cookie-signature@1.0.6: resolved "https://registry.yarnpkg.com/cookie-signature/-/cookie-signature-1.0.6.tgz#e303a882b342cc3ee8ca513a79999734dab3ae2c" integrity sha1-4wOogrNCzD7oylE6eZmXNNqzriw= +cookie-universal-nuxt@^2.1.4: + version "2.1.4" + resolved "https://registry.yarnpkg.com/cookie-universal-nuxt/-/cookie-universal-nuxt-2.1.4.tgz#323f8645501f88cb2422127ad8ba2ee40187b716" + integrity sha512-xbn4Ozs9S0u2+0mQTZRwGlBL9MGNq8N4H6iGfprR5ufZFCS2hGef++3DBHSmHXZi30Wu3Q7RI/GkNMhz3cecmg== + dependencies: + "@types/cookie" "^0.3.3" + cookie-universal "^2.1.4" + +cookie-universal@^2.1.4: + version "2.1.4" + resolved "https://registry.yarnpkg.com/cookie-universal/-/cookie-universal-2.1.4.tgz#826a273da7eb9b08bfb0139bae12ea70770d564b" + integrity sha512-dwWXs7NGBzaBYDypu3jWH5M3NJW+zu5QdyJkFMHJvhLuyL4/eXG4105fwtTDwfIqyTunwVvQX4PHdtfPDS7URQ== + dependencies: + "@types/cookie" "^0.3.3" + cookie "^0.4.0" + cookie@0.4.0: version "0.4.0" resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.4.0.tgz#beb437e7022b3b6d49019d088665303ebe9c14ba" @@ -2632,6 +2653,11 @@ cookie@^0.3.1: resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.3.1.tgz#e7e0a1f9ef43b4c8ba925c5c5a96e806d16873bb" integrity sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s= +cookie@^0.4.0: + version "0.4.1" + resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.4.1.tgz#afd713fe26ebd21ba95ceb61f9a8116e50a537d1" + integrity sha512-ZwrFkGJxUR3EIoXtO+yVE69Eb7KlixbaeAWfBQB9vVsNn/o+Yw69gBWSSDK825hQNdN+wF8zELf3dFNl/kxkUA== + copy-concurrently@^1.0.0: version "1.0.5" resolved "https://registry.yarnpkg.com/copy-concurrently/-/copy-concurrently-1.0.5.tgz#92297398cae34937fcafd6ec8139c18051f0b5e0"