Rumah > hujung hadapan web > tutorial js > Cara membina sistem pengurusan fail mudah menggunakan Node.js

Cara membina sistem pengurusan fail mudah menggunakan Node.js

王林
Lepaskan: 2023-11-08 18:19:49
asal
1572 orang telah melayarinya

Cara membina sistem pengurusan fail mudah menggunakan Node.js

Node.js ialah persekitaran berjalan sebelah pelayan yang sangat popular Ia ditulis dalam JavaScript dan membenarkan pembangun menggunakan bahasa pengaturcaraan yang sama untuk bahagian hadapan dan belakang-. akhir pembangunan. Kecekapan dan fleksibiliti Node.js menjadikannya bahagian penting dalam pembangunan web. Dalam artikel ini, kita akan belajar cara menggunakan Node.js untuk membina sistem pengurusan fail yang mudah.

Untuk mencapai fungsi ini, kita perlu menggunakan modul asas fs (sistem fail) dan http Node.js untuk mencipta pelayan web. Mula-mula, anda perlu menjalankan arahan "npm init" pada baris arahan untuk menjana fail package.json, dan kemudian memasang pakej pergantungan yang diperlukan melalui "npm install --save express body-parser ejs multer fs".

Pertama, kami akan mencipta fail Node.js bernama app.js. Dalam kod tersebut, kami mula-mula memperkenalkan modul dan perisian tengah yang diperlukan:

const express = require('express');
const bodyParser = require('body-parser');
const multer = require('multer');
const fs = require('fs');
const ejs = require('ejs');
const app = express();
Salin selepas log masuk

Di sini kami menggunakan rangka kerja ekspres, perisian tengah parser badan dan perisian tengah multer untuk mengendalikan fungsi muat naik fail, dan enjin templat ejs untuk menghasilkan muka surat.

Seterusnya, kita perlu menyediakan penghalaan sumber statik:

app.use(express.static(__dirname + '/public'));
Salin selepas log masuk

Di sini kami meletakkan fail statik projek dalam folder awam.

Kami juga perlu menggunakan middleware body-parser untuk mengendalikan permintaan POST:

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
Salin selepas log masuk

Seterusnya, kami akan membuat laluan untuk mengendalikan permintaan muat naik dan muat turun fail: #🎜 🎜 #

//上传文件的路由
app.post('/upload', upload.single('file'), (req, res) => {
  res.redirect('/');
});
 
//下载文件的路由
app.get('/download/:filename', (req, res) => {
  const { filename } = req.params;
  const filePath = `${__dirname}/uploads/${filename}`;
  res.download(filePath);
});
Salin selepas log masuk

Multer digunakan di sini untuk memproses muat naik fail, dan kaedah res.download() digunakan untuk memuat turun fail.

Akhirnya, kami mencipta laluan untuk memaparkan halaman:

app.get('/', (req, res) => {
  const filesPath = `${__dirname}/uploads`;
  const data = fs.readdirSync(filesPath);
  res.render('index', { files: data });
});
Salin selepas log masuk

Di sini kami membaca semua fail di bawah folder muat naik dan menjadikannya ke dalam fail templat.

Seterusnya, kita perlu mencipta fail templat index.ejs untuk memaparkan senarai fail dan borang untuk memuat naik fail:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>File Manager</title>
</head>
<body>
  <h1>Files List:</h1>
  <% for (let i = 0; i < files.length; i++) { %>
    <p><a href="/download/<%= files[i] %>"><%= files[i] %></a></p>
  <% } %>
 
  <hr>
 
  <h2>Upload File:</h2>
  <form method="post" action="/upload" enctype="multipart/form-data">
    <input type="file" name="file">
    <button type="submit">Upload</button>
  </form>
</body>
</html>
Salin selepas log masuk

Di sini kami menggunakan sintaks EJS untuk menjana secara dinamik senarai fail, Juga gunakan borang HTML untuk memuat naik fail.

Akhirnya, kami memulakan pelayan:

app.listen(3000, () => {
  console.log('App listening on port 3000!');
});
Salin selepas log masuk

Sekarang kami telah selesai membina sistem pengurusan fail mudah menggunakan Node.js, yang boleh diakses dalam penyemak imbas http:// localhost:3000 untuk melihat kesannya.

Kod lengkap adalah seperti berikut:

const express = require('express');
const bodyParser = require('body-parser');
const multer = require('multer');
const fs = require('fs');
const ejs = require('ejs');
const app = express();
 
//设置静态资源路由
app.use(express.static(__dirname + '/public'));
 
//设置body-parser中间件
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
 
//设置存储文件的位置和文件名
const storage = multer.diskStorage({
  destination: (req, file, cb) => {
    cb(null, 'uploads');
  },
  filename: (req, file, cb) => {
    const { originalname } = file;
    cb(null, originalname);
  }
});
 
const upload = multer({ storage });
 
//上传文件的路由
app.post('/upload', upload.single('file'), (req, res) => {
  res.redirect('/');
});
 
//下载文件的路由
app.get('/download/:filename', (req, res) => {
  const { filename } = req.params;
  const filePath = `${__dirname}/uploads/${filename}`;
  res.download(filePath);
});
 
//渲染页面的路由
app.get('/', (req, res) => {
  const filesPath = `${__dirname}/uploads`;
  const data = fs.readdirSync(filesPath);
  res.render('index', { files: data });
});
 
//设置模板引擎和模板文件夹位置
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');
 
//启动服务
app.listen(3000, () => {
  console.log('App listening on port 3000!');
});
Salin selepas log masuk
Setakat ini, kami telah menyelesaikan proses membina sistem pengurusan fail mudah menggunakan Node.js lebih baik Memahami modul asas dan perisian tengah Node.js.

Atas ialah kandungan terperinci Cara membina sistem pengurusan fail mudah menggunakan Node.js. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan