sending json web token using ajax to Node API - node.js

Question

I'm trying to do an authorisation middleware using jsonwebtoken, cookie-parser to set cookies and jQuery in the client.
For that I'm using a middleware to check authorisations.
here is the middleware
const jwt = require('jsonwebtoken')
module.exports = (req,res,next)=> {
try{
const token = req.headers.authorization.split("=")[1];
const decodedToken = jwt.verify(token, process.env.JWT_KEY)
req.userData = decodedToken;
next();
} catch(error){
return res.status(401).json({
message: "Auth failed"
})
}
}
In my API I'm creating and sending the token like this:
const token = jwt.sign({
email: user[0].email,
userId: user[0]._id
},
process.env.JWT_KEY, {
expiresIn: "1h"
}
)
res.cookie('userToken', token)
res.render('index', {
movies: {}, token:token
});
In the client I'm sending back to the server like this:
var userToken = document.cookie;
// console.log(userToken)
$.ajax({
url: "/movies/add",
type: "GET",
beforeSend: function (xhr, settings) {
console.log(xhr)
xhr.setRequestHeader('Authorization', 'Bearer ' + userToken);
}
});
The movies/add route is receiving the request, because it's printing 'it entered', but it's not redirecting to movies/addMovies. What am I missing?
router.get('/add', checkAuth, function (req, res, next) {
console.log('it entered')
res.render('movies/addMovies', {
movies: {}
})
});

Answer 1

You're requesting the "page" via an AJAX call and returning the HTML (res.render) to the JavaScript.
If you're wanting to navigate to the other screen, you should either use a hyperlink or redirect using JavaScript (location.href).

Answer 2

I've changed to this:
$.ajax({
url: "/movies/add",
type: "GET",
data:{
'userToken':userToken
},
success: function(){
console.log('sim')
window.location.href = "/movies/add";
}
});
and in the server
const token = req.cookies.userToken
const decodedToken = jwt.verify(token, process.env.JWT_KEY)
and now it works