Why should we use a flash/message middleware like connect-flash? What benefits/values does it brings to a nodejs web application?
Can't we simply send a response object instead of using it?
Does it complement a front-end notification tools like toastr?
"Flash" middleware helps you send information (an object, array, etc.) to a request you are redirecting to.
Example: you are displaying a list of users and want to delete a specific user. In your DELETE /users/123 handler you'd probably want to redirect to GET /users to display all remaining users. But probably you also want to display a message "User 123 deleted successfully".
Flash middleware makes it easy to send this message to the next request handler.
The alternative would be to:
Encode the information into the URL you are redirecting to.
Store the information in your session. But this is exactly what flash middleware does, so it's probably easier to use one out of the box instead of implementing it yourself.
I have used express-flash which is used by the server to send flash messages to the rendering engine. If you are using jade as your rendering engine, you can use a partial jade file to detect the presence of these flash messages and show appropriate animations or display. Whereas on the other hand if we are using a front end notification tool we need to implement a listener on the client side to explicitly detect these toasts. I assume connect-flash is similar
Related
I want to update the HTML/pug page of multiple users when particular data changes in my MongoDB database. A user(A) follows another user(B) (whose data is stored in a different collection). When user(B) updates something, user(A) should see the change. There can be multiple people following the same user, and all the people following the user should see live updates.
I tried looking into socket.io but it doesn't look like it is the right thing for my purpose.
Your main options are either websockets (socket.io), server side push notifications with http2, or polling with http.
If socket.io seems overkill, server push notifications probably will too.
You can poll instead. Ie, send an http request from the client at regular intervals, like every 10 (or whatever seems suitable) seconds and update the page based on the response data
You’ll need to use JavaScript on the client for this. Pug templates render just once on page load. If you want dynamic updates after the initial render, you need client side JavaScript in all cases.
I have an app that currently uses the fetch api to make AJAX requests for CRUD operations. In case of success or error, my server sends a response containing an array of error/success messages like:
['Missing email field', 'Password is too short']
If I wasn't using AJAX and instead reloading/rerendering the page, there are modules like connect-flash and express-session that allow you to flash error/success message to the user.
How can I achieve the same when doing AJAX requests with the fetch API? One method I thought of was creating a div on my view and then adding the error/success as li elements on that view via JS. However, I was wondering if there was a module that does all this for you like there is for when re-rendering the pages.
Further, if I use the approach described above of modifying the DOM with the messages, those messages persist on the view. I only want to show the messages for limited amount of time to the user.
Thanks for the help!
EDIT:
I am only using express-handlebars and bootstrap modules so not using any big frameworks like Vue/React/Angular.
Since you are using Bootstrap, I'd recommend looking at their Alerts component, it supports the ability to dismiss via the UI or programmatically
I want to send data to the client without having it redirect and show the data in the browser. The server is written in node.js using express.js.
It is for a login function.
I need to have it work like this since the idea of the system is to use the front-end purely as a GUI for interacting with the API.
res.send("Login failed").redirect(homepage);
I've seen framework-engine which I suppose I could use, but I would like to avoid as much additional "software" as possible. Essentially my question is: How do I send data back to the client so that it can be used in an already shown HTML page.
I currently use res.error('message'); to show a message on the page that I load using res.redirect(url); in my Express/Node.js app.
Is there another way of showing a message, if I don't want it to be error message, but something else?
Thanks!
res.redirect(url) will actually issue an HTTP 302 redirect which will cause your user's browser to make a brand new request for whatever page is specified by the value in the url variable.
If you want to show the user a message after the redirect, you would need to store that message somewhere that will persist between requests and then read it on the subsequent page load. This is often accomplished by storing the message in a cookie or in server-side session state and is often referred to as flash storage.
The express-flash middleware can help you with this, although I'm not 100% certain of its compatibility with Express 4.
You also might find this SO question helpful.
You could use one of the other res method to send the message:
send('message') or end('message') seems being the most appropriated.
You could otherwise display some page with .render (view, templateParam).
More details here, on express request documentation
Use flash. They provide templates for error, success and informational messages. Very useful if your users are coming in with web browsers.
I'm extremely new to node.js, and have years of experience in PHP, so my thinking about the issues below, might be tainted by my backed ways.
I'm currently using node set up with foundation CSS, and using their reveal modal windows to display most of my forms. I want to avoid re-displaying them upon submit, and instead, validate them on client side.
Basic user creation will have fields as per below:
name
email
password
password confirmation
Form my basic validation i can use require to validate the input,
input(type="text",name="user[email]",placeholder="#",required)
but I would also like the client to check if the email already exists after the user types it in, and whether the passwords are correct.
I've been reading about the validator module but from the documentation I read about it, I only understand how to validate the values after they've been posted. I've seen the express-form module as well, but It's no longer maintained, so I would rather avoid it.
Could someone point me in the right direction?
I don't have any experience with validator or express-form, and I am not sure you need them for what you are trying to achieve. Most of what you are trying to do will be client side work (e.g. jQuery Ajax calls to validate the data) That kind of client-side code should be pretty much the same regardless of whether you use a Node.js backend or a PHP backend.
Injecting the initial JavaScript in your Jade page should be pretty straightforward once you figure out the proper syntax to include JavaScript in a Jade page. The wiring of DOM events on the page to make Ajax calls (onClick, onTextChanged, et cetera) will be conceptually the same as if you were writing a plain HTML page.
In your Node.js server side you'll need a route to handle the request to validate if an e-mail address already exists and that code very likely will return JSON that you will use in your client side form to display the results of the validation to the user. But that should also be very similar to what you would have done with a PHP backend.