Belajar Nodejs 9# – Upload File di Nodejs menggunakan Modul formidable

Kita bisa Upload file pada Nodejs menggunakan dua modul yaitu formidable dan mv. Modul formidable merupakan modul pada Nodejs yang digunakan untuk mengambil data dari form yang khususnya untuk upload File. Sedangkan menggunakan modul mv digunakan untuk memindahkan file yang sudah ter-upload.

Untuk lebih jelasnya mari kita coba buat program upload file di Nodejs.

Instal Modul formidable dan mv

Modul formidable dan mv belum tersedia di Nodejs. Kita harus menginstalnya dengan NPM (Node Package Manager). Adapun cara menginstal modul tersebut adalah sebagai berikut :

1. Buatlah sebuah direktori baru bernama upload-file-nodejs, Contoh : E:\upload-file-nodejs

2. Buat folder bernama upload didalam direktori E:\upload-file-nodejs

3. Setelah itu buka command line atau CMD lalu arahkan ke direktori folder upload-file-nodejs

4. Lalu ketikkan perintah berikut untuk menginstal modul formidable:

npm install formidable

5. Selanjutnya ketik perintah berikut untuk menginstal modul mv:

npm install mv
Upload File di Nodejs

6. Setelah proses instal modulnya selesai, silahkan cek kembali direktori upload-file-nodejs

7. Jika terdapat file baru bernama node_modules dan file json di dalam folder tersebut, maka intalasi modul telah berhasil.

Membuat Form Upload

Buat file HTML dengan nama file.html dan isi dengan kode berikut :

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Upload File</title>
</head>
<body>

    <form action="/" method="post" enctype="multipart/form-data">
        <fieldset>
            <legend>Upload File</legend>
            <p>
                <label>File: </label>
                <input type="file" name="filetoupload" required>
            </p>
            <input type="submit" value="Upload">
        </fieldset>
    </form>
    
</body>
</html>

Setelah itu Save As ke folder upload-file-nodejs

Keterangan :

<form action=”/” , Form akan mengirim ke / (root) website.

enctype=”multipart/form-data”>, atribut yang menentukan bagaimana data form dikirim ke server, wajib untuk form upload data.

<input type=”file” name=”filetoupload” required>, kita menggunakan nama filetoupload.yang akan digunakan sebagai variabel di dalam program server.

Hasil tampilannya :

Membuat Server untuk Upload File

Langkah terakhir, kita akan membuat script untuk servernya.

Buat file Javascript dengan nama upload.js dan isi dengan kode berikut :

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

http.createServer(function (req, res) {

  // kirim form upload
  if (req.url === "/" && req.method === "GET"){
    fs.readFile("file.html", (err, data) => {
      res.writeHead(200, { 'Content-Type': 'text/html' });
      if (err) throw err;
      res.end(data);
    });
  }

  // upload file
  if (req.url == '/' && req.method === "POST") {
    // membuat objek form dari formidable
    var form = new formidable.IncomingForm();

    // manangani upload file
    form.parse(req, function (err, fields, files) {
      var oldpath = files.filetoupload.path;
      var newpath = __dirname + "/upload/" + files.filetoupload.name;

      // pindahakan file yang telah di-upload
      mv(oldpath, newpath, function (err) {
        if (err) { throw err; }
        console.log('file uploaded successfully');
        return res.end("file uploaded successfully");
      });
    });
  } 

}).listen(8000);

console.log("server listening on http://localhost:8000");

Setelah itu coba eksekusi dan uji coba upload filenya dengan perintah :

node upload.js

Sekian dul tentang cara Upload File di Nodejs. Baca juga artikel selanjutnya yaitu : Belajar Nodejs 10# mengirim email dengan nodejs

Tinggalkan Balasan

Ads Blocker Image Powered by Code Help Pro

Pemblokir Iklan Terdeteksi!!!

Kami mendeteksi bahwa Anda menggunakan ekstensi untuk memblokir iklan. Silahkan menonaktifkan pemblokir iklan ini. Lalu refresh halaman ini untuk membuka konten ini !!!

Scroll to Top