Node.js – Express Framework các thông tin bạn chưa biết
Express là một khung ứng dụng web Node.js tối thiểu và linh hoạt, cung cấp một bộ tính năng mạnh mẽ để phát triển các ứng dụng web và di động. Nó tạo điều kiện cho sự phát triển nhanh chóng của các ứng dụng Web dựa trên Node. Sau đây là một số tính năng cốt lõi của Express framework –
-
Cho phép thiết lập phần mềm trung gian để phản hồi Yêu cầu HTTP.
-
Xác định bảng định tuyến được sử dụng để thực hiện các hành động khác nhau dựa trên Phương thức HTTP và URL.
-
Cho phép hiển thị động các Trang HTML dựa trên việc chuyển các đối số tới các mẫu.
Cài đặt nhanh
Đầu tiên, cài đặt khung Express trên toàn cầu bằng NPM để có thể sử dụng nó để tạo ứng dụng web bằng thiết bị đầu cuối nút.
$ npm install express --save
Lệnh trên lưu cài đặt cục bộ trong thư mục node_modules và tạo một thư mục express bên trong node_modules. Bạn nên cài đặt các mô-đun quan trọng sau cùng với express –
-
body-parser − Đây là phần mềm trung gian node.js để xử lý dữ liệu biểu mẫu được mã hóa JSON, Raw, Text và URL.
-
trình phân tích cú pháp cookie – Phân tích cú pháp tiêu đề Cookie và điền req.cookies bằng một đối tượng được khóa bởi tên cookie.
-
multer − Đây là một phần mềm trung gian node.js để xử lý dữ liệu nhiều phần/biểu mẫu.
$ npm install body-parser --save $ npm install cookie-parser --save $ npm install multer --save
Hello World Ví dụ
Sau đây là một ứng dụng Express rất cơ bản khởi động máy chủ và lắng nghe trên cổng 8081 để kết nối. Ứng dụng này phản hồi với Hello World! cho các yêu cầu đến trang chủ. Đối với mọi đường dẫn khác, nó sẽ phản hồi với 404 Not Found.
var
express
=
require
(
'express'
);
var
app
=
express
();
app
.
get
(
'/'
,
function
(
req
,
res
)
{
res
.
send
(
'Hello World'
);
})
var
server
=
app
.
listen
(
8081
,
function
()
{
var
host
=
server
.
address
().
address
var
port
=
server
.
address
().
port console
.
log
(
"Example app listening at http://%s:%s"
,
host
,
port
)
})
Lưu đoạn mã trên vào một tệp có tên server.js và chạy nó bằng lệnh sau.
$ node server.js
Bạn sẽ thấy đầu ra sau –
Example app listening at http://0.0.0.0:8081
Mở http://127.0.0.1:8081/ trong bất kỳ trình duyệt nào để xem kết quả sau.
Yêu cầu & Phản hồi
Ứng dụng Express sử dụng chức năng gọi lại có tham số là các đối tượng yêu cầu và phản hồi .
app.get('/', function (req, res) {
// --
})
-
Đối tượng yêu cầu − Đối tượng yêu cầu đại diện cho yêu cầu HTTP và có các thuộc tính cho chuỗi truy vấn yêu cầu, tham số, nội dung, tiêu đề HTTP, v.v.
-
Đối tượng phản hồi – Đối tượng phản hồi đại diện cho phản hồi HTTP mà ứng dụng Express gửi khi nhận được yêu cầu HTTP.
Bạn có thể in các đối tượng req và res cung cấp nhiều thông tin liên quan đến yêu cầu và phản hồi HTTP bao gồm cookie, phiên, URL, v.v.
Định tuyến cơ bản
Chúng ta đã thấy một ứng dụng cơ bản phục vụ yêu cầu HTTP cho trang chủ. Định tuyến đề cập đến việc xác định cách ứng dụng phản hồi yêu cầu của máy khách tới một điểm cuối cụ thể, đó là một URI (hoặc đường dẫn) và một phương thức yêu cầu HTTP cụ thể (GET, POST, v.v.).
Chúng tôi sẽ mở rộng chương trình Hello World của mình để xử lý nhiều loại yêu cầu HTTP hơn.
var
express
=
require
(
'express'
);
var
app
=
express
();
// This responds with "Hello World" on the homepage
app
.
get
(
'/'
,
function
(
req
,
res
)
{
console
.
log
(
"Got a GET request for the homepage"
);
res
.
send
(
'Hello GET'
);
})
// This responds a POST request for the homepage
app
.
post
(
'/'
,
function
(
req
,
res
)
{
console
.
log
(
"Got a POST request for the homepage"
);
res
.
send
(
'Hello POST'
);
})
// This responds a DELETE request for the /del_user page.
app
.
delete
(
'/del_user'
,
function
(
req
,
res
)
{
console
.
log
(
"Got a DELETE request for /del_user"
);
res
.
send
(
'Hello DELETE'
);
})
// This responds a GET request for the /list_user page.
app
.
get
(
'/list_user'
,
function
(
req
,
res
)
{
console
.
log
(
"Got a GET request for /list_user"
);
res
.
send
(
'Page Listing'
);
})
// This responds a GET request for abcd, abxcd, ab123cd, and so on
app
.
get
(
'/ab*cd'
,
function
(
req
,
res
)
{
console
.
log
(
"Got a GET request for /ab*cd"
);
res
.
send
(
'Page Pattern Match'
);
})
var
server
=
app
.
listen
(
8081
,
function
()
{
var
host
=
server
.
address
().
address
var
port
=
server
.
address
().
port console
.
log
(
"Example app listening at http://%s:%s"
,
host
,
port
)
})
Lưu đoạn mã trên vào một tệp có tên server.js và chạy nó bằng lệnh sau.
$ node server.js
Bạn sẽ thấy đầu ra sau –
Example app listening at http://0.0.0.0:8081
Giờ đây, bạn có thể thử các yêu cầu khác nhau tại http://127.0.0.1:8081 để xem kết quả do server.js tạo ra. Sau đây là một số ảnh chụp màn hình hiển thị các phản hồi khác nhau cho các URL khác nhau.
Màn hình hiển thị lại http://127.0.0.1:8081/list_user
Màn hình hiển thị lại http://127.0.0.1:8081/abcd
Màn hình hiển thị lại http://127.0.0.1:8081/abcdefg
Phục vụ tệp tĩnh
Express cung cấp một phần mềm trung gian tích hợp sẵn express.static để phục vụ các tệp tĩnh, chẳng hạn như hình ảnh, CSS, JavaScript, v.v.
Bạn chỉ cần chuyển tên của thư mục nơi bạn lưu giữ nội dung tĩnh của mình tới phần mềm trung gian express.static để bắt đầu phân phối tệp trực tiếp. Ví dụ: nếu bạn giữ các tệp hình ảnh, CSS và JavaScript của mình trong một thư mục có tên công khai, bạn có thể thực hiện điều này –
app.use(express.static('public'));
Chúng tôi sẽ giữ một vài hình ảnh trong thư mục con public/images như sau –
node_modules server.js public/ public/images public/images/logo.png
Hãy sửa đổi ứng dụng “Xin chào Word” để thêm chức năng xử lý các tệp tĩnh.
var
express
=
require
(
'express'
);
var
app
=
express
();
app
.
use
(
express
.
static
(
'public'
));
app
.
get
(
'/'
,
function
(
req
,
res
)
{
res
.
send
(
'Hello World'
);
})
var
server
=
app
.
listen
(
8081
,
function
()
{
var
host
=
server
.
address
().
address
var
port
=
server
.
address
().
port console
.
log
(
"Example app listening at http://%s:%s"
,
host
,
port
)
})
Lưu đoạn mã trên vào một tệp có tên server.js và chạy nó bằng lệnh sau.
$ node server.js
Bây giờ hãy mở http://127.0.0.1:8081/images/logo.png trong bất kỳ trình duyệt nào và quan sát kết quả sau.
NHẬN phương thức
Đây là một ví dụ đơn giản chuyển hai giá trị bằng phương thức HTML FORM GET. Chúng tôi sẽ sử dụng bộ định tuyến process_get bên trong server.js để xử lý đầu vào này.
<html>
<body>
<form
action
=
"http://127.0.0.1:8081/process_get"
method
=
"GET"
>
First Name:
<input
type
=
"text"
name
=
"first_name"
>
<br>
Last Name:
<input
type
=
"text"
name
=
"last_name"
>
<input
type
=
"submit"
value
=
"Submit"
>
</form>
</body>
</html>
Hãy lưu đoạn mã trên vào index.htm và sửa đổi server.js để xử lý các yêu cầu trang chủ cũng như đầu vào được gửi bởi biểu mẫu HTML.
var
express
=
require
(
'express'
);
var
app
=
express
();
app
.
use
(
express
.
static
(
'public'
));
app
.
get
(
'/index.htm'
,
function
(
req
,
res
)
{
res
.
sendFile
(
__dirname
+
"/"
+
"index.htm"
);
})
app
.
get
(
'/process_get'
,
function
(
req
,
res
)
{
// Prepare output in JSON format
response
=
{
first_name
:
req
.
query
.
first_name
,
last_name
:
req
.
query
.
last_name
};
console
.
log
(
response
);
res
.
end
(
JSON
.
stringify
(
response
));
})
var
server
=
app
.
listen
(
8081
,
function
()
{
var
host
=
server
.
address
().
address
var
port
=
server
.
address
().
port console
.
log
(
"Example app listening at http://%s:%s"
,
host
,
port
)
})
Truy cập tài liệu HTML bằng cách sử dụng http://127.0.0.1:8081/index.htm sẽ tạo ra biểu mẫu sau –
First Name:
Last Name:
Bây giờ bạn có thể nhập Họ và Tên, sau đó nhấp vào nút gửi để xem kết quả và nó sẽ trả về kết quả sau –
{"first_name":"John","last_name":"Paul"}
Phương thức POST
Dưới đây là một ví dụ đơn giản chuyển hai giá trị bằng phương thức HTML FORM POST. Chúng tôi sẽ sử dụng bộ định tuyến process_get bên trong server.js để xử lý đầu vào này.
<html>
<body>
<form
action
=
"http://127.0.0.1:8081/process_post"
method
=
"POST"
>
First Name:
<input
type
=
"text"
name
=
"first_name"
>
<br>
Last Name:
<input
type
=
"text"
name
=
"last_name"
>
<input
type
=
"submit"
value
=
"Submit"
>
</form>
</body>
</html>
Hãy lưu đoạn mã trên vào index.htm và sửa đổi server.js để xử lý các yêu cầu trang chủ cũng như đầu vào được gửi bởi biểu mẫu HTML.
var
express
=
require
(
'express'
);
var
app
=
express
();
var
bodyParser
=
require
(
'body-parser'
);
// Create application/x-www-form-urlencoded parser
var
urlencodedParser
=
bodyParser
.
urlencoded
({
extended
:
false
})
app
.
use
(
express
.
static
(
'public'
));
app
.
get
(
'/index.htm'
,
function
(
req
,
res
)
{
res
.
sendFile
(
__dirname
+
"/"
+
"index.htm"
);
})
app
.
post
(
'/process_post'
,
urlencodedParser
,
function
(
req
,
res
)
{
// Prepare output in JSON format
response
=
{
first_name
:
req
.
body
.
first_name
,
last_name
:
req
.
body
.
last_name
};
console
.
log
(
response
);
res
.
end
(
JSON
.
stringify
(
response
));
})
var
server
=
app
.
listen
(
8081
,
function
()
{
var
host
=
server
.
address
().
address
var
port
=
server
.
address
().
port console
.
log
(
"Example app listening at http://%s:%s"
,
host
,
port
)
})
Truy cập tài liệu HTML bằng cách sử dụng http://127.0.0.1:8081/index.htm sẽ tạo ra biểu mẫu sau –
First Name:
Last Name:
Bây giờ bạn có thể nhập Họ và Tên, sau đó nhấp vào nút gửi để xem kết quả sau –
{"first_name":"John","last_name":"Paul"}
Tải lên tệp
Mã HTML sau đây tạo biểu mẫu trình tải tệp lên. Biểu mẫu này có thuộc tính method được đặt thành POST và thuộc tính enctype được đặt thành multipart/form-data
<html>
<head>
<title>
File Uploading Form
</title>
</head>
<body>
<h3>
File Upload:
</h3>
Select a file to upload:
<br
/>
<form
action
=
"http://127.0.0.1:8081/file_upload"
method
=
"POST"
enctype
=
"multipart/form-data"
>
<input
type
=
"file"
name
=
"file"
size
=
"50"
/>
<br
/>
<input
type
=
"submit"
value
=
"Upload File"
/>
</form>
</body>
</html>
Hãy lưu đoạn mã trên vào index.htm và sửa đổi server.js để xử lý các yêu cầu trang chủ cũng như tải tệp lên.
var
express
=
require
(
'express'
);
var
app
=
express
();
var
fs
=
require
(
"fs"
);
var
bodyParser
=
require
(
'body-parser'
);
var
multer
=
require
(
'multer'
);
app
.
use
(
express
.
static
(
'public'
));
app
.
use
(
bodyParser
.
urlencoded
({
extended
:
false
}));
app
.
use
(
multer
({
dest
:
'/tmp/'
}));
app
.
get
(
'/index.htm'
,
function
(
req
,
res
)
{
res
.
sendFile
(
__dirname
+
"/"
+
"index.htm"
);
})
app
.
post
(
'/file_upload'
,
function
(
req
,
res
)
{
console
.
log
(
req
.
files
.
file
.
name
);
console
.
log
(
req
.
files
.
file
.
path
);
console
.
log
(
req
.
files
.
file
.
type
);
var
file
=
__dirname
+
"/"
+
req
.
files
.
file
.
name
;
fs
.
readFile
(
req
.
files
.
file
.
path
,
function
(
err
,
data
)
{
fs
.
writeFile
(
file
,
data
,
function
(
err
)
{
if
(
err
)
{
console
.
log
(
err
);
}
else
{
response
=
{
message
:
'File uploaded successfully'
,
filename
:
req
.
files
.
file
.
name
};
}
console
.
log
(
response
);
res
.
end
(
JSON
.
stringify
(
response
)
);
});
});
})
var
server
=
app
.
listen
(
8081
,
function
()
{
var
host
=
server
.
address
().
address
var
port
=
server
.
address
().
port console
.
log
(
"Example app listening at http://%s:%s"
,
host
,
port
)
})
Truy cập tài liệu HTML bằng cách sử dụng http://127.0.0.1:8081/index.htm sẽ tạo ra biểu mẫu sau –
File Upload: Select a file to upload:
NOTE: This is just dummy form and would not work, but it must work at your server.
Quản lý cookie
Bạn có thể gửi cookie đến máy chủ Node.js có thể xử lý tương tự bằng cách sử dụng tùy chọn phần mềm trung gian sau. Sau đây là một ví dụ đơn giản để in tất cả các cookie do khách hàng gửi.
var
express
=
require
(
'express'
)
var
cookieParser
=
require
(
'cookie-parser'
)
var
app
=
express
()
app
.
use
(
cookieParser
())
app
.
get
(
'/'
,
function
(
req
,
res
)
{
console
.
log
(
"Cookies: "
,
req
.
cookies
)
})
app
.
listen
(
8081
)
