I've built an Express app that contains an API and a front end. By using Axios the front end can request data (e.g. a user-object or a todo-object) from the API, which will validate the offered JWT with its middleware. If the jwt.verify() errs, the protected routes won't fire. This all works fine.
My question is: how do I set up the front end such that any page-request will redirect to a login page if the browser-stored JWT is not valid (excluding the login and register pages, to prevent circular redirection)? Do I have to preface every .ejs-file with an Axios.post() that sends the browser-stored JWT for verification, or is there a best practice that I am missing?
My goal, when an invalid JWT is offered, is to have the API routes return a json-object (e.g. { err: "invalid token offered" }), and to have all the front end routes redirect the user to the login page.
Some sample code below.
server.js
// API Routes
app.use('/api/todos', CheckToken, APITodosRouter)
app.use('/api/auth', APIAuthRouter)
// Front-end Routes
app.use('/', indexRouter)
app.use('/todos', todosRouter)
app.use('/auth', authRouter)
todos.ejs (This works fine)
// get todos from db
let todosData
const getTodos = async () => {
let response = await axios.get('/api/todos/all', {
headers: {
'Content-Type': 'application/json',
'authorization': `Bearer ${localStorage.access_token}`
}
})
if (!response) return console.log({ msg: "no response received."})
if (!response.data) return console.log({ msg: "no data received."})
if (!response.data.payload) return console.log({ msg: "no todos found."})
todosData = response.data.payload
}
// boot page
;(async () => {
await getTodos()
renderTodos() // a function that reads todosData updates the DOM accordingly
})()
checkToken.js (Middleware)
const jwt = require('jsonwebtoken')
const checkToken = (req, res, next) => {
const ah = req.headers.authorization
const token = ah && ah.split(' ')[1]
if (!token) return res.json({ msg: "No token offered."})
jwt.verify(token, process.env.TOKEN_SECRET, (err, user) => {
if (err) return res.json({ msg: "Invalid token offered."})
req.user = user
next()
})
}
module.exports = checkToken