Fix dynamic route requests, add auth middleware

.dockerignore

@@ -10,3 +10,4 @@ npm-debug.log
 dev.js
 /test/
 /client/.nuxt/
+/client/dist/

.gitignore

@@ -7,3 +7,4 @@ node_modules/
 /metadata/
 /test/
 /client/.nuxt/
+/client/dist/

client/layouts/default.vue

@@ -10,6 +10,7 @@
 
 <script>
 export default {
+  middleware: 'authenticated',
   data() {
     return {
       socket: null
@@ -140,11 +141,6 @@ export default {
       this.socket.on('scan_progress', this.scanProgress)
     }
   },
-  beforeMount() {
-    if (!this.$store.state.user.user) {
-      this.$router.replace(`/login?redirect=${this.$route.path}`)
-    }
-  },
   mounted() {
     this.initializeSocket()
   }

client/middleware/authenticated.js

@@ -0,0 +1,6 @@
+export default function ({ store, redirect, route }) {
+  // If the user is not authenticated
+  if (!store.state.user.user) {
+    return redirect(`/login?redirect=${route.path}`)
+  }
+}

client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "audiobookshelf-client",
-  "version": "0.9.7-beta",
+  "version": "0.9.71-beta",
   "description": "Audiobook manager and player",
   "main": "index.js",
   "scripts": {

client/pages/login.vue

@@ -34,16 +34,11 @@ export default {
   watch: {
     user(newVal) {
       if (newVal) {
-        // if (process.env.NODE_ENV !== 'production') {
         if (this.$route.query.redirect) {
           this.$router.replace(this.$route.query.redirect)
         } else {
           this.$router.replace('/')
         }
-
-        // } else {
-        //   window.location.reload()
-        // }
       }
     }
   },
@@ -56,7 +51,7 @@ export default {
     async submitForm() {
       this.error = null
       this.processing = true
-      // var uri = `${process.env.serverUrl}/auth`
+
       var payload = {
         username: this.username,
         password: this.password || ''

client/store/audiobooks.js

@@ -39,7 +39,11 @@ export const getters = {
 }
 
 export const actions = {
-  load({ commit }) {
+  load({ commit, rootState }) {
+    if (!rootState.user || !rootState.user.user) {
+      console.error('audiobooks/load - User not set')
+      return
+    }
     this.$axios
       .$get(`/api/audiobooks`)
       .then((data) => {

client/store/user.js

@@ -48,10 +48,12 @@ export const actions = {
 export const mutations = {
   setUser(state, user) {
     state.user = user
-    if (user && user.token) {
-      localStorage.setItem('token', user.token)
-    } else if (user) {
+    if (user) {
+      if (user.token) localStorage.setItem('token', user.token)
+      console.log('setUser', user.username)
+    } else {
       localStorage.removeItem('token')
+      console.warn('setUser cleared')
     }
   },
   setSettings(state, settings) {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "audiobookshelf",
-  "version": "0.9.7-beta",
+  "version": "0.9.71-beta",
   "description": "Self-hosted audiobook server for managing and playing audiobooks.",
   "main": "index.js",
   "scripts": {

server/Auth.js

@@ -42,7 +42,7 @@ class Auth {
     const authHeader = req.headers['authorization']
     const token = authHeader && authHeader.split(' ')[1]
     if (token == null) {
-      Logger.error('Api called without a token')
+      Logger.error('Api called without a token', req.path)
       return res.sendStatus(401)
     }
 

server/Server.js

@@ -106,8 +106,8 @@ class Server {
     app.use(this.auth.cors)
 
     // Static path to generated nuxt
+    const distPath = Path.join(global.appRoot, '/client/dist')
     if (process.env.NODE_ENV === 'production') {
-      const distPath = Path.join(global.appRoot, '/client/dist')
       app.use(express.static(distPath))
       app.use('/local', express.static(this.AudiobookPath))
     } else {
@@ -119,14 +119,13 @@ class Server {
     app.use(express.urlencoded({ extended: true }));
     app.use(express.json())
 
+    // Dynamic routes are not generated on client
+    app.get('/audiobook/:id', (req, res) => res.sendFile(Path.join(distPath, 'index.html')))
+
     app.use('/api', this.authMiddleware.bind(this), this.apiController.router)
     app.use('/hls', this.authMiddleware.bind(this), this.hlsController.router)
     app.use('/feeds', this.rssFeeds.router)
 
-    app.get('/', (req, res) => {
-      res.sendFile('/index.html')
-    })
-
     app.post('/login', (req, res) => this.auth.login(req, res))
     app.post('/logout', this.logout.bind(this))
     app.get('/ping', (req, res) => {