Malay

Tutorial Node.js

Node.js MySQL

Node.js MongoDB

Modul Node.js

Node.js - Muat Naik Fail: Panduan Pemula

Hai there, bakal bintang pengkomputeran! Selamat datang ke perjalanan menarik kami ke dunia pengгрузка fail dengan Node.js. Seperti guru komputer tetangga anda, saya begitu gembira untuk memandu anda melalui petualangan ini. Jangan khawatir jika anda belum pernah menulis baris kode sebelum ini - kita akan mulai dari awal dan membina jalan kita. Pada akhir panduan ini, anda akan dapat mengгрузка fail seperti seorang pro!

Node.js - Upload Files

Pengenalan ke Pengгрузка Fail dalam Node.js

Sebelum kita masuk ke detil, mari bicarakan mengapa pengгрузка fail penting. Bayangkan anda membuat aplikasi media sosial tempat pengguna dapat berkongsi foto. Atau mungkin anda membina sistem pengurusan dokumen untuk syarikat. Dalam kedua-dua kes, anda perlukan cara untuk pengguna menghantar fail ke pelayan anda. Itu adalah di mana pengгрузка fail masuk!

Node.js, runtime JavaScript yang dapat dipercayai, menyediakan beberapa cara untuk mengendalikan pengгрузка fail. Hari ini, kita akan fokus kepada dua pustaka popular: Formidable dan Multer. Anggap mereka sebagai superhero pengгрузка fail anda, setiap orang dengan kekuatan khususnya!

Formidable: Rakan pertama anda dalam pengгрузка fail

Apa itu Formidable?

Formidable seperti teman yang boleh dipercayai yang sentiasa ada untuk membantu anda pindah. Ia adalah modul Node.js yang membuat penyelesaian data borang, terutama pengгрузка fail, menjadi mudah. Mari lihat bagaimana untuk menggunakannya!

Menyiapkan Formidable

Pertama, kita perlu memasang Formidable. Buka terminal anda dan taip:

npm install formidable

Perintah ini seperti pergi ke kedai superhero dan membeli kostum Formidable anda. Sekarang anda siap untuk mula mengгрузка!

Pengгрузка Fail Asas dengan Formidable

Mari buat pelayan mudah yang boleh mengendalikan pengгрузка fail. Ini adalah kodnya:

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

