Загрузка файлов

Загрузка файлов с помощью multer

Последнее обновление: 22.05.2019

Одной из наиболее часто встречаемых задач в Node.js является загрузка файлов на сервер. В Node.js для этого нет встроенных инструментов, однако мы можем использовать дополнительные специальные пакеты. Одним из популярных подобных пакетов является multer, который работает поверх Express.

Итак, для загрузки файлов создадим новый проект. Установим в него пакеты express и multer:

install express multer

Определим в проекте новый файл index.html, в котором будет располагаться форма для загрузки файла:

<!DOCTYPE html>
<html>
<head>
    <title>Node.js</title>
    <meta charset="utf-8" />
</head>
<body>
    <h1>Upload file</h1>
    <form action="/upload" method="post" enctype="multipart/form-data">
        <label>Файл</label><br>
        <input type="file" name="filedata" /><br><br>
        <input type="submit" value="Send" />
      </form>
</body>
<html>

Здесь важно отметить, что, чтобы на стороне сервера multer мог подхватить загруженный файл, у формы атрибут enctype должен иметь значение multipart/form-data.

В главном файле приложения app.js используем multer для получения отправленного файла:

const express = require("express");
const multer  = require("multer");
 
const app = express();
 
app.use(express.static(__dirname));
app.use(multer({dest:"uploads"}).single("filedata"));
app.post("/upload", function (req, res, next) {
  
    let filedata = req.file;
    console.log(filedata);
	if(!filedata)
        res.send("Ошибка при загрузке файла");
    else
        res.send("Файл загружен");
});
app.listen(3000);

В данном случае multer добавляется в виде компонента middleware. Для конфигурации в функцию multer передается объект, в котором параметр dest указывает на путь, по которому будет загружаться файл. В данном случае это папка uploads:

multer({dest:"uploads"}).single("filedata")

Если внутри проекта такой папки нет, то она автоматически будет создана.

Далее вызывается функция single() указывает, что загружаться будет один файл. Собственно на форме в index.html мы имеем поле для загрузки одного файла. В этот метод передается название поля, которое используется на форме для загрузки файла. Соответствующее поле в файле index.html называется "filedata", поэтому в функцию single() передается соответствующее значение.

Настроив multer, мы можем при обработке запроса получить файл через req.file.

Для тестирования приложения запустим приложение, обратимся к странице index.html и загрузим какой-нибудь файл:

Загрузка файла в Node.js

После этого на консоли мы увидим что-то наподобие:

{ fieldname: 'filedata',
  originalname: 'ebook.pdf',
  encoding: '7bit',
  mimetype: 'application/pdf',
  destination: 'uploads',
  filename: '9bd3bdfd59e5e4b4c8527a1ee6f665da',
  path: 'uploads\9bd3bdfd59e5e4b4c8527a1ee6f665da',
  size: 740735 }

Здесь мы видим, какие метаданные получает сервер при загрузке файла, которые мы можем получить и как-нибудь использовать по своему усмотрению.

В результате в папке проекта будет создана подкаталог uploads, где мы найдем загруженный файл:

Upload files in Express and Node.js

Также нам необязательно встраивать multer глобально в конвейер обработки запросов в виде компонента middleware. Вместо этого мы можем определить использование multer только для отдельных функций обработки запросов. Например:

const express = require("express");
const multer  = require("multer");
 
const app = express();

const upload = multer({dest:"uploads"});
app.use(express.static(__dirname));

app.post("/upload", upload.single("filedata"), function (req, res, next) {
  
    let filedata = req.file;

    console.log(filedata);
    if(!filedata)
        res.send("Ошибка при загрузке файла");
    else
        res.send("Файл загружен");
});
app.listen(3000);

Здесь в функции app.post("/upload"... второй параметр upload.single("filedata") опять же устанавливает использование multer для загрузки одного файла.

НазадСодержаниеВперед

Помощь сайту
Юмани:
410011174743222
Перевод на карту
Номер карты:
4048415020898850