在 React.JS 和 Node.JS 中实现登录系统

Question

I need to implement a login system in MERN stack in which there will be three types of logins. 1. Admin login 2. Student Login 3. Faculty Login

The admin login will have a pre defined username and password (say admin & admin@123 resp.) which can be changed if needed.The faculty and student will only be able to login if the admin adds new student or faculty from his dashboard.The student and faculty username will be the registration number from college and password will be the date of birth.

All the tutorials that i came across are on registration and authentication & since registration is not a part of this project, I'd like to know basically how i should go about with this feature.

I am using mongodb as the database.

Answer 1

You have multiple things going on here:

1. authentication: accepting and checking a username and password
2. authorization: once a user has authenticated herself, assigning her the appropriate privilege level (admin, faculty, student in your case).
3. registration: in your system only the admin can register new users. This is different from some systems, which permit self-registration. Yours does not, according to your requirements.

( Important security tip it's a seriously bad idea to use date of birth for a password. Why? if a cybercreep breaks into your database, he will have a list of names and dates-of-birth. Those are useful for stealing your users' identities. They are also considered personally identifiable information and so they're covered by by GDPR and the California Consumer Privacy Act. But you didn't ask about that.... )

Let's take your requirements one-by-one.

1-authentication. This is a simple username/password scheme. Use the passport module for that, with its local strategy.

2- Authorization. When you look up the user also look up her privilege level (again admin or faculty or student). Passport feeds your user a session cookie so they stay logged in.

Before you display any page or accept any API request or form-post from a user, check the authorization level. If the user is not permitted to use the particular feature, send back a 403 error message rather than showing the page or accepting the form.

3- Registration. You need a form for creating / replacing / updating / deleting users (called a CRUD form). This form must be accessible only to your admin.

By the way, all this happens on your node / express server. Your react client must simply pass along the passport-generated session cookie with every request, so the server can look up the user to retrieve the authorization.

Thinking about your requirements in this structured fashion should help you apply the stuff you learn from various online tutorials.