http.createServer((req, res) => {
if (req.url == '/fileupload') {
const form = new formidable.IncomingForm();
form.parse(req, (err, fields, files) => {
const oldPath = files.filetoupload.filepath;
const newPath = 'C:/Users/YourName/uploads/' + files.filetoupload.originalFilename;
fs.rename(oldPath, newPath, (err) => {
if (err) throw err;
res.write('Fail dimuat naik dan dipindahkan!');
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);

Mari kitaongkai ini:

  1. Kita buat pelayan menggunakan http.createServer().
  2. Jika URL adalah '/fileupload', kita gunakan Formidable untuk mengurai borang masuk.
  3. Kita pindahkan fail yang dimuat naik dari lokasi sementara ke lokasi kekal.
  4. Jika URL adalah apa-apa pun, kita tunjuk borang muat naik mudah.

Mengendalikan Pengгрузка Fail Berbilang

Apa jika anda mahu muat naik beberapa fail sekaligus? Tak masalah! Ini adalah bagaimana anda boleh mengubah kod:

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

http.createServer((req, res) => {
if (req.url == '/fileupload') {
const form = new formidable.IncomingForm();
form.multiples = true;
form.parse(req, (err, fields, files) => {
if (Array.isArray(files.filetoupload)) {
files.filetoupload.forEach((file) => {
const oldPath = file.filepath;
const newPath = 'C:/Users/YourName/uploads/' + file.originalFilename;
fs.rename(oldPath, newPath, (err) => {
if (err) throw err;
});
});
} else {
const oldPath = files.filetoupload.filepath;
const newPath = 'C:/Users/YourName/uploads/' + files.filetoupload.originalFilename;
fs.rename(oldPath, newPath, (err) => {
if (err) throw err;
});
}
res.write('Fail-fail dimuat naik dan dipindahkan!');
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" multiple><br>');
res.write('<input type="submit">');
res.write('</form>');
return res.end();
}
}).listen(8080);

Perubahan utama di sini adalah:

  1. Kita set form.multiples = true untuk membolehkan pengгрузка fail berbilang.
  2. Kita periksa jika files.filetoupload adalah array (fail-fail berbilang) atau objek (fail tunggal).
  3. Kita gunakan forEach untuk mengendalikan fail-fail berbilang jika perlu.

Multer: Anak Muda di Blok

Pengenalan ke Multer

Sekarang, mari temu teman file upload superhero kedua kita: Multer. Multer seperti adik muda Formidable yang lebih cool. Ia direka khusus untuk mengendalikan multipart/form-data, yang sempurna untuk pengгрузка fail.

Menyiapkan Multer

Untuk mula menggunakan Multer, pasangnya menggunakan npm:

npm install multer

Pengгрузка Fail Asas dengan Multer

Ini adalah contoh mudah bagaimana untuk menggunakan Multer:

const express = require('express');
const multer = require('multer');
const path = require('path');

const app = express();

const storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, 'uploads/')
},
filename: function (req, file, cb) {
cb(null, file.fieldname + '-' + Date.now() + path.extname(file.originalname))
}
});

const upload = multer({ storage: storage });

app.get('/', (req, res) => {
res.sendFile(__dirname + '/index.html');
});

app.post('/upload', upload.single('filetoupload'), (req, res, next) => {
const file = req.file;
if (!file) {
const error = new Error('Sila muat naik fail');
error.httpStatusCode = 400;
return next(error);
}
res.send(file);
});

app.listen(3000, () => console.log('Pelayan bermula di port 3000'));

Mari kitaongkai ini:

  1. Kita siapkan enjin simpanan yang memberitahu Multer di mana untuk menyimpan fail dan bagaimana menamakan mereka.
  2. Kita buat instance muat naik menggunakan tetapan simpanan kita.
  3. Kita tentukan laluan untuk borang muat naik dan lain untuk mengendalikan pengрузка fail.
  4. Dalam laluan muat naik, kita gunakan upload.single('filetoupload') untuk mengendalikan pengрузка fail tunggal.

Mengendalikan Pengрузка Fail Berbilang dengan Multer

Multer membuat ia sangat mudah untuk mengendalikan pengрузка fail berbilang. Ini adalah bagaimana:

app.post('/upload', upload.array('filetoupload', 12), (req, res, next) => {
const files = req.files;
if (!files) {
const error = new Error('Sila pilih fail');
error.httpStatusCode = 400;
return next(error);
}
res.send(files);
});

Perubahan utama di sini adalah menggunakan upload.array('filetoupload', 12) instead of upload.single(). '12' menentukan had maksimum 12 fail.

Menbandingkan Formidable dan Multer

Sekarang kita telah melihat kedua-dua Formidable dan Multer dalam aksi, mari bandingkan mereka:

Ciri Formidable Multer
Mudah digunakan Mudah dan jelas Memerlukan lebih banyak tetapan tetapi menawarkan lebih banyak kawalan
Integrasi Bekerja dengan mana-mana pelayan Node.js Direka untuk bekerja dengan Express
Pengendalian fail Boleh mengendalikan kedua-dua fail dan ruangan Direka khusus untuk pengрузка fail
Kustomisasi Kurang fleksibel Sangat boleh dikustomisasi
Pengрузка fail berbilang Memerlukan kode tambahan Disediakan secara binaan

Kesimpulan

Tahniah! Anda telah meningkatkan kemahiran Node.js anda dengan belajar bagaimana mengendalikan pengрузка fail. Sama ada anda memilih Formidable kerana kesederhanaannya atau Multer kerana kekuatan dan fleksibilitasnya, anda kini dilengkapi untuk menambah fungsi pengрузка fail ke aplikasi Node.js anda.

Ingat, latihan membuat sempurna. Cobalah membina projek kecil yang menggunakan pengрузка fail - mungkin aplikasi berkongsi gambar mudah atau sistem simpanan dokumen. Semakin banyak anda menulis kode, semakin nyaman anda akan menjadi dengan konsep ini.

Selamat mengkod, dan mayat pengрузка fail anda sentiasa berjaya!

Credits: Image by storyset

Tutorial Sebelumnya:
Node.js - Konsep Callback
Tutorial Seterusnya:
Node.js - Hantar Emel