- vừa được xem lúc

CRUD Nodejs với mysql

0 0 77

Người đăng: Bùi Huy Hoàng

Theo Viblo Asia

Mở Đầu

Xin chào các bạn tiếp tục với series Nodejs cơ bản, bài hôm nay mình sẽ tiếp tục làm thêm các chức năng xem chi tiết và sửa và xóa sản phẩm. À quên ở bài trước sau khi thực hiện kết nối với mysql thì chúng ta vẫn chưa sửa lại chức năng tìm kiếm, vậy nên ở bài viết này mình sẽ thực hiện sửa lại chức năng tìm kiếm luôn. Cùng bắt đầu ngay nhé

Thực Hiện

Sửa chức năng tìm kiếm

Đơn giản thôi bạn chỉ cần sửa lại hàm

app.get('/search', function(req, res){ var id = req.query.id; var data = posts.filter(function(item){ return item.id === parseInt(id) }); res.render('index', { posts: data });
})

thành như thế này là được

app.get('/search', function(req, res){ var id = req.query.id; var sql=`SELECT * FROM products where id = '${id}'`; conn.query(sql, function (err, data, fields) { res.render('index', { products: data }); });
})

Ở bài trước là chúng ta thực hiện filter theo id để lấy ra các phần tử thỏa mãn điều kiện trong mảng, còn bây giờ thì đơn giản là chúng ta lấy ra danh sách sản phẩm rồi where theo id được gửi lên từ client.

Detail

Trước hết chúng ta cần phải sửa lại trang index.pug một chút để chúng ta có thể thực hiện xem chi tiết, sửa, xóa. Mình có trang index.pug như sau:

.products head style. table, th, td { border: 1px solid black; border-collapse: collapse; margin: 10px 30px; } th, td { padding: 5px; text-align: left; } form(action="/search", method="GET") input(name="id", type="text", placeholder="id") button Search table thead tr th Id th Title th(colspan='3') Action tbody each pro in products tr td= pro.id td= pro.title td a(href=`/detail?id=${pro.id}`) Detail td a(href=`/edit?id=${pro.id}`) Update td a(href=`/delete?id=${pro.id}`) Delete a(href='/create') New

nhìn bên ngoài thì nó sẽ như thế này

Ý tưởng là khi mình bấm vào Detail thì sẽ chuyển sang trang detail vì thế mình cần có một trang là detail.pug như sau:

h1 Detail
each data in products p id: span= data.id p title: span= data.title
a(href='/') Go to home

Và hàm trong index.js để chuyển từ trang index sang trang detail như sau:

app.get('/detail', function (req, res) { var id = parseInt(req.query.id); var sql=`SELECT * FROM products where id = '${id}'`; conn.query(sql, function (err, data, fields) { res.render('detail', { products: data }); });
})

OK vậy là chúng ta đã lm xong chức năng xem chi tiết

Delete

Chức năng delete thì sẽ đơn giản hơn bạn chỉ cần gọi đến hàm delete truyền id vào và redirect về lại trang chủ là được. hàm delete như sau:

app.get('/delete', function (req, res) { var id = parseInt(req.query.id); var sql=`Delete FROM products where id = ${id}`; conn.query(sql, function (err, data, fields) { }); res.redirect('/');
})

Đây là kết quả

Update

Chức năng update thì mình sẽ thực hiện như sau: Đầu tiền là sẽ tạo một trang để có thể hiển thị data mà nguời dùng muốn sửa. Ở trang đó sau khi người dùng sửa xong ấn vào nút update thì mình sẽ gọi đến hàm update để tiến hành update lại sản phầm và trả về trang danh sách sản phẩm.

Đầu tiên sẽ là hàm để gọi đến trang update sản phẩm

app.get('/edit', function (req, res) { var id = parseInt(req.query.id); var sql=`SELECT * FROM posts where id = '${id}'`; conn.query(sql, function (err, data, fields) { res.render('update', { posts: data }); });
})

Hàm này cũng tương tự như hàm gọi đến trang chi tiết sản phẩm, ở đây mình gọi đến trang update. Mình có trang update.pug như sau:

h1 Update
each data in posts form(action="/edit" method="POST") input(type="text", placeholder="id", name="id" value=`${data.id}` readonly) br label(id="title") input(type="text", placeholder="title", name="title" value=`${data.title}`) br button Update

Ở đây mình cho hiển thị sản phầm mà người dùng muốn sửa và vì thuộc tính id mình để là khóa chính và tự động tăng vì thế mình sẽ để thẻ input của id có thuộc tính là readonly để không cho người dùng sửa id. Sau khi người dùng sửa xong titlevà ấn Update thì sẽ gọi đến hàm update để tiến hành update data. Hàm update như sau :

