Bài 25-NodeJS RESTful Web Services – Phần 4

Tiếp tục WEB API cho NodeJS nha, ta mở lại Project ở bài 24. Để làm HTTPOST, cụ thể là viết API cho phép client gửi thông tin của một Product lên Server để thêm mới vào Cơ sở dữ liệu MongoDB.

HTTPPOST nó hơi phức tạp 1 xíu, nó có nhiều content-type khác nhau để gửi và nhận dữ liệu như là multipart/form-data, hay application/x-www-form-urlencoded hay raw….Tương ứng với mỗi content-type đó sẽ có cách bóc tách lấy dữ liệu khác nhau. Tui không đủ thời gian để nói hết các loại content-type, nên trong bài học này Tui sẽ hướng dẫn các bạn làm 1 cái thôi, đó là application/x-www-form-urlencoded.

Tui nói lại Cơ sở dữ liệu QuanLySanPham 1 xíu, đó là cấu trúc của bảng Product. Nó có Ma, Ten, DonGia. Tức là ở Client phải gửi chính xác 3 biến này và đủ 3 giá trị này lên cho Server thông qua Web API RESTful, ở trên Server sẽ nhận 3 thông số này (dĩ nhiên có một số Anh Hùng Xạ Điêu không thích đều này, họ không cần quy tắc nào cả, đặt tên sao cũng được, miễn truy lùng ra đúng giá trị cần nhập->Không nên tỏ vẻ nguy hiểm chỗ này nha vì nó chả làm các Thím đẹp trai ra 1 lạng nào cả mà làm cho trán của các Thím thêm mấy nếp nhăn vì phải suy nghĩ nhiều, đặc biệt khi làm việc nhóm thì các thành viên khác khóc ròng vì không thể biết được biến đó tương ứng với các thông số nào).

OK, quay trở lại server.js, ta bổ sung coding sau để tạo API cho phép Lưu mới một Product.

[code language=”javascript”]

/**
* ‘/addProduct’ cho biết phía Client phải gọi: http://localhost:1337/addProduct
* và phải dùng HTTPPOST (thấy hàm post không?)
*/
app.post(‘*/addProduct’, function (req, res) {
//định dạng content-type là application/x-www-form-urlencoded
res.writeHead(200, { ‘Content-Type’: ‘application/x-www-form-urlencoded;charset=utf-8’ });
//Khi định dạng content-type là application/x-www-form-urlencoded
//thì để truy suất tới các biến từ Client gửi lên ta làm như sau:
//Lấy đối tượng body trong req.body rồi req.body.[các biến từ client]
//[các biến từ client] là do lập trình viên quy định
//ta nên đặt tên biến trùng khớp với các cột trong các Bảng mà ta muốn thêm mới
//để tránh việc nhầm lẫn cũng như giúp cho các lập trình viên khác và ta dễ đọc
var MaFromClient = req.body.Ma
var TenFromClient = req.body.Ten
var DonGiaFromClient = req.body.DonGia
var result = “false”
MongoClient.connect(url, function (err, db) {
if (err) throw err;
//kết nối cơ sở dữ liệu QuanLySanpham
var dbo = db.db(“QuanLySanPham”);
//Tạo 1 JsonObject để lưu mới, cú pháp: { Ma: MaFromClient, Ten: TenFromClient, DonGia: DonGiaFromClient }
//Lưu ý Ma, Ten, DonGia ở bên trái dấu hai chấm (:) phải chính xác với tên cột được khái báo trong bảng
var newProduct = { Ma: MaFromClient, Ten: TenFromClient, DonGia: DonGiaFromClient };
//Gọi hàm insertOne để thêm mới 1 Product
dbo.collection(“Product”).insertOne(newProduct, function (err, obj) {
if (err) throw err;
console.log(“1 document inserted”);
//kết thúc session thì đóng kết nối CSDL
db.close();
//Kiểm tra xem obj.result.n ta sẽ biết bao nhiêu Record được thêm mới
//rõ ràng nếu >0 tức là có record được thêm mới
if (obj.result.n > 0)
result = “true”
//xuất ra cho Client biết là true hay false, dựa vào kết quả này mà Client sẽ
//hiển thị thêm mới Product thành công hay thất bại
res.end(result)
});
});
})

[/code]

Lưu ý, để NodeJS có thể hiểu được thì ta phải thêm các thư viện sau ở những dòng đầu ngay sau khi khai báo đối tượng app của file server.js (thiếu 3 dòng này là không làm được cơm phở gì đâu nha):

[code language=”javascript”]

var bodyParser = require(‘body-parser’);
app.use(bodyParser.json()); // support json encoded bodies
app.use(bodyParser.urlencoded({ extended: true })); // support encoded bodies

[/code]

Ta có Coding cuối cùng như sau cho server.js:

[code language=”javascript”]

