Xây dựng app theo dõi covid bằng NodeJS – Phần 2

6 min


1057
1.6k shares, 1057 points

Hãy đọc bài viết phần 1 trước khi bắt đầu đọc phần 2:

Xây dựng app theo dõi covid bằng NodeJS – Phần 1

Middle-wares

Các hàm Middleware là các hàm có quyền truy cập vào đối tượng yêu cầu (req), đối tượng phản hồi (res) trong NodeJS và chức năng tiếp theo trong chu trình đáp ứng yêu cầu của ứng dụng. Chức năng tiếp theo là một chức năng trong router Express, khi được gọi, sẽ thực thi middleware kế tiếp middleware hiện tại.

Ví dụ:

Giả sử, bạn có route (‘user / login) trong ứng dụng express người dùng đăng nhập. Bây giờ bạn muốn kiểm tra thông tin đăng nhập do người dùng cung cấp với thông tin đăng nhập được lưu trữ trong cơ sở dữ liệu và ủy quyền cho người dùng đó vào tài khoản.

Và khi nào bạn kiểm tra thông tin này? Sau khi người dùng gửi yêu cầu và trước khi ứng dụng của bạn gửi response. Và điều đó cần phải có middlewares. Bạn có thể viết logic của mình để xác thực người dùng trong middlewares và response cho người dùng theo giá trị trả về của middlewares. Khác với xác thực, Middleware cũng có nhiều công dụng. Đọc thêm về Middleware tại đây.

Để sử dụng chức năng phần mềm trung gian, chúng ta cần thêm app.use (middlewareFunctionName); trong code. Và điều đó sẽ thêm middleware được xác định rõ cho tất cả route trong ứng dụng của mình. Nó được gọi là application-level middleware’.

Nhưng chúng ta cũng có thể thêm middlewares vào route cụ thể bằng cách cung cấp route đó làm đối số đầu tiên trong hàm app.use:

app.use ('/', middlewareFunctionName);

Bây giờ, thêm các middleware trong code để phục vụ các route từ thư mục routes.

app.use(‘/’, require(‘./routes/index’));

Bây giờ, tạo ra trang đăng ký người dùng trong ứng dụng. Nhưng điều đó sẽ yêu cầu CSDL MongoDB. Vì vậy, hãy tạo một tài khoản trên MongoDB Atlas, họ cung cấp 500 MB lưu trữ cơ sở dữ liệu miễn phí. Và sẽ nhận được URL dùng để kết nối CSDL

mongodb+src://<username>:<password>@cluster0-kmdpn.mongodb.net/test?retryWrites=true&w=majority

Tạo database và kết nối database Covid

Trước hết, sử dụng mongoose và URL CSDL và xem liệu chúng ta có thể kết nối với cơ sở dữ liệu không. Chúng ta cần packagemongoose và sử dụng phương thức kết nối này để kết nối với CSDL. Hãy để thêm code dưới đây vào tệp app.js.

const mongoose = require(“mongoose”);const DATABASE_URL = “mongodb+srv://<username>:<password>@cluster0-kmdpn.mongodb.net/test?retryWrites=true&w=majority”;mongoose.connect(DATABASE_URL, (err) => {
 if (err) console.log(err);
 else console.log(“Connected to DB.”);
});

Bây giờ chúng ta có thể khởi động máy chủ và xem có kết nối với cơ sở dữ liệu hay không nhưng chúng ta hiện đang làm việc trên máy chủ localhost. Chúng ta không muốn mọi người nhìn thấy DATABASE_URL vì nó chứa tên người dùng và mật khẩu của CSDL. Để bảo vệ nó, sử dụng tệp .env để lưu trữ thông tin đăng nhập bí mật. Và chúng ta không up tệp này lên. Hãy cài đặt ‘dotenv’ npm package

npm install dotenv

Tạo file .env

Sau đó, tạo một tệp .env trong thư mục project và thêm DATABASE_URL vào tệp này. Và để sử dụng giá trị từ tệp, chúng ta có thể thực hiện các thay đổi sau.

require(“dotenv”).config();
// kết nối Database MongoDB
mongoose.connect(
 process.env.DB_CONN,
 (err) => {
 if (err) console.log(err);
 else console.log(“Connected to DB!”);
 }
);

Bây giờ chúng ta đã kết nối được CSDL.

Tạo User Model

Tiếp theo hãy tạo database bằng sách sử dụng schema.

Đầu tiên, tạo thư mục ‘Models’ trong thư mục app và tạo tệp User.js. Chúng ta sẽ viết đoạn code dưới trong file và export chúng.

Chúng ta cần 4 trường Name, Contact Number, State, và Active

const mongoose = require(“mongoose”);
const UserSchema = mongoose.Schema({
 name: {
 type: String,
 required: true,
 },
 number: {
 type: String,
 required: true,
 },
 state: {
 type: String,
 required: true,
 },
 active: {
 type: Boolean,
 required: true,
 default: true,
 },
});
module.exports = mongoose.model(“User”, UserSchema);

Sau khi tạo user model. Bây giờ,tạo các route và tạo trang HTML để đăng ký người dùng. Hãy bắt đầu bằng cách tạo route (‘/users/register’). Tạo một tệp users.js mới trong thư mục routes và thêm code dưới đây.