app.post('/edit', function (req, res) { var params =req.body; var sql = `update posts set title = '${params.title}' where id = ${params.id};`; conn.query(sql, function (err, result) { if (err) console.log(err); console.log("1 record update"); }); res.redirect('/');
})

Ở hàm này thì mình lấy data từ trang update.pug gửi lên và tiến hành update lại giữ liệu và cuối cùng là trả về trang hiển thị danh sách sản phẩm thôi.

Đây là kết quả :

Kết Luận

Như vậy là mình đã hoàn thành chức năng tìm kiếm, xem chi tiết và cập nhật và xóa sản phầm, Bài tiếp theo mình sẽ nói về phần validate. À quên bài viết có tiêu đề là CRUD Nodejs với mysql mà lại không thấy phần Create đâu ?, thì phần create mình đã nói ở bài trước nên mình xin phép không nói lại, mọi người có thể xem lại phần ở đây nhé ?. Bài viết còn phần nào thiếu sót rất mong các bạn comment xuống bên dưới để mình được bổ sung, nếu thấy bài viết hữu ích thì hãy cho mình một upvote nhé ? , Ấn follow để có thể theo dõi được những bài viết mới nhất của mình nhé. Một lần nữa xin cảm ơn các bạn !!!

Lưu ý

Sau khi public bài viết thì mình đã được một người anh chỉ ra lỗ hổng trong code ? đó là dễ bị tấn công SQL Injection. Nếu chưa rox SQL Injection là gì thì mọi người có thể tham khảo bài viết này cũng là của một người anh mình hệ hệ.

Thì nói qua về SQL injection thì SQL injection là một kỹ thuật cho phép những kẻ tấn công lợi dụng lỗ hổng của việc kiểm tra dữ liệu đầu vào trong các ứng dụng web và các thông báo lỗi của hệ quản trị cơ sở dữ liệu trả về để tiêm vào và thi hành các câu lệnh SQL bất hợp pháp.

code ở trên mình đang viết

var id = req.query.id;

như thế này và mình sẽ sửa lại

var id = parseInt(req.query.id);

Để ràng buộc kiểu dữ liệu cho trường id. Do bài series này mình đang nói về những thứ cơ bản cho người mới bắt đầu vì thế mình đang sử dụng câu lệnh SQL thuần nên sẽ dễ bị tấn công hơn. Còn trên thực tế hiện nay thì hầu như chúng ta thường sử dụng các framework để phát triển nên cũng hạn chế được tấn công SQL injection vì các framework đều đã được test cẩn thận để phòng tránh các lỗi. Vì thế nên cách tốt nhất là chúng ta nên sử dụng các framework thay vì code thuần. Một lần nữa cảm ơn các bạn ?

Bình luận

Bài viết tương tự

- vừa được xem lúc

Cài đặt WSL / WSL2 trên Windows 10 để code như trên Ubuntu

Sau vài ba năm mình chuyển qua code trên Ubuntu thì thật không thể phủ nhận rằng mình đã yêu em nó. Cá nhân mình sử dụng Ubuntu để code web thì thật là tuyệt vời.

0 0 406

- vừa được xem lúc

Hướng dẫn làm bot Facebook messenger cho tài khoản cá nhân

Giới thiệu. Trong bài viết trước thì mình có hướng dẫn các bạn làm chatbot facebook messenger cho fanpage. Hôm nay mình sẽ hướng dẫn các bạn tạo chatbot cho một tài khoản facebook cá nhân. Chuẩn bị.

0 0 231

- vừa được xem lúc

Crawl website sử dụng Node.js và Puppeteer - phần 2

trong phần 1 mình đã giới thiệu về puppeteer và tạo được 1 project cùng một số file đầu tiên để các bạn có thể crawl dữ liệu từ một trang web bất kỳ. Bài này mình sẽ tiếp nối bài viết trước để hoàn thiện seri này.

0 0 73

- vừa được xem lúc

Điều React luôn giữ kín trong tim

■ Mở đầu. Ngồi viết bài khi đang nghĩ vu vơ chuyện con gà hay quả trứng có trước, mình phân vân chưa biết sẽ chọn chủ đề gì để chúng ta có thể cùng nhau bàn luận.

0 0 59

- vừa được xem lúc

Gửi Mail với Nodejs và AWS SES

AWS SES. AWS SES là gì.

0 0 83

- vừa được xem lúc

Crawl website sử dụng Node.js và Puppeteer - phần 1

Bài viết này mình sẽ giới thiệu cho các bạn craw dữ liệu của web site sử dụng nodejs và Puppeteer. .

0 0 164