//gọi thư viện express
var express = require(‘express’);
//tạo đối tượng có kiểu express()
var app = express();
//gọi thư viện fs
var fs = require(“fs”);
//khai báo PORT mặc định khi chạy(từ hệ thống, nó có PORT nào thì lấy PORT đó)
var port = process.env.PORT;
//chuỗi kết nối tới Cơ sở dữ liệu MongoDB
var url = “mongodb://localhost:27017/”;
//Gọi thư viện mongoDB và khởi tạo đối tượng cho nó
var MongoClient = require(‘mongodb’).MongoClient;
var bodyParser = require(‘body-parser’);
app.use(bodyParser.json()); // support json encoded bodies
app.use(bodyParser.urlencoded({ extended: true })); // support encoded bodies
/**
* Coding tạo HTTPGET lấy toàn bộ danh sách sản phẩm
* ‘/products’ có nghĩa là URI để lấy toàn bộ sản phẩm
* ta thích đặt gì cũng được, tuy nhiên vì danh sách nên có số nhiều là s (hoặc có chữ list cho dễ phân biệt)
* chẳng hạn như: http://localhost:1337/products
*/
app.get(‘*/products’, function (req, res) {
//thiết lập lấy dữ liệu với UTF-8
res.writeHead(200, { ‘Content-Type’: ‘text/json; charset=utf-8’ });
MongoClient.connect(url, function (err, db) {
if (err) throw err;
//kết nối Cơ sở dữ liệu MongoDB tên là QuanLySanPham
var dbo = db.db(“QuanLySanPham”);
//truy vấn toàn bộ dữ liệu trong bảng Product:
dbo.collection(“Product”).find({}).toArray(function (err, result) {
if (err) throw err;
console.log(result);
//đưa về JSON
var s = JSON.stringify(result);
//xuất ra Client:
res.end(s);
//đóng kết nối CSDL khi xong session
db.close();
});
});
})
/**
*
* coding tạo API lấy chi tiết Product
* Cú pháp: ‘/products/:id’
* =>URI khi chạy: http://localhost:1337/products/P1 để lấy Product có mã là P1
* Ngoài ra bạn có thể ‘/:id’
* =>URI khi chạy: http://localhost:1337/P1
* Tuy nhiên ta nên cho phân cấp như trong ví dụ này để biết rằng nó thuộc nhóm products
* http://localhost:1337/products/P1 sẽ dễ hiểu hơn
*/
app.get(‘*/products/:id’, function (req, res) {
//lấy được giá trị truyền vào từ URI:
var MaTim = req.params.id
res.writeHead(200, { ‘Content-Type’: ‘text/json; charset=utf-8’ });
MongoClient.connect(url, function (err, db) {
if (err) throw err;
//tạo điều kiện lọc theo Mã
//nó có cú pháp là 1 Json { Ma: MaTim } thì Ma là tên cột, MaTim là giá trị ta muốn lọc
//MaTim lâsy từ req.params.id
var query = { Ma: MaTim }
//Kết nối Cơ sở dữ liệu QuanLySanPham
var dbo = db.db(“QuanLySanPham”);
//truy vấn dữ liệu từ bảng Product và lọc theo MaTim
dbo.collection(“Product”).findOne(query, function (err, result) {
if (err) throw err;
console.log(result);
//đưa dữ liệu lấy được về JSON
var s = JSON.stringify(result);
//xuất ra client
res.end(s);
//xong session thì đóng kết nối
db.close();
});
});
})
/**
* ‘/addProduct’ cho biết phía Client phải gọi: http://localhost:1337/addProduct
* và phải dùng HTTPPOST (thấy hàm post không?)
*/
app.post(‘*/addProduct’, function (req, res) {
//định dạng content-type là application/x-www-form-urlencoded
res.writeHead(200, { ‘Content-Type’: ‘application/x-www-form-urlencoded;charset=utf-8’ });
//Khi định dạng content-type là application/x-www-form-urlencoded
//thì để truy suất tới các biến từ Client gửi lên ta làm như sau:
//Lấy đối tượng body trong req.body rồi req.body.[các biến từ client]
//[các biến từ client] là do lập trình viên quy định
//ta nên đặt tên biến trùng khớp với các cột trong các Bảng mà ta muốn thêm mới
//để tránh việc nhầm lẫn cũng như giúp cho các lập trình viên khác và ta dễ đọc
var MaFromClient = req.body.Ma
var TenFromClient = req.body.Ten
var DonGiaFromClient = req.body.DonGia
var result = “false”
MongoClient.connect(url, function (err, db) {
if (err) throw err;
//kết nối cơ sở dữ liệu QuanLySanpham
var dbo = db.db(“QuanLySanPham”);
//Tạo 1 JsonObject để lưu mới, cú pháp: { Ma: MaFromClient, Ten: TenFromClient, DonGia: DonGiaFromClient }
//Lưu ý Ma, Ten, DonGia ở bên trái dấu hai chấm (:) phải chính xác với tên cột được khái báo trong bảng
var newProduct = { Ma: MaFromClient, Ten: TenFromClient, DonGia: DonGiaFromClient };
//Gọi hàm insertOne để thêm mới 1 Product
dbo.collection(“Product”).insertOne(newProduct, function (err, obj) {
if (err) throw err;
console.log(“1 document inserted”);
//kết thúc session thì đóng kết nối CSDL
db.close();
//Kiểm tra xem obj.result.n ta sẽ biết bao nhiêu Record được thêm mới
//rõ ràng nếu >0 tức là có record được thêm mới
if (obj.result.n > 0)
result = “true”
//xuất ra cho Client biết là true hay false, dựa vào kết quả này mà Client sẽ
//hiển thị thêm mới Product thành công hay thất bại
res.end(result)
});
});
})
/**
* Chạy Server
*/
var server = app.listen(port, function () {

var host = server.address().address
var port = server.address().port

console.log(“Example app listening at http://%s:%s”, host, port)

})

[/code]

Nhấn F5 chạy lên, nếu cố gắng dùng trình duyệt để truy cập API addProduct http://localhost:1337/addProduct ta sẽ thấy lỗi như thế này:

dĩ nhiên là lỗi rồi, vì cách chạy trình duyệt đó chỉ thường áp dụng cho các HTTPGET mà thôi. Trong khi addProduct mình dùng HTTPPOST.

Vậy làm sao để chạy nó ta? đó là dùng các công cụ REST client như PostMan (Chrome), HTTP Requester (Firefox), WCF client Test (Microsoft). Lưu ý các công cụ này ta vẫn Debug được NodeJS một cách trực tiếp trong Visual nha (xem lại bài này để biết cách  Debug->Kéo xuống cuối bài hướng dẫn sẽ thấy).

OK, bây giờ Thím mở PostMan lên:

Mục 1: Chọn POST (vì addProduct viết theo method POST)

Mục 2: Nhập URI http://localhost:1337/addProduct

Mục 3: Chọn body và checked vào x-www-form-urlencoded

Mục 4: Nhập các Parameter trong body cho API. Lưu ý nhập chính xác tên biến khớp tới Cột trong bảng CSDL nha. Tui chụp hình dưới đây để các bạn hiểu về sự so khớp từ Client -> API

Mục 5: Bấm SEND

Mục 6: Kết quả cho biết là true hay false (true thành công, false thất bại.

Bây giờ ta có thể chạy lại API http://localhost:1337/products để xem được kết quả có thêm thành công hay chưa:

Bạn thấy đó, Tui mới bấm thêm đại 2 Product và thấy nó lưu thành công vào Cơ sở dữ liệu.

Như vậy các bạn đã biết cách viết HTTPPOST để lưu một Product vào cơ sở dữ liệu MongoDB như thế nào rồi nha.

Lưu ý muốn Debug để gỡ lỗi từng bước thì xem lại bài 23, kéo xuống dưới cùng có hướng dẫn

Source code HTTPPOST Thêm mới Product tải ở đây.

Bài sau Tui sẽ hướng dẫn các Thím cách viết HTTPPUT để chỉnh sửa dữ liệu, và sau đó là HTTPDELETE. Các bạn chú ý theo dõi nhé

Các khóa học online khác, bạn có thể tham khảo tại đây:

https://unica.vn/?aff=11929

Chúc các bạn thành công!

Bài 24-NodeJS RESTful Web Services – Phần 3

Trong bài 23 các bạn đã biết cách tạo API với phương thức HTTPGET để lấy toàn bộ danh sách sản phẩm rồi. Bài này Ta tiếp tục với HTTPGET để lấy thông tin chi tiết của 1 Sản Phẩm.

Ta tiếp tục mở Project NodejsRESTful ở bài 23 lên nhé và nhớ là vẫn sử dụng Cơ sở dữ liệu MongoDB tên QuanLySanPham đã tạo ở các bài trước.

Ngay bên dưới API lấy chi tiết Product, các bạn bổ sung lệnh sau:

[code language=”javascript”]

/**
*
* coding tạo API lấy chi tiết Product
* Cú pháp: ‘/products/:id’
* =>URI khi chạy: http://localhost:1337/products/P1 để lấy Product có mã là P1
* Ngoài ra bạn có thể ‘/:id’
* =>URI khi chạy: http://localhost:1337/P1
* Tuy nhiên ta nên cho phân cấp như trong ví dụ này để biết rằng nó thuộc nhóm products
* http://localhost:1337/products/P1 sẽ dễ hiểu hơn
*/
app.get(‘*/products/:id’, function (req, res) {
//lấy được giá trị truyền vào từ URI:
var MaTim = req.params.id
res.writeHead(200, { ‘Content-Type’: ‘text/json; charset=utf-8’ });
MongoClient.connect(url, function (err, db) {
if (err) throw err;
//tạo điều kiện lọc theo Mã
//nó có cú pháp là 1 Json { Ma: MaTim } thì Ma là tên cột, MaTim là giá trị ta muốn lọc
//MaTim lấy từ req.params.id
var query = { Ma: MaTim }
//Kết nối Cơ sở dữ liệu QuanLySanPham
var dbo = db.db(“QuanLySanPham”);
//truy vấn dữ liệu từ bảng Product và lọc theo MaTim
dbo.collection(“Product”).findOne(query, function (err, result) {
if (err) throw err;
console.log(result);
//đưa dữ liệu lấy được về JSON
var s = JSON.stringify(result);
//xuất ra client
res.end(s);
//xong session thì đóng kết nối
db.close();
});
});
})

[/code]

Cuối cùng file server.js ta có tất cả các Coding như sau:

[code language=”javascript”]

//gọi thư viện express
var express = require(‘express’);
//tạo đối tượng có kiểu express()
var app = express();
//gọi thư viện fs
var fs = require(“fs”);
//khai báo PORT mặc định khi chạy(từ hệ thống, nó có PORT nào thì lấy PORT đó)
var port = process.env.PORT;
//chuỗi kết nối tới Cơ sở dữ liệu MongoDB
var url = “mongodb://localhost:27017/”;
//Gọi thư viện mongoDB và khởi tạo đối tượng cho nó
var MongoClient = require(‘mongodb’).MongoClient;
/**
* Coding tạo HTTPGET lấy toàn bộ danh sách sản phẩm
* ‘/products’ có nghĩa là URI để lấy toàn bộ sản phẩm
* ta thích đặt gì cũng được, tuy nhiên vì danh sách nên có số nhiều là s (hoặc có chữ list cho dễ phân biệt)
* chẳng hạn như: http://localhost:1337/products
*/
app.get(‘*/products’, function (req, res) {
//thiết lập lấy dữ liệu với UTF-8
res.writeHead(200, { ‘Content-Type’: ‘text/json; charset=utf-8’ });
MongoClient.connect(url, function (err, db) {
if (err) throw err;
//kết nối Cơ sở dữ liệu MongoDB tên là QuanLySanPham
var dbo = db.db(“QuanLySanPham”);
//truy vấn toàn bộ dữ liệu trong bảng Product:
dbo.collection(“Product”).find({}).toArray(function (err, result) {
if (err) throw err;
console.log(result);
//đưa về JSON
var s = JSON.stringify(result);
//xuất ra Client:
res.end(s);
//đóng kết nối CSDL khi xong session
db.close();
});
});
})
/**
*
* coding tạo API lấy chi tiết Product
* Cú pháp: ‘/products/:id’
* =>URI khi chạy: http://localhost:1337/products/P1 để lấy Product có mã là P1
* Ngoài ra bạn có thể ‘/:id’
* =>URI khi chạy: http://localhost:1337/P1
* Tuy nhiên ta nên cho phân cấp như trong ví dụ này để biết rằng nó thuộc nhóm products
* http://localhost:1337/products/P1 sẽ dễ hiểu hơn
*/
app.get(‘*/products/:id’, function (req, res) {
//lấy được giá trị truyền vào từ URI:
var MaTim = req.params.id
res.writeHead(200, { ‘Content-Type’: ‘text/json; charset=utf-8’ });
MongoClient.connect(url, function (err, db) {
if (err) throw err;
//tạo điều kiện lọc theo Mã
//nó có cú pháp là 1 Json { Ma: MaTim } thì Ma là tên cột, MaTim là giá trị ta muốn lọc
//MaTim lâsy từ req.params.id
var query = { Ma: MaTim }
//Kết nối Cơ sở dữ liệu QuanLySanPham
var dbo = db.db(“QuanLySanPham”);
//truy vấn dữ liệu từ bảng Product và lọc theo MaTim
dbo.collection(“Product”).findOne(query, function (err, result) {
if (err) throw err;
console.log(result);
//đưa dữ liệu lấy được về JSON
var s = JSON.stringify(result);
//xuất ra client
res.end(s);
//xong session thì đóng kết nối
db.close();
});
});
})
/**
* Chạy Server
*/
var server = app.listen(port, function () {

var host = server.address().address
var port = server.address().port

console.log(“Example app listening at http://%s:%s”, host, port)

})

[/code]

Nhấn F5 để chạy và gõ URI http://localhost:1337/products/P1 , ta có kết quả:

Ta có thể thử nghiệm với PostMan:

Mục 1: Chọn GET vì API này dùng Method GET

Mục 2: Nhập URI http://localhost:1337/products/P1

Mục 3: Nhấn SEND

Mục 4: Xem kết quả

Như vậy các bạn đã biết cách viết HTTPGET đầu tiên trong các phương thức phổ biến của RESTful.

Source code HTTPGET lấy chi tiết Product tải ở đây.

Bài sau Tui sẽ hướng dẫn các Thím cách viết HTTPPOST để thêm mới Product, và sau đó là HTTPPUT, HTTPDELETE. Các bạn chú ý theo dõi nhé

Các khóa học online khác, bạn có thể tham khảo tại đây:

https://unica.vn/?aff=11929

Chúc các bạn thành công!

Bài 23-NodeJS RESTful Web Services – Phần 2

Bài 22 Tui đã nói sơ qua về RESTful và làm 1 ví dụ nhỏ về cách tạo Restful đọc dữ liệu từ JSON trong NodeJS. Ở bài này ta viết API lấy danh sách Product trong MongoDB dùng method HTTPGET, sử dụng PostMan(cách dùng PostMan nếu chư biết xem ở đây) để kiểm thử API, Visual Studio để debug gỡ lỗi chương trình. Và Cơ sở dữ liệu MongoDB vẫn là QuanLySanPham trong chuỗi bài học này nha.

Tạo một Project tên NodejsRESTful(cách tạo Project nếu chưa biết xem tại đây)

Vì Project của ta phải làm 2 nhiệm vụ: tương tác dữ liệu MongoDB và tạo RESTful do đó ta phải thêm 2 thư viện:

  • Express (tạo RESTful)
  • MongoDB

Để thêm Express ta làm như sau: Bấm chuột phải vào npm/chọn Install New npm Packages...

Tìm tới Express nhìn hình dưới đây:

Bấm Install Package để cài đặt

Tiếp tục lặp theo tác tìm và cài đặt MongoDB:

Bấm Install Package để cài đặt thư viện

Cuối cùng Project của ta sẽ tham chiếu tới 2 thư viện như hình dưới đầy là thành công:

Tiếp tục mở server.js coding như sau để xử lý:

Bước 1: Gọi thư viện và khởi tạo các biến

[code language=”javascript”]

//gọi thư viện express
var express = require(‘express’);
//tạo đối tượng có kiểu express()
var app = express();
//gọi thư viện fs
var fs = require(“fs”);
//khai báo PORT mặc định khi chạy(từ hệ thống, nó có PORT nào thì lấy PORT đó)
var port = process.env.PORT;
//chuỗi kết nối tới Cơ sở dữ liệu MongoDB
var url = “mongodb://localhost:27017/”;
//Gọi thư viện mongoDB và khởi tạo đối tượng cho nó
var MongoClient = require(‘mongodb’).MongoClient;

[/code]

Tạo HTTPGET trong NodeJs như sau:

[code language=”javascript”]

/**
* Coding tạo HTTPGET lấy toàn bộ danh sách sản phẩm
* ‘/products’ có nghĩa là URI để lấy toàn bộ sản phẩm
* ta thích đặt gì cũng được, tuy nhiên vì danh sách nên có số nhiều là s (hoặc có chữ list cho dễ phân biệt)
* chẳng hạn như: http://localhost:1337/products
*/
app.get(‘*/products’, function (req, res) {
//thiết lập lấy dữ liệu với UTF-8
res.writeHead(200, { ‘Content-Type’: ‘text/json; charset=utf-8’ });
MongoClient.connect(url, function (err, db) {
if (err) throw err;
//kết nối Cơ sở dữ liệu MongoDB tên là QuanLySanPham
var dbo = db.db(“QuanLySanPham”);
//truy vấn toàn bộ dữ liệu trong bảng Product:
dbo.collection(“Product”).find({}).toArray(function (err, result) {
if (err) throw err;
console.log(result);
//đưa về JSON
var s = JSON.stringify(result);
//xuất ra Client:
res.end(s);
//đóng kết nối CSDL khi xong session
db.close();
});
});
})

[/code]

Cuối cùng coding để chạy Server, lắng nghe ở Port quy định nào đó:

[code language=”javascript”]

/**
* Chạy Server
*/
var server = app.listen(port, function () {

var host = server.address().address
var port = server.address().port

console.log(“Example app listening at http://%s:%s”, host, port)

})

[/code]

Cuối cùng ta có Coding đầy đủ như sau cho file server.js:

[code language=”javascript”]

//gọi thư viện express
var express = require(‘express’);
//tạo đối tượng có kiểu express()
var app = express();
//gọi thư viện fs
var fs = require(“fs”);
//khai báo PORT mặc định khi chạy(từ hệ thống, nó có PORT nào thì lấy PORT đó)
var port = process.env.PORT;
//chuỗi kết nối tới Cơ sở dữ liệu MongoDB
var url = “mongodb://localhost:27017/”;
//Gọi thư viện mongoDB và khởi tạo đối tượng cho nó
var MongoClient = require(‘mongodb’).MongoClient;
/**
* Coding tạo HTTPGET lấy toàn bộ danh sách sản phẩm
* ‘/products’ có nghĩa là URI để lấy toàn bộ sản phẩm
* ta thích đặt gì cũng được, tuy nhiên vì danh sách nên có số nhiều là s (hoặc có chữ list cho dễ phân biệt)
* chẳng hạn như: http://localhost:1337/products
*/
app.get(‘*/products’, function (req, res) {
//thiết lập lấy dữ liệu với UTF-8
res.writeHead(200, { ‘Content-Type’: ‘text/json; charset=utf-8’ });
MongoClient.connect(url, function (err, db) {
if (err) throw err;
//kết nối Cơ sở dữ liệu MongoDB tên là QuanLySanPham
var dbo = db.db(“QuanLySanPham”);
//truy vấn toàn bộ dữ liệu trong bảng Product:
dbo.collection(“Product”).find({}).toArray(function (err, result) {
if (err) throw err;
console.log(result);
//đưa về JSON
var s = JSON.stringify(result);
//xuất ra Client:
res.end(s);
//đóng kết nối CSDL khi xong session
db.close();
});
});
})
/**
* Chạy Server
*/
var server = app.listen(port, function () {

var host = server.address().address
var port = server.address().port

console.log(“Example app listening at http://%s:%s”, host, port)

})

[/code]

Nhấn F5 để chạy phần mềm ta có:

Ngoài ra, ta mở PostMan lên để kiểm thử kết quả (Thím nào chưa biết PostMan là gì thì vào link này):

Trong PostMan để thử method HTTPGET, ta chọn GET (mục 1), nhập đường link URI (mục 2), bấm SEND (mục 3) để triệu gọi service, mục 4 là kết quả.

Đặc biệt nếu ở Visual Studio các Thím muốn debug xem lỗi liếc chỗ nào thì cứ đặt break point ngay chỗ kiểu tra. Lúc bấm Send ở PostMan nó sẽ tự động nhảy vào Visual Studio ngay chỗ Break point cho các Thím debug (dĩ nhiên công cụ nào cũng được không nhất thiết là PostMan kể cả trình duyệt).

Ví dụ: Đặt break point ở Visual ngay chỗ dòng 25 và 33 (click chuột ở ngoài lề hoặc nhật F9 ngay dòng ta đứng):

ở PostMan nhấn Send ta thấy nó tự động back về Visual Studio cho ta Debug (rất hay):

Dùng F10, F11 để Debug xem lỗi liếc chỗ nào, rất hay nha. Nếu kiểm thử API trên PostMan chạy thành công thì hầu như 100% coding từ các thiết bị khác đều phải thành công (nếu không là do bạn lập trình củ chuối).

Ngoài ra các Thím cũng cần tập đưa nó lên IISNode Server nha để nó chạy 24/7 không cần phải có Visual Studio, xem hướng dẫn tại bài này

Như vậy các bạn đã biết cách viết HTTPGET đầu tiên trong các phương thức phổ biến của RESTful.

Source code HTTPGET lấy danh sách Product tải ở đây.

Bài sau Tui sẽ hướng dẫn các Thím HTTPGET về lấy thông tin chi tiết của 1 Product và tiếp theo là các Method HTTPPOST, HTTPPUT, HTTPDELETE. Các bạn chú ý theo dõi nhé

Các khóa học online khác, bạn có thể tham khảo tại đây:

https://unica.vn/?aff=11929

Chúc các bạn thành công!

Bài 22-NodeJS RESTful Web Services – Phần 1

Ta đã biết cách lập trình NodeJS và cấu hình IISNode Server. Tiếp sau đây Tui sẽ hướng dẫn các bạn chi tiết cách lập trình RESTful WebService bằng NodeJS như thế nào.

Chuỗi bài học này sẽ dùng MongoDB làm Cơ sở dữ liệu để demo, dùng PostMan, một công cụ Rest Client vô cùng tuyệt vời để Test các coding liên quan tới RESTful. Đặc biệt ta sẽ Debug trực tiếp từ PostMan – qua Visual Studio để lần vết lỗi (Lập trình viên phải biết Debug, vì cuộc đời chúng ta sinh ra để tạo ra lỗi và để sửa lỗi ..ahahaha)

Ở bài học đầu tiên trong chuỗi RESTful Web Service này Tui sẽ nói sơ qua về lý thuyết kiến trúc REST, REST là gì (nói sơ thôi, chứ các Thím vào Google enter 1 cái nó ra 1 nùi), đồng thời làm 1 ví dụ nho nhỏ là HTTPGET để lấy toàn bộ dữ liệu trong 1 file JSON như thế nào. Sau khi nắm được kiến trúc của nó rồi thì qua các bài sau ta sẽ coding đầy đủ về RESTful trên CSDL MongoDB.

Lưu ý: REST, RESTful là một khái niệm chung, nó độc lập với bất kỳ ngôn ngữ lập trình nào (giống như lập trình Hướng đối tượng – OOP nó là 1 khái niệm). Khi hiểu bản chất của nó rồi thì Ngôn ngữ nào cũng không nghĩa địa gì với các bạn cả.

Nếu các bạn muốn tạo RESTful bằng .net thì có thể đọc các bài sau: Bài 68-phần 1 , Bài 69-phần 2Bài 70- phần 3, Bài 71- phần 4, Ngoài ra Tui cũng có quay khóa học thành Video các bạn có thể đăng ký học tại đây: https://communityuni.com/Home/WebService

REST là gì ?

REST lần đầu tiên được giới thiệu bởi Roy Fielding năm 2000. REST là viết tắt của Representational State Tranfer. REST là một chuẩn web dựa vào các kiến trúc cơ bản sử dụng giao thức HTTP. Nó xử lí tài nguyên, nơi mà mỗi thành phần là một tài nguyên và nguồn tài nguyên này có thể được truy cập qua các giao diện chung bởi sử dụng các phương thức HTTP chuẩn (POST, GET, PUT, DELETE).->Chắc chả hiểu gì đâu, đọc nghe lùng bùng lỗ tai, lý thuyết nó vậy thì cứ đọc đi cho nó vui. Ráng đua theo chuỗi bài hướng dẫn sẽ hiểu hết á các Thím.

Lưu ý mỗi nguồn tài nguyên được xác định bởi một URI (Ví dụ như: Muốn lấy toàn bộ Sản phẩm thì vào http://localhost:1337/products, Muốn lấy chi tiết Sản phẩm có mã là P35 thì vào http://localhost:1337/products/P35). REST sử dụng các cách biểu diễn khác nhau để biểu diễn các nguồn tài nguyên như text, JSON, XML nhưng phổ biến nhất vẫn là JSON.

Các Phương thức HTTP được sử dụng trong REST nhiều nhất là (dĩ nhiên còn 1 nùi khác mà Tui không đề cập):

GET – Được sử dụng để đọc các nguồn tài nguyên.

POST – Được sử dụng để tạo mới nguồn tài nguyên.

PUT – Được sử đụng để chỉnh sửa nguồn tài nguyên.

DELETE – Được sử dụng để xóa các nguồn tài nguyên.

Lưu ý: Dĩ nhiên lâu lâu vẫn có những Anh Hùng Xạ Điêu sử dụng 4 Method ở trên mà không cần phải theo quy luật. Tức là họ tỏ vẻ nguy hiểm ngáo đá như thế này: GET dùng để thêm mới, POST dùng để xóa, PUT dùng để tạo mới… vẫn được hết nha các Thím (nhưng hãy làm đúng chức năng nhiệm vụ của nó đã, khi nào trùm rồi thì tỏ vẻ nguy hiểm sau, chả ai trả tiền cho độ nguy hiểm vãi đạn này).

RESTful Web Service?

Một web service là một tập hợp các giao thức và chuẩn được sử dụng cho mục đích tương tác dữ liệu giữa các ứng dụng bất kỳ và hệ thống. Các ứng dụng phần mềm được viết bởi các ngôn ngữ khác nhau và chạy bởi các nền tảng khác nhau có thể sử dụng web service để trao đổi dữ liệu qua mạng máy tính như internet theo các cách tương tự như trao đổi trên một máy tính (Là viết 1 lần mà sài mọi nơi đó các Thím, Ví dụ viết bên Linux cấu hình service chạy xong thì bất kỳ chỗ nào cũng tương tác được tới nó mà không cần coding lại phần Service).

Web service dựa trên các kiến trúc REST được biết như RESTful webservice . Những webservice này sử dụng các phương thức HTTP để triển khai các định nghĩa kiến trúc REST. Một RESTful web service thường được định nghĩa một URI (kiểu như đường dẫn), Uniform Resource Identifier như một service.

OK, bây giờ Ta tạo 1 Project nho nhỏ để tạo 1 Web RESTful bằng NodeJS nha, nó đơn giản chỉ là hiển thị danh sách dữ liệu trong file Json thôi.

Ta đặt tên Project này là: NodejsRestfulSampleJSon:

Và ta sẽ dùng thư viện Express nên ta đưa nào vào Project này như sau (bấm chuột phải vào npm/ chọn Install New npm Package):

Sau đó tìm : Express rồi chọn Express như hình dưới

Bấm Install Package để cài đặt:

Thấy nó hiển thị express-generator như trên là thành công.

Tiếp theo ta tạo 1 file dữ liệu bằng json như sau (bấm chuột phải chọn new item rồi tìm tới Json, hoặc dán cái file Tui cung cấp ở dưới vào đây là xong):

product.json:

[code language="json"]

[
{
"Ma": "course1",
"Ten": "Lập trình Java cơ bản",
"Link": "https://communityuni.com/Home/JavaToanTap"
},
{
"Ma": "course2",
"Ten": "Lập trình LINQ",
"Link": "https://communityuni.com/Home/LINQ"
},
{
"Ma": "course3",
"Ten": "Lập trình Webservice RESTful",
"Link": "https://communityuni.com/Home/WebService"
},
{
"Ma": "course4",
"Ten": "Lập trình Android",
"Link": "https://communityuni.com/Home/Android"
}
]

[/code]

Tiếp tục sửa coding của server.js thành:

[code language="javascript"]

var express = require('express');
var app = express();
var fs = require("fs");
var port = process.env.PORT;

app.get('/products', function (req, res) {
fs.readFile(__dirname + "/" + "product.json", 'utf8', function (err, data) {
console.log(data);
res.end(data);
});
})

var server = app.listen(port, function () {

var host = server.address().address
var port = server.address().port

console.log("Example app listening at http://%s:%s", host, port)

})

[/code]

Nhấn F5 để chạy, rồi Gõ URI sau vào trình duyệt bất kỳ (http://localhost:1337/products), kết quả:

Như vậy các bạn đã biết cách sử dụng express, nodejs để viết RESTful cho 1 ví dụ về get lấy danh sách Product trong 1 file Json (có nhiều thư viện, hoặc không cần dùng thư viện cũng được, các bạn có thể tìm thêm trên Google).

Source code ví dụ mẫu lấy danh sách Product thì file JSON, tải ở đây.

Bài sau Tui sẽ hướng dẫn các Thím cách coding với HTTPOST, HTTPGET, HTTPPUT, HTTPDELETE để tương tác dữ liệu MongoDB trong NodeJS như thế nào. Các Thím chú ý theo dõi nhé

Các khóa học online khác, bạn có thể tham khảo tại đây: https://unica.vn/?aff=11929

Chúc các bạn thành công!

Bài 21-Cách cấu hình IISNode Web Server cho NodeJS

Trong bài 20, các Thím đã biết cách tạo 1 Project “HelloWorld” trong Visual Studio như thế nào rồi. Vấn đề là làm thế nào để NodeJS có thể chạy tự động 24/7 mà không cần có Visual Studio? Có rất nhiều cách làm. Ở đây Tui hướng dẫn các Thím cài đặt IISNode Web Server (Ta không bàn luận về điểm tốt và xấu của IISNode)

OK, bây giờ ta mở lại Project HelloWorld, và thêm 1 Javascript tên là: Help.js

bấm chuột phải chọn Add/ chọn new Item

Cửa sổ new item hiển thị ra:

Chọn JavaScript, đặt tên là Help.js rồi nhấn Add:

Nhập mã lệnh cho Help.js như dưới đây:

[code language="javascript"]

'use strict';
var http = require('http');
var port = process.env.PORT;

http.createServer(function (req, res) {
res.writeHead(200, { 'Content-Type': 'text/html;charset=utf-8' });
var str = 'Đây là màn hình <font color="red">hướng dẫn sử dụng</font>\n'
+ '<br/>'
+ 'Muốn học lập trình chuyên nghiệp, vào:'
+'<a href = "http://communityuni.com"> http://communityuni.com</a>'
res.end(str)
}).listen(port);

[/code]

Để cho Help.js chạy trước ta bấm chuột phải vào Help.js chọn Set as Node.js Startup File. Nhấn F5 sẽ chạy file Help.js này, kết quả:

Chú ý dòng lệnh:

res.writeHead(200, { ‘Content-Type’: ‘text/html; charset=utf-8’ });

Dùng để hiển thị nội dung là HTML và có dấu Tiếng Việt.

Tuy nhiên đây mới chỉ là chạy trong công cụ lập trình, ta cần cấu hình Webserver để chạy Available 24/7. Nó dẫn tới 2 vấn đề:

Vấn đề 1: Phải cấu hình Web.config chỉ định các file JS tham gia dịch vụ

Vần đề 2: Cài đặt Webserver cho nó chạy, ở đây lựa chọn IISNode

Để tạo Web.config ta bấm chuột phải vào Project/ chọn New File:

màn hình New File hiển thị, đặt tên web.config:

Bấm OK để tạo file, Nhập coding cho file web.config như dưới đây:

[code language="xml"]

<configuration>
<system.webServer>
<handlers>
<add name="iisnode1" path="server.js" verb="*" modules="iisnode"/>
<add name="iisnode2" path="help.js" verb="*" modules="iisnode"/>
</handlers>
</system.webServer>
</configuration>

[/code]

Các bạn chỉ cần đổi path thành tên file Javascript mà bạn tạo trong Project là được (ở trên các bạn thấy có server.jshelp.js vì đây trong Project này tui có nó, còn của bạn có sao thì sài vậy nha).

Tiếp theo Để cài đặt Webserver IIS Node ta vào link sau: https://github.com/tjanczuk/iisnode/releases

Tải iisnode-full-v02.21-x64.msi và cài đặt

Bấm install và đợi 1 xí là xong:

Cài xong ta có :

Trong Program Feature:

Như vậy đã cài đặt xong khá đơn giản, Bước tiếp theo là cấu hình IIS (bạn cần phải đọc bài này để biết cách setup IIS Server trước nha), sau đó:

Mở IIS Manager lên:

Bấm chuột phải vào Default Website / chọn Add Application…:

Alias: Đặt là communityuni

Physical path: trỏ tới đường dẫn lưu Project HelloWorld của bạn (tới đường dẫn cuối cùng lưu help.js)

Bấm OK để tạo Website chạy 24/7, ta có:

Chạy lên ta được:

http://localhost/communityuni/help.js

http://localhost/communityuni/server.js

Như vậy là ta đã cấu hình IISNode WebServer thành công

Kiểm tra thêm Project, Nó tự động tạo thư mục iisnode trong chỗ coding:

Như vậy các bạn đã biết cách cấu hình WebServer IISNode cho NodeJS, thử nghiệm và chạy thành công không cần mở Visual Studio, giờ nó đã chạy 24/7.

Source code HelloWorld cho phần cập nhật help.js các bạn tải tại đây.

Bài sau Tui sẽ hướng dẫn các Thím cách coding với HTTPOST, HTTPGET để tương tác dữ liệu MongoDB trong NodeJS như thế nào. Các Thím chú ý theo dõi nhé

Các khóa học online khác, bạn có thể tham khảo tại đây: https://unica.vn/?aff=11929

Chúc các bạn thành công!

Bài 20-Các công cụ dùng để lập trình NodeJS

Ta đã cài đặt NodeJS thành công rồi, vấn đề là ta lập trình NodeJS như thế nào?

Có rất nhiều tool hỗ trợ lập trình NodeJS, bạn thích lựa chọn Tool nào cũng được

Vì Tui ghiền Bill Gate nên Tui sẽ chọn Visual Studio (thời điểm Tui hướng dẫn là dùng Visual Studio mới nhất, phiên bản Visual Studio 2017), các bạn có thể chọn 1 trong 16 loại dưới đây để lập trình NodeJS chẳng hạn như PM2.

Bài học này sẽ có 3 phần

Phần 1- Giới thiệu 16 công cụ lập trình với NodeJS

Phần 2- Cách cấu hình để lập trình NodeJS trong Visual Studio 2017

Phần 3- Tạo Project NodeJS HelloWorld trong Visual Studio

Chi tiết phần 1 (giới thiệu 16 công cụ lập trình NodeJS):

#1 Visual Studio

#2Mocha.js (https://mochajs.org/)

#3Chai (http://www.chaijs.com/)

#4)Sinon.JS (http://sinonjs.org/)

#5Express.js(http://expressjs.com/)

#6 WebStrom IDE (https://www.jetbrains.com/webstorm/)

#7 Passport.js  (http://www.passportjs.org/)

#8Socket.io (https://socket.io/)

#9Webpack(https://webpack.github.io/)

#10BlueBird.js (http://bluebirdjs.com)

#11 PM2 (http://pm2.keymetrics.io/)

#12 Electrode.io(http://www.electrode.io/)

#13 Meteor.js (https://www.meteor.com/)

#14 Vue.js (https://vuejs.org/)

#15MEAN.JS (http://meanjs.org/)

#16 Babel (https://babeljs.io/)

Phần 2- Cách cấu hình để lập trình NodeJS trong Visual Studio 2017

Ta sẽ dùng chính Visual Studio để lập trình NodeJS(dĩ nhiên có rất nhiều công cụ khác để lập trình, nhưng để tiện lợi gom về một mối ta sẽ dùng Visual).
Trong quá trình cài Visual ta checked vào NodeJS Development:

Phần 3- Tạo Project NodeJS HelloWorld trong Visual Studio

Cài đặt thành công lúc new Project ta thấy trong nhóm Javascript có Node.Js, ta chọn Blank Node.js Web application (Vì các dự án bên mình dùng private Web service):

Đặt tên Project là HelloWorld, chọn nơi lưu trữ rồi bấm OK: File Server.js sẽ mặc định được tạo ra và xuất hiện dòng chữ Hello World:


[code language=”javascript”]

‘use strict’;
var http = require(‘http’);
var port = process.env.PORT || 1337;

http.createServer(function (req, res) {
res.writeHead(200, { ‘Content-Type’: ‘text/plain’ });
res.end(‘Hello World\n’);
}).listen(port);

[/code]
Để thiết lập file nào chạy trước, ta bấm chuột phải vào file JS đó rồi chọn Set as Node.js Startup File:

Nhấn F5 để chạy phần mềm, kết quả:

Như vậy các bạn đã có cái nhìn tổng quan về việc lựa chọn Công cụ lập trình NodeJS, đặc biệt biết cách cấu hình Visual Studio 2017 để lập trình NodeJS thông qua ví dụ HelloWorld như thế nào. Bài Sau Tui sẽ hướng dẫn các bạn cách thức cấu hình WebServer IISNode để chạy NodeJS HelloWorld như thế nào. Các bạn chú ý theo dõi nhé.

Source code HelloWorld các bạn tải tại đây.

Các khóa học online khác, bạn có thể tham khảo tại đây: https://unica.vn/?aff=11929

Chúc các bạn thành công!

Bài 19-Cách tải và cài đặt NodeJS

Bài 18 Tui đã giới thiệu cơ bản về NodeJS rồi, Trong bài này Tui sẽ hướng dẫn các bạn thực hiện các nội dung sau:

1) Cách tải NodeJS

2) Cách cài đặt NodeJS trên Windows

3) Cách cài đặt Driver MongoDB cho NodeJS

Ta tiến hành từng bước như sau:

1) Cách tải NodeJS

Để tải NodeJS ta vào https://nodejs.org/en/download/, chọn phiên bản Windows để tải về

Tính tới thời điểm hiện tại Tui viết hướng dẫn này (ngày 22/06/2018) thì phiên bản NodeJS là “node-v8.11.3-x64

Tải về  và cài đặt:

2) Cách cài đặt NodeJS trên Windows

Double -click vào node-v8.11.3-x64.msi để cài đặt:

Nếu nó có hỏi gì về Security như màn hình ở trên, thì cứ bấm Run để cài đặt:

Sau khi NodeJS ra màn hình ở trên, ta bấm Next để tiếp tục cài đặt:

Check vào “I accept the terms in the License Agreement” rồi bấm Next

Chọn nơi cài đặt (nên để mặc định như vậy), bấm Next để tiếp tục:

Tiếp tục bấm Next:

Bấm Install để tiến hành cài đặt phần mềm NodeJS.

Chờ chương trình cài đặt cho xong, khi nào thấy cửa sổ như dưới đây là hoàn tất quá trình cài đặt:

3) Cách cài đặt Driver MongoDB cho NodeJS

Ta cần cài đặt Driver MongoDB cho NodeJS bằng cách mở cửa sổ Command Line rồi gõ lệnh dưới đây:

npm install mongodb save

Như vậy Tui đã hướng dẫn xong bài tải và cài đặt NodeJS. Bài học Sau Tui sẽ hướng dẫn các bạn Cách lập trình NodeJS trong Microsoft Visual Studio như thế nào. Các bạn chú ý theo dõi nhé.

Các khóa học online khác, bạn có thể tham khảo tại đây: https://unica.vn/?aff=11929

Chúc các bạn thành công!

Bài 18-Giới thiệu cơ bản về NodeJS

Như vậy ta đã xong chuỗi 17 bài hướng dẫn cách tương tác C# WPF, Android Kotlin với MongoDB. Từ bài này Tui sẽ hướng dẫn các bước sử dụng NodeJS cũng như lập trình Web API RestFul với NodeJS, cách tương tác từ Android Kotlin tới MongoDB thông qua Web API này.

Tui phác thảo đại ra cái mô hình này cho các bạn dễ tưởng tượng ra công việc trong chuỗi các bài học tiếp theo này nha:

Ở hình trên ta sẽ xây dựng NodeJS thành Web API Restful, các nền tảng khác có thể truy suất tới MongoDB thông qua các API này.

Nhiệm vụ của NodeJS: Sẽ là Framework trung gian, lắng nghe mọi yêu cầu tương tác từ các thiết bị như: Desktop PC, Laptop, Mobile, Tablet… và móc nối lấy dữ liệu trong MongoDB.

Cái hay của Web API là ta chỉ cần xây dựng 1 lần thôi, tất cả các nền tảng khác đều có thể tái sử dụng được.

Bài này Tui giới thiệu sơ lược về NodeJS là gì? đặc điểm của nó ra sao, nó có các thành phần gì, các lợi ích đem lại cho các nhà triển khai…Bài tiếp theo Tui sẽ hướng dẫn cài tải, cài đặt và cấu hình Webserver cho nó…

Các bạn lưu ý là những lý thuyết về NodeJS là không đổi, và ta dễ dàng tìm thấy nó trên mạng. Chỉ cần vào Google Enter 1 cái là nó ra 1 nùi. Nên các bạn không cần thắc mắc tại sao có nhiều trang mà lý thuyết nó cứ lặp lại. Và các bạn cũng có thể bỏ qua bài lý thuyết cơ bản này nha:

NodeJS là gì?

  • NodeJS là một nền tảng Server Side mã nguồn mở, nhớ không lầm thì Node.js được phát triển bởi Ryan Dahl năm 2009
  • NodeJS hoàn toàn miễn phí (lưu ý nhiều người hiểu nhầm cứ mã nguồn mở là miễn phí, không phải nguồn mở nào cũng miễn phí đâu nha, và còn có nhiều yếu tố liên quan tới giấy phép mã nguồn mở)
  • Có thể chạy trên nhiều nền tảng hệ điều hành khác nhau: Windows, Linux, Mac, Unix,… Tạo nên sự vô cùng linh động cho nhà phát triển, dễ dàng lựa chọn nền tảng để triển khai
  • NodeJS được xây dựng trên Javascript engine, chạy phía Server

NodeJS làm được những gì?

  • NodeJS có thể tạo nội dung trang động (biết trang động là trang gì hem?)
  • NodeJS rất bá đạo, nó có thể: Tạo, mở, đọc, ghi, xóa và đóng tập tin ngay trên máy chủ
  • NodeJS nó có thể thu thập được dữ liệu
  • NodeJS có thể truy vấn, thêm, sửa, xóa dữ liệu trong nhiều hệ Cơ sở dữ liệu như: MySql, MongoDB, Microsoft SQL Server, PostgreSQL.
  • và nhiều khả năng khác nữa, tự mò thêm trên https://nodejs.org/ nha.

NodeJs thường được sử dụng ở đâu?

  • Các ứng dụng về I/O
  • Các ứng dựng về luồng dữ liệu
  • Các ứng dụng về dữ liệu hướng đến thời gian thực
  • Các ứng dụng liên quan tới AJAX
  • Các ứng dụng liên quan tới MySQL, MongoDB…
  • Các ứng dụng dựa vào JSON APIs
  • Các ứng dụng Single Page Application
  • Các ứng dụng liên quan tới Commandline tool để chạy javascript..

NodeJS có những thành phần nào?

Xem hình dưới đây để thấy các thành phần quan trọng trong NodeJS nha (nguồn Tutorialspoint)

chi tiết các thành phần các bạn xem tại đây: Link bài giảng Nodejs bằng English

NodeJS cài đặt và lập trình như thế nào?

  • Xem bài học tiếp theo nha các Thím.

Như vậy Tui đã giới thiệu sơ lược xong về NodeJS. Bài học Sau Tui sẽ hướng dẫn các bạn Cách tải và cài đặt NodeJS lên máy tính sử dụng Windows như thế nào. Các bạn chú ý theo dõi nhé.

Các khóa học online khác, bạn có thể tham khảo tại đây: https://unica.vn/?aff=11929

Chúc các bạn thành công!

Bài 17-Xóa dữ liệu MongoDB trong Android Kotlin

Chúc mừng các bạn đã lết được tới bài cuối cùng trong chuỗi bài hướng dẫn tương tác MongoDB trong Android Kotlin, ta đã biết xem, thêm, sửa và giờ là thao tác Xóa. Kết thúc bài này ta đã hoàn thành sứ mệnh CRUD, tập các nghiệp vụ thiết yếu phải có trong các phần mềm quản lý liên quan tới CSDL.

Tương tự như bài 16, Tui di chuyển quán Cafe khác nha, lần này IP của máy Tui là:  192.168.1.137, các Thím nhớ cấu hình lại file mongodb.cfg và chạy lại Service như Tui đã nhắc nhở trong bài 14 nha.

Kết thúc bài hướng dẫn này bạn phải làm được giao diện Xóa  như sau:

Nhấn vào biểu tượng thùng rác để xóa.

Coding xóa 1 Product khỏi MongoDB trong Android Kotlin ta làm như sau:

[code language=”java”]
try {
var connectionString = MongoClientURI(“mongodb://192.168.1.137:27017”)
var mongoClient = MongoClient(connectionString)
var database = mongoClient.getDatabase(“QuanLySanPham”)
var collection = database.getCollection(“Product”)
var filter = Filters.eq(“Ma”, “P1”)
collection.deleteOne(filter)
} catch (ex: Exception) {
Log.e(“LOI”, ex.toString())
}
[/code]

Coding ở trên ta xóa Product có mà là P1 (tìm nó trước dùng lệnh eq), dùng lệnh deleteOne để xóa.

Chi tiết:

Mở lại Project đã làm ở bài trước. Để làm hiển thị được dữ liệu dạng Custom layout như vậy ta sẽ kế thừa ArrayAdapter để hiệu chỉnh giao diện như ý muốn. Trước tiên ta cần tạo một layout custom cho từng dòng ở trên.

Ta tạo 1 file layout tên là : item.xml (bấm chuột phải vào layout/ chọn new/ chọn Layout resource file:

mongodb117.PNG

Đặt tên item, LinearLayout rồi bấm OK:

mongodb118.PNG

thiết kế layout như sau:

mongodb107.PNG

đây là file XML của item.xml:

[code language=”xml”]
<?xml version=”1.0″ encoding=”utf-8″?>
<LinearLayout xmlns:app=”http://schemas.android.com/apk/res-auto”
android:orientation=”vertical”
xmlns:android=”http://schemas.android.com/apk/res/android” android:layout_width=”match_parent”
android:layout_height=”match_parent”>

<TextView
android:id=”@+id/txtMa”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:text=”TextView”
android:textColor=”@color/mauchuma”
android:textSize=”20sp” />

<TextView
android:id=”@+id/txtTen”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:text=”TextView”
android:textColor=”@color/mauchuten”
android:textSize=”20sp” />

<TextView
android:id=”@+id/txtDonGia”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:text=”TextView”
android:textColor=”@color/mauchudongia” />

<LinearLayout
android:layout_width=”match_parent”
android:layout_height=”match_parent”
android:orientation=”horizontal”>

<ImageView
android:id=”@+id/imgEdit”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
app:srcCompat=”@drawable/editproduct” />

<ImageView
android:id=”@+id/imgDelete”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
app:srcCompat=”@drawable/deleteproduct” />
</LinearLayout>

</LinearLayout>
[/code]

Tiếp theo ta tạo thêm package tên là adapter như sau (bấm chuột phải vào java/ chọn new/ chọn package):

mongodb108.PNG

Đặt tên package như sau (tùy bạn tạo ở Project):

mongodb109.PNG

Bấm OK để xem kết quả:

mongodb110.PNG

Tiếp tục ta tạo 1 lớp tên là ProductAdapter nằm bên trong package adapter:

mongodb111.PNG

Bấm chuột phải vào adapter/ chọn New/ chọn Kotlin File/Class:

mongodb112.PNG

Name: Đặt tên là ProductAdapter

Kind: Chọn class

Bấm OK để tạo:

[code language=”java”]
package com.communityuni.adapter

class ProductAdapter {
}
[/code]

Tiến hành kết thừa và coding cho Lớp này như sau:

[code language=”java”]
package com.communityuni.adapter

import android.app.Activity
import android.content.Context
import android.os.AsyncTask
import android.util.Log
import android.view.View
import android.view.ViewGroup
import android.widget.ArrayAdapter
import android.widget.ImageView
import android.widget.TextView
import com.communityuni.androidkotlintomongodb.R
import com.communityuni.model.Product
import com.mongodb.MongoClient
import com.mongodb.client.model.Filters
import org.bson.conversions.Bson
import com.mongodb.client.MongoCollection
import com.mongodb.client.MongoDatabase
import com.mongodb.MongoClientURI

class ProductAdapter(internal var context: Activity, internal var resource: Int) : ArrayAdapter(context, resource) {

override fun getView(position: Int, convertView: View?, parent: ViewGroup): View {
var custom = context.layoutInflater.inflate(resource, null)
var txtMa = custom.findViewById(R.id.txtMa)
var txtTen = custom.findViewById(R.id.txtTen)
var txtDonGia = custom.findViewById(R.id.txtDonGia)
var p = getItem(position)
txtMa.text = p!!.Ma
txtTen.text = p.Ten
txtDonGia.text = p.DonGia.toString()
var img=custom.findViewById(R.id.imgDelete)
img.setOnClickListener { xuLyXoa(p) }
return custom
}
private fun xuLyXoa(p: Product?) {

}
}
[/code]

OK, như vậy là ta đã làm xong lớp ProductAdapter, nó sẽ có nhiệm vụ vẽ giao diện danh sách Product như ý muốn.

bây giờ ta tạo 1 Activity tên là XoaProductActivity

mongodb113.PNG

Bấm chuột phải vào Package có chứa MainActivity/ chọn New/ chọn Activity/ chọn EmptyActivity:

mongodb114.PNG

Đặt tên là XoaProductActivity rồi bấm Finish, xem cấu trúc sau khi bấm Finish:

mongodb115.PNG

Bây giờ ta sẽ thiết kế giao diện cho màn hình XoaProductActivity (mở file activity_xoa_product.xml), chỉ cần kéo 1  ListView ra là xong:

mongodb119.PNG

Layout XML cho màn hình xóa (activity_xoa_product.xml):

[code language=”xml”]
<?xml version=”1.0″ encoding=”utf-8″?>
<LinearLayout xmlns:android=”http://schemas.android.com/apk/res/android”
xmlns:app=”http://schemas.android.com/apk/res-auto”
xmlns:tools=”http://schemas.android.com/tools”
android:orientation=”vertical”
android:layout_width=”match_parent”
android:layout_height=”match_parent”
tools:context=”.XoaProductActivity”>

<ListView
android:id=”@+id/lvProduct”
android:layout_width=”match_parent”
android:layout_height=”match_parent” />
</LinearLayout>

[/code]

Mở Lớp XoaProductActivity lên để coding xóa:

[code language=”java”]
package com.communityuni.androidkotlintomongodb

import android.os.AsyncTask
import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import android.widget.ListView
import com.communityuni.adapter.ProductAdapter
import com.communityuni.model.Product
import com.mongodb.MongoClient
import com.mongodb.MongoClientURI
import org.json.JSONObject

class XoaProductActivity : AppCompatActivity() {
lateinit var lvProduct: ListView
lateinit var adapter: ProductAdapter
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_xoa_product)
addControls()
viewListProduct()
}
private fun viewListProduct() {
var task= ProductTask()
task.execute()
}
private fun addControls() {
lvProduct=findViewById(R.id.lvProduct)
adapter =ProductAdapter(this,R.layout.item)
lvProduct.adapter=adapter
}
inner class ProductTask : AsyncTask<Any, Any, List>() {
override fun onPreExecute() {
super.onPreExecute()
adapter.clear()
}
override fun doInBackground(vararg p0: Any?): List {
var connectionString = MongoClientURI(“mongodb://192.168.1.137:27017”)
var mongoClient = MongoClient(connectionString)
var database = mongoClient.getDatabase(“QuanLySanPham”)
val collection = database.getCollection(“Product”)

var cursor = collection.find().iterator()
var dsProduct = ArrayList()
try {
while (cursor.hasNext()) {
val data = cursor.next().toJson()
val jsonObject = JSONObject(data)
val ma = jsonObject.getString(“Ma”)
val ten = jsonObject.getString(“Ten”)
val gia = jsonObject.getDouble(“DonGia”)
var product=Product(ma,ten,gia)
dsProduct.add(product)
}
} finally {
cursor.close()
}
return dsProduct
}
override fun onPostExecute(result: List?) {
super.onPostExecute(result)
adapter.addAll(result)
}
}
}
[/code]

Trong màn hình MainActivity gọi lệnh mở màn hình XoaProductActivity để xem danh sách theo dạng CustomLayout:

[code language=”java”]
fun xoaProduct(view:View)
{
var intent= Intent(this,XoaProductActivity::class.java)
startActivity(intent)
}
[/code]

Chạy lên ta có kết quả:

mongodb120.PNG

Bây giờ ta sẽ xử lý khi người dùng bấm vào nút biểu tượng thùng rác để Xóa, ta mở lại ProductAdapter và bổ sung thêm inner class TaskDelete (coding Xóa):

[code language=”java”]
package com.communityuni.adapter

import android.app.Activity
import android.content.Context
import android.os.AsyncTask
import android.util.Log
import android.view.View
import android.view.ViewGroup
import android.widget.ArrayAdapter
import android.widget.ImageView
import android.widget.TextView
import com.communityuni.androidkotlintomongodb.R
import com.communityuni.model.Product
import com.mongodb.MongoClient
import com.mongodb.client.model.Filters
import org.bson.conversions.Bson
import com.mongodb.client.MongoCollection
import com.mongodb.client.MongoDatabase
import com.mongodb.MongoClientURI

class ProductAdapter(internal var context: Activity, internal var resource: Int) : ArrayAdapter(context, resource) {

override fun getView(position: Int, convertView: View?, parent: ViewGroup): View {
var custom = context.layoutInflater.inflate(resource, null)
var txtMa = custom.findViewById(R.id.txtMa)
var txtTen = custom.findViewById(R.id.txtTen)
var txtDonGia = custom.findViewById(R.id.txtDonGia)
var p = getItem(position)
txtMa.text = p!!.Ma
txtTen.text = p.Ten
txtDonGia.text = p.DonGia.toString()
var img=custom.findViewById(R.id.imgDelete)
img.setOnClickListener { xuLyXoa(p) }
return custom
}
private fun xuLyXoa(p: Product?) {
TaskDelete().execute(p)
}
private fun removeProduct(p:Product?)
{
remove(p)
}
inner class TaskDelete:AsyncTask()
{
override fun doInBackground(vararg p0: Product?): Boolean {
try {
var p=p0[0]
var connectionString = MongoClientURI(“mongodb://192.168.1.137:27017”)
var mongoClient = MongoClient(connectionString)
var database = mongoClient.getDatabase(“QuanLySanPham”)
val collection = database.getCollection(“Product”)
val filter = Filters.eq(“Ma”,p?.Ma)
collection.deleteOne(filter)

removeProduct(p)
return true
}
catch (e:Exception)
{
Log.e(“LOI”,e.toString())
}
return false
}
override fun onPostExecute(result: Boolean?) {
super.onPostExecute(result)
}
}
}
[/code]

Chạy lên ta sẽ được kết quả như mong muốn.

Các bạn có thể tải source code đầy đủ ở đây: Source code xóa dữ liệu MongoDB trong Android Kotlin.

Bài học Sau Tui sẽ hướng dẫn các bạn các kỹ thuật tương tác dữ liệu MongoDB với NodeJS

Các khóa học online khác, bạn có thể tham khảo tại đây:

https://unica.vn/?aff=11929

Chúc các bạn thành công!

Bài 16-Sửa dữ liệu MongoDB trong Android Kotlin

Như vậy bạn đã biết cách truy xuất và thêm mới dữ liệu vào MongoDB trong Android Kotlin, bài này ta tiếp tục với phần chỉnh sửa dữ liệu. Tương tự như bài 15, Tui di chuyển quán Cafe khác nha, lần này IP của máy Tui là:  172.16.96.86, các Thím nhớ cấu hình lại file mongodb.cfg và chạy lại Service như Tui đã nhắc nhở trong bài 14 nha.

Nếu IP mà bị đổi mà các bạn không cấu hình và chạy lại Service thì khóc ra tiếng Miên MongoDB cũng không thể nào hoạt động được.

Ta tiếp tục mở lại Project trong bài 15 nha, Kết thúc bài học này thím phải làm được giao diện như sau:

Ta cần tạo một màn hình chỉnh sửa dữ liệu, màn hình này sẽ có 2 chức năng: Tìm kiếm Product theo Mã và Cho phép cập nhật dữ liệu (nhìn màn hình điện thoại thứ nhất).

Xem cấu trúc mới sau khi làm chức năng sửa:

Ta tạo một Activity tên là : SuaProductActivity, XML layout như sau:

[code language=”xml”]
<?xml version=”1.0″ encoding=”utf-8″?>
<LinearLayout xmlns:android=”http://schemas.android.com/apk/res/android”
xmlns:app=”http://schemas.android.com/apk/res-auto”
xmlns:tools=”http://schemas.android.com/tools”
android:orientation=”vertical”
android:layout_width=”match_parent”
android:layout_height=”match_parent”
tools:context=”.SuaProductActivity”>

<TextView
android:id=”@+id/textView4″
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:text=”Nhập mã tìm kiếm:”
android:background=”@color/maunentieude”
android:textColor=”@color/mauchutieude”
android:textSize=”20sp” />

<EditText
android:id=”@+id/edtMaTim”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:ems=”10″
android:inputType=”textPersonName” />

<Button
android:onClick=”xuLyTimProduct”
android:id=”@+id/btnTim”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:text=”Tìm” />

<TextView
android:id=”@+id/textView5″
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:text=”Mã Product:”
android:background=”@color/maunentieude”
android:textColor=”@color/mauchutieude”
android:textSize=”20sp” />

<EditText
android:id=”@+id/edtMa”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:ems=”10″
android:inputType=”textPersonName” />

<TextView
android:id=”@+id/textView6″
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:text=”Tên Product:”
android:background=”@color/maunentieude”
android:textColor=”@color/mauchutieude”
android:textSize=”20sp” />

<EditText
android:id=”@+id/edtTen”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:ems=”10″
android:inputType=”textPersonName” />

<TextView
android:id=”@+id/textView7″
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:text=”Đơn giá:”
android:background=”@color/maunentieude”
android:textColor=”@color/mauchutieude”
android:textSize=”20sp” />

<EditText
android:id=”@+id/edtDonGia”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:ems=”10″
android:inputType=”numberDecimal”
android:text=”” />

<Button
android:onClick=”xuLySuaProduct”
android:id=”@+id/btnCapNhat”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:text=”Cập nhật Product” />
</LinearLayout>
[/code]

Phần Coding trong màn hình SuaProductActivity ta phải sử dụng 2 AsyncTask: Cho Tìm Kiếm và cho phần Chỉnh sửa.

Dữ liệu mới nhất Product.json bạn có thể tải tại đây

Để tìm kiếm Product theo mã (trên giao diện bạn thấy Tui để phần tìm kiếm đó):

[code language=”java”]
var connectionString = MongoClientURI(“mongodb://172.16.96.86:27017”)
var mongoClient = MongoClient(connectionString)

var database = mongoClient.getDatabase(“QuanLySanPham”)
var collection = database.getCollection(“Product”)
var filter = Filters.eq(“Ma”, “p999”)
var cursor = collection.find(filter).first()
if(cursor==null)
return null
var data = cursor.toJson()
var jsonObject = JSONObject(data)
var ma = jsonObject.getString(“Ma”)
var ten = jsonObject.getString(“Ten”)
var gia = jsonObject.getDouble(“DonGia”)
[/code]

Coding ở trên là tìm Product có mã p999 nha các Thím. Nếu tìm thấy thì ta đưa về Json để móc nối lấy ra được giá trị của các thuộc tính: Ma, Ten, DonGia (xem coding ở trên)

Coding chỉnh sửa ta làm như sau:

[code language=”java”]
var connectionString = MongoClientURI(“mongodb://172.16.96.86:27017”)
var mongoClient = MongoClient(connectionString)

var database = mongoClient.getDatabase(“QuanLySanPham”)
var collection = database.getCollection(“Product”)
var filter = Filters.eq(“Ma”, “p999”)
var editDoc = Document(“\$set”,
Document(“DonGia”, 325)
.append(“Ten”, “Thuốc trị hôi nách Campuchia”))
var ret:UpdateResult = collection.updateOne(filter, editDoc)
return ret.modifiedCount>0
[/code]

Để chỉnh sửa, thì ta tìm ra Sản Phẩm có mã p999 trước, sau khi tìm kiếm được rồi ta đưa vào Document(“\$set“…) ở trên. Muốn đổi giá trịcuar thuộc tính nào thì cứ đưa vào Document ở đối số thứ 2, các thuộc tính tiếp theo đưa vào append.

lệnh ret.modifiedCount trả về số phần tử bị thay đổi. Tui so sánh với >0 để cho ra true, false thôi không có gì. Muốn dùng true false thì viết như Tui ở trên, còn không thì cứ để giá trị đó là biết ngay thanh công hay thất bại.

Coding chi tiết của lớp này SuaProductActivity nè:

[code language=”java”]
package com.communityuni.androidkotlintomongodb

import android.os.AsyncTask
import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import android.util.Log
import android.view.View
import android.widget.EditText
import android.widget.Toast
import com.communityuni.model.Product
import com.mongodb.MongoClient
import org.json.JSONObject
import com.mongodb.client.model.Filters
import com.mongodb.MongoClientURI
import com.mongodb.client.result.UpdateResult
import org.bson.Document

class SuaProductActivity : AppCompatActivity() {
lateinit var edtMaTim:EditText
lateinit var edtMa:EditText
lateinit var edtTen:EditText
lateinit var edtDonGia:EditText
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_sua_product)
addControls()
}
private fun addControls() {
edtMaTim=findViewById(R.id.edtMaTim)
edtMa=findViewById(R.id.edtMa)
edtTen=findViewById(R.id.edtTen)
edtDonGia=findViewById(R.id.edtDonGia)
}
fun xuLyTimProduct(view:View)
{
var maTim:String=edtMaTim.text.toString()
TimProducTask().execute(maTim)
}
inner class TimProducTask:AsyncTask<String,Void,Product?>()
{
override fun doInBackground(vararg p0: String?): Product? {
var product:Product?=null
try {
var connectionString = MongoClientURI(“mongodb://172.16.96.86:27017”)
var mongoClient = MongoClient(connectionString)

var database = mongoClient.getDatabase(“QuanLySanPham”)
var collection = database.getCollection(“Product”)
var filter = Filters.eq(“Ma”, p0[0])
var cursor = collection.find(filter).first()
if(cursor==null)
return null
var data = cursor.toJson()
var jsonObject = JSONObject(data)
var ma = jsonObject.getString(“Ma”)
var ten = jsonObject.getString(“Ten”)
var gia = jsonObject.getDouble(“DonGia”)
product=Product(ma,ten,gia)
} catch (ex: Exception) {
Log.e(“LOI”, ex.toString())
}
return product
}
override fun onPostExecute(result: Product?) {
super.onPostExecute(result)
if(result!=null) {
edtMa.setText(result.Ma)
edtTen.setText(result.Ten)
edtDonGia.setText(result.DonGia.toString())
}
else
{
Toast.makeText(
applicationContext,”Ko tìm thấy”,Toast.LENGTH_LONG
).show()
}
}
}
fun xuLySuaProduct(view:View)
{
var p:Product= Product(edtMa.text.toString(),edtTen.text.toString(),edtDonGia.text.toString().toDouble())
SuaProductTask().execute(p)
}
inner class SuaProductTask : AsyncTask<Product,Void,Boolean>()
{
override fun doInBackground(vararg p0: Product?): Boolean {
try {
var p:Product?=p0[0]
if(p==null)return false
var connectionString = MongoClientURI(“mongodb://172.16.96.86:27017”)
var mongoClient = MongoClient(connectionString)

var database = mongoClient.getDatabase(“QuanLySanPham”)
var collection = database.getCollection(“Product”)
var filter = Filters.eq(“Ma”, p.Ma)
var editDoc = Document(“\$set”,
Document(“DonGia”, p.DonGia)
.append(“Ten”, p.Ten))
var ret:UpdateResult = collection.updateOne(filter, editDoc)
return ret.modifiedCount>0
} catch (ex: Exception) {
Log.e(“LOI”, ex.toString())
}
return false
}

override fun onPostExecute(result: Boolean?) {
super.onPostExecute(result)
if(result==true)
{
Toast.makeText(applicationContext,”Sửa Product thành công”,Toast.LENGTH_LONG).show()
}
else
{
Toast.makeText(applicationContext,”Sửa Product thất bại”,Toast.LENGTH_LONG).show()
}
}
}
}
[/code]

Trong MainActivity ta bổ sung thêm sự kiện mở SuaProductActivity:

[code language=”java”]
fun suaProduct(view:View)
{
var intent= Intent(this,SuaProductActivity::class.java)
startActivity(intent)
}
[/code]

Chạy lên ta sẽ được kết quả như mong muốn.

Các bạn có thể tải source code đầy đủ ở đây: Source code sửa dữ liệu MongoDB trong Android Kotlin.

Và các Em chú ý là Project này sẽ được dùng cho bài sau nữa nha, nên bắt buộc phải hiểu và làm được bài này cho tốt.

Bài học Sau Tui sẽ hướng dẫn các bạn các kỹ thuật tương tác dữ liệu ( xóa) trực tiếp từ Android Kotlin tới MongoDB, các bạn chú ý theo dõi.

Các khóa học online khác, bạn có thể tham khảo tại đây:

https://unica.vn/?aff=11929

Chúc các bạn thành công!