[Node.js] Phần 9: Tải tập tin lên trong Node.js

1.027 lượt xem 
 Cập nhật lần cuối: 16/06/2018 lúc 20:23:22
Thể loại: Node.js, Thiết kế Web 

Trong bài viết, chúng ta sẽ tìm hiểu cách tải các tập tin từ máy tính lên server thông qua module Formidable (tiếng Anh từ Formidable có nghĩa là vượt trội, ghê gớm, đáng sợ).

Lưu ý trong bài này sẽ phát sinh rất nhiều lỗi, tôi sẽ hướng dẫn theo cách gặp ít lỗi nhất có thể.

Module Formidable

Đây là module hữu ích để thực thi việc tải tập tin lên (upload file). Để tải về và cài đặt module Formidable, chúng ta có thể dùng lệnh cmd như sau. Trong đó, lưu ý [User Name] là tên máy tính của bạn. Ví dụ máy tính của tôi tên là Dammio, tôi sẽ có dòng lệnh C:\Users\Dammio\AppData\Roaming\npm>npm install formidable.

C:\Users\[User Name]\AppData\Roaming\npm>npm install formidable

Nếu bạn không thể tải được module này thì có thể tải trực tiếp ở node_modules, bung nén đặt vào đường dẫn C:\Users\[User Name]\AppData\Roaming\npm>npm.

Kết quả sau khi thành công như sau.

C:\Users\Dammio\AppData\Roaming\npm>npm install formidable
+ [email protected]
added 1 package in 0.452s

Sau khi tải về module Formidable, bạn nhúng module này vào ứng dụng bằng phương thức require() như sau:

var formidable = require('formidable');

Tải tập tin lên

Trong mục này, bạn sẽ học cách tạo 1 trang web trong dammio.js cho phép người dùng tải tập tin lên server.

Bước 1: Tạo một Upload Form

Tạo một tập tin dammio.js mà sẽ xuất ra mã HTML với trường tải lên (upload field)

var http = require('http');
http.createServer(function (req, res) {
  res.writeHead(200, {'Content-Type': 'text/html'});
  res.write('<form action="fileupload" method="post" enctype="multipart/form-data">');
  res.write('<input type="file" name="filetoupload"><br>');
  res.write('<input type="submit">');
  res.write('</form>');
  return res.end();
}).listen(8080);

Bước 2: Phân tích tập tin tải lên

Nhúng module Formidable vào để có thể phân tích tập tin tải lên khi đến server. Khi tập tin được tải lên và phân tích, server sẽ tạo 1 bản sao lưu trữ tập tin này.

var http = require('http');
var formidable = require('formidable');

http.createServer(function (req, res) {
  if (req.url == '/fileupload') {
    var form = new formidable.IncomingForm();
    form.parse(req, function (err, fields, files) {
      res.write('File uploaded');
      res.end();
    });
  } else {
    res.writeHead(200, {'Content-Type': 'text/html'});
    res.write('<form action="fileupload" method="post" enctype="multipart/form-data">');
    res.write('<input type="file" name="filetoupload"><br>');
    res.write('<input type="submit">');
    res.write('</form>');
    return res.end();
  }
}).listen(8080);

Bước 3: Lưu tập tin

Khi tập tin được tải lên server thành công, nó sẽ được đặt trong thư mục tạm thời. Đường dẫn đến thư mục có thể tìm thấy ở đối tượng “files“, là đối số thứ hai trong hàm callback của phương thức parse(). Để di chuyển tập tin đến thư mục bạn muốn, bạn hãy dùng module File System (fs) và thay thế tên tập tin. Lưu nội dung sau đặt tên là dammio.js ở thư mục C:/Users/Dammio/AppData/Roaming/npm/.

Lưu ý var newpath = ‘C:/Users/Dammio/AppData/Roaming/npm/’ + files.filetoupload.name; là nơi bạn sẽ lưu tập tin tải lên.

var http = require('http');
var formidable = require('formidable');
var fs = require('fs');

http.createServer(function (req, res) {
  if (req.url == '/fileupload') {
    var form = new formidable.IncomingForm();
    form.parse(req, function (err, fields, files) {
      var oldpath = files.filetoupload.path;
      var newpath = 'C:/Users/Dammio/AppData/Roaming/npm/' + files.filetoupload.name;
      fs.rename(oldpath, newpath, function (err) {
        if (err) throw err;
        res.write('File uploaded and moved!');
        res.end();
      });
 });
  } else {
    res.writeHead(200, {'Content-Type': 'text/html'});
    res.write('<form action="fileupload" method="post" enctype="multipart/form-data">');
    res.write('<input type="file" name="filetoupload"><br>');
    res.write('<input type="submit">');
    res.write('</form>');
    return res.end();
  }
}).listen(8080);

Tiếp theo, ở Command Prompt (cmd), chạy lệnh C:\Users\Dammio\AppData\Roaming\npm>node dammio.js và mở http://localhost:8080/, giao diện Web như sau.

Bạn chọn nút Upload File, chọn 1 tập tin bất kỳ và nhấn nút Submit, nếu dòng chữ “File uploaded and moved!” tức là bạn đã upload thành công tập tin được lưu trữ ở đường dẫn C:\Users\Dammio\AppData\Roaming\npm.

Bạn có thể để lại bình luận phía dưới nếu chưa hiểu và gặp vấn đề lỗi. Thực chất, bài này gặp rất nhiều lỗi.

Kết luận

Bạn đã biết cách tạo 1 ứng dụng đơn giản để tải tập tin lên server thông qua các ví dụ trong Node.js ở bài này. Mời bạn tiếp tục theo dõi các bài tiếp theo.

Bình luận Facebook

1
Để lại bình luận

avatar
1000
0 Comment threads
0 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
0 Comment authors
Recent comment authors
  Subscribe  
newest oldest most voted
Notify of