const express = require(“express”);
const router = express.Router();router.get(‘/register’, (req,res) => {
 res.render(‘register’);
});module.exports = router;

Tạo form đăng ký user NodeJS

Ở đây, chúng ta sử dụng router middleware Express được xây dựng sẵn. Sử dụng bộ định tuyến, chúng ta có thể dễ dàng serve các route có cùng tiền tố đó là ‘user’.

Chúng ta sẽ tạo ra nhiềuroute hơn với tiền tố ‘user’ và tận dụng middleware của Router. Bây giờ, hãy cùng nhau tạo form để người dùng đăng ký

<div class=”jumbotron”>
 <form action=”/users/add_user” method=”post”>
 <fieldset>
 <legend
 style=”text-align: center; text-decoration: underline;”
 class=”mt-3"
 >
 Register Now
 </legend>
 <div class=”form-group”>
 <label for=”name”>Name</label>
 <input
 type=”text”
 name=”name”
 class=”form-control”
 id=”name”
 required=”true”
 placeholder=”Enter Your Name”
 />
 </div>
 <div class=”form-group”>
 <label for=”phone”>Phone Number</label>
 <input
 name=”number”
 type=”text”
 class=”form-control”
 id=”number”
 required=”true”
 aria-describedby=”phoneHelp”
 placeholder=”Enter Your Number”
 />
 <small id=”phoneHelp” class=”form-text text-muted”
 >We’ll never share your number with anyone else. Promise!</small
 >
 </div>
 <div class=”form-group”>
 <label for=”state”>State</label>
 <select
 class=”form-control”
 id=”state”
 name=”state”
 style=”cursor: pointer;”
 required=”true”
 >
 <option
 selected=”selected”
 id=”state_default”
 value=””
 style=”display: none;”
 >Select State</option
 >
 <option value=”Gujarat”>Gujarat</option>
 <option value=”Maharashtra”>Maharashtra</option>
 </select>
 </div>
 <button type=”submit” class=”btn btn-primary”>Count Me In!</button>
 </fieldset>
 </form>
</div>

Nó sẽ trông giống như thế này,

User Registration Form
Form User đăng ký

Khi chúng ta thêm đường dẫn /users/add_user trong attribute hành động của thẻ form, hãy tạo ra route đó trong tệp users.js để người dùng đăng ký vào cơ sở dữ liệu .

Trong trường hợp này, đầu tiên chúng ta sẽ kiểm tra xem số điện thoại mà người dùng đã nhập có tồn tại trong cơ sở dữ liệu hay không.

Nếu nó tồn tại, sẽ chuyển hướng người dùng đến trang already_registered. Còn nó không tồn tại thì thêm vào cơ sở dữ liệu và chuyển hướng người dùng đến trang register/successful.

const User = require(“../models/User”);
// To access the User Model
router.post(“/add_user”, async (req, res) => {
 try {
 const { name, number, state } = req.body;
// Getting Form Fields From The Request Body.
 const new_user = await User.aggregate([{ $match: { number: number } }]);
// Checking if the number already exists.
 if (new_user.length != 0) {
 res.render(“already_registered”,
 {
 message: “It Seems Like, This number is already registered with us.”,
 }
 );
 } else {
 // Create a new user object to add to the DB.
 const user = new User({
 name: name,
 number: number,
 state: state,
 });
 const addedUser = await user.save();
// Saving the user to the database.
 res.redirect(“/users/register/successful”);
 }
 } catch (error) {
 console.log(error);
 res.json({ message: error });
 }
};

Và thực hiện!! Có thật không?? Không, Code này có lỗi vì chúng ta không thể trực tiếp sử dụng body của request . Chúng ta phải chuyển đổi nó thành JSON để có thể sử dụng.

Cài đặt body-parser NodeJS

Và để làm điều đó, cài đặt package body-parser, bằng câu lệnh sau

npm install body-parser

Thêm đoạn code sau vào file app.js

const bodyParser = require(“body-parser”);
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

Cuối cùng cũng đã hoàn thành !! Bây giờ trong bài đăng tiếp theo, chúng ta sẽ thêm phần thú vị nhất của ứng dụng này – API Twilio. Với API này, sẽ gửi cho người dùng một tin nhắn SMS khi họ đăng ký để cho họ biết rằng họ đã đăng ký thành công và chúng ta cũng sẽ tạo một route để nhận tin nhắn từ người dùng, nếu họ muốn dừng dịch vụ của chúng ta

Kết luận

Qua phần 2, chúng ta tạo được form và xây dựng cơ sở dữ liệu cho app Express. Hãy theo dõi phần tiếp hteo để xem phần thú vị nhé¬

Tham khảo thêm về NodeJS : Từng bước tạo RESTful API với NodeJS , Express, MySQL


Like it? Share with your friends!

1057
1.6k shares, 1057 points

What's Your Reaction?

hate hate
0
hate
confused confused
1
confused
fail fail
1
fail
fun fun
1
fun
geeky geeky
0
geeky
love love
0
love
lol lol
0
lol
omg omg
0
omg
win win
1
win