We Keep Coding

Nodejs Ajax - redirect to the login page

I'm trying to solve this problem. I use Node Express and jQuery.
The user has been logged out (from another page of the site), but is trying to send an ajax request. How to redirect it to the login page?
I can throw an error like so:
if (!req.isAuthenticated()) {
return res.json(function() {});
}
and after on the client side:
$.ajax({
type: 'GET',
...
error: function() {
document.location.href = '/logout';
}
})
But can it be done in some other way?
For example, if you do not use Ajax, then I do this:
if (!req.isAuthenticated()) {
return redirect('/login');
}
Something similar but with Ajax?

Since you mentioned you use Express, you can call the redirect function on the response:
if (!req.isAuthenticated()) {
res.redirect("/login");
}

Axios POST request sends data to Express server but Error 404

Axios POST request sends data to Express sever but Error 404
Hello, world, I am trying to build a user authentication server for a project I am working on, but I am running into a problem trying to send a POST request to my Node.js Express server.
I want to send a POST request using Axios containing a username and password from the browser. But once sending the request it gives me a 404 Not Found error. The request has to go to http://website/api/login and my Node.js code should return either "authed" or "invalid". I tested the API inside Postman and that seems to be working. I also exported the request code from Postman and tested it with fetch API, xhr, and Axios, all returning the same result.
The server receives the data and handles it properly, but when I look in the Chromium debugger it appears that the request URL is just http://website/ and not http://website/api/login. I am honestly lost and I have tried what feels like everything, but I can't seem to make it work. Any help in pointing me in the right direction would be amazing! Thank you!
The code I use for the POST request is:
const username = document.getElementById("username").value;
const password = document.getElementById("password").value;
const data = JSON.stringify({"username": username, "password":password});
const config = {
method: 'post',
url: 'http://website/api/login',
headers: {
'Content-Type': 'application/json'
},
data : data
};
axios(config).then(function (response) {
console.log(JSON.stringify(response.data));
}).catch(function (err) {
console.log(err);
})
}
This is what I see in the Chromium debugger:
Headers
This is my Node.js / Express code:
app.post('/api/login', function (req, res, next) {
scriptFile.authUser(req.body, function (err, state) {
if (err) console.log(err);
else {
if (state) {
res.send("authed");
} else {
res.send("invalid");
}
}
});
})
Thank you for any help I can get.

I am stupid,
Breakdown of what happened:
Everything was working fine except that I put the input data and submit button inside a form, which will refresh the page...
I fixed it by changing the form to a div.

Hey checking your chrome console pic looks like your post request is hitting the root api address 'http://website/' and not the full path 'http://website/api/login

Using WebSocket to reconnect to server

I have an experimental task implemented in javascript that posts its data to the server via an ajax POST request. This POST request is mandatory for compatability with other tools.
Saving data works fine when the task is finished quickly but over a certain time the server times out and when the tasks tries the POST request, I get a 400 error and nothing gets saved.
My question is can I combine this with a WebSocket and use it to reconnect to the server occasionally and still post my data with an ajax POST request? If so, how do I do this?
This is what my POST function looks like:
$.ajax({
type: 'POST',
url: '/save',
data: {'data': JSON.stringify(mainData)},
success: function() {
console.log('success');
document.location = '/next'
},
// Endpoint not running, local save
error: function(err) {
if (err.status == 200) {
document.location = '/next'
}
}
});
Optimally I would like to have something like this
if (err.status == 200) {
document.location = '/next'
} else if (err.status == 400) {
// RECONNECT TO SERVER
// call ajax function again
}
I don't really have any experience with these tools, so any info will be much appreciated!
///////////////////// EDIT: ///////////////////////
I've been told that a more preferable option is to keep the connection constantly open with regular websocket requests. So a suggestion on how to do this would be appreciated as well.

How to render view template using node js express

I create an Ajax request (below) which passes data to the server with the information I need.
function verify(key) {
$.ajax({
async: true,
type: 'GET',
url: '/zonepass/'+key,
data: {
'zone_key': key
},
success: function(res){
//alert('Sent a text message successfully to ' + res);
}
});
}
I handle the Ajax request on the server side where I use the passed in data to query my Firebase DB to get other relevant information.
I then try to render the view page that I want to navigate to using res.render('verify',{zone: obj, key: zone_key}) where verify is another .ejs file that I want to navigate the user to and the JSON object is the data that I want to pass to that template.
My code is not rendering the view page and I'm not sure why. I console logged all the data on the server and all the data is being pulled properly but then my view page never navigates to the verify ejs file...
app.get('/zonepass/:id', function(req,res) {
var zone_key = req.param('zone_key');
var zone_obj = firebase.database().ref('zones').child(zone_key).once('value').then((snap) => {
obj = snap.val();
res.render('verify',{zone: obj, key: zone_key});
});
});

res.render will not work with an ajax request, response from ajax call is returned and accessible inside the success function, but res.render will not work also res.redirect will not work with ajax request.
So you need to submit your request using a form or redirecting on frontend to that route, which is technically also a get request but without ajax example:
Using only HTML:
Verify
Using javascript:
function verify(key) {
window.location.href= "/zonepass/"+ <your id> + "?zone_key=<your zone key>"
}
Also in your NodeJS route you can access id using req.params.id and zone_key using req.query.zone_key, so your server code will be:
app.get('/zonepass/:id', function(req,res) {
var id = req.params.id;
var zone_key = req.query.zone_key;
var zone_obj = firebase.database().ref('zones').child(zone_key).once('value').then((snap) => {
obj = snap.val();
res.render('verify',{zone: obj, key: zone_key});
});
});
BTW you will need to handle inside the verify view, if the key is not verified, example you show an error or message in verify view, that the key is not correct ... or any message related to your logic

Node.Js promise redirect doesn't work

I have a settings page that you can insert and delete some filters. For delete request I used this:
$('#delete-filter').click(function (e) {
var filtername = $('#filter-list').val();
var filterCount = $('#filter-list option').length;
var retVal = confirm("Are you sure to delete this filter?");
if( retVal == true ){
$.ajax({
url: "/settings?filtername=" + filtername,
method: 'DELETE',
dataType: "json",
success: function (result) {
}
});
}
else{
return false;
}
});
And here is my route for this page:
router.delete('/settings', ensureAuthenticated, function (req, res, next) {
var promise = user.deleteFilter(req.session.user_id, req.query.filtername);
var promise2 = promise.then(function (data) {
req.session.selected_filter = data.selected;
res.redirect('/settings');
}, function (error) {
console.log(error);
})
})
Essentially I want to redirect to page to settings, so the page reloads with the new data. But in promise chain I can't use any response functions. Am I using the redirect wrong? or I can't send a response in promise chain ?

You've misidentified the problem.
When you issue an HTTP redirect, you say "The thing you were looking for? Get it from here instead."
This is not the same as "The browser should display this URL as a new page".
The HTTP redirect is followed, the settings page is delivered to the browser, then the browser makes it available as the result in your success function. (You then completely ignore it as you haven't put anything in that function).
If you want the browser to load a new page, then you need to deliver the URL as data (not as a redirect) and then assign that value to location.href.
The settings page probably shouldn't be determined dynamically, so you can probably just hard code the URL into the success function.
Hard coding it would make more sense, since you shouldn't send a redirect in response to a DELETE request:
If a DELETE method is successfully applied, the origin server
SHOULD send a 202 (Accepted) status code if the action will likely
succeed but has not yet been enacted, a 204 (No Content) status
code if the action has been enacted and no further information is
to be supplied, or a 200 (OK) status code if the action has been
enacted and the response message includes a representation
describing the status.