Как загрузить файл на сервер в ExpressJS

Как загрузить файл на сервер в ExpressJS

Как загрузить файл на сервер в ExpressJS

Современные веб-приложения позволяют пользователям загружать изображения и другие файлы. Возможность загрузки файлов
является общим требованием при создании REST API в ExpressJS.

В этой статье мы рассмотрим, как выполнить загрузку и сохранение одного файла в NodeJS.

Установка

Сначала давайте создадим новое NodeJS приложение.

# создаем папку и переходим в нее

$ mkdir nodejs-upload-files && cd  nodejs-upload-files



# инициализируем новое nodejs приложение

$ npm init -y



# ставим зависимости

$ npm install express body-parser cors express-fileupload morgan lodash --save



Вот что делает каждый из вышеперечисленных пакетов:

  • express — Популярный NodeJS веб-фреймворк.
  • body-parser — (промежуточное программное обеспечение — мидлвар) разбирает тело входящего запроса и делает доступным его через свойство req.body.
  • cors — другой мидлвар для работы с CORS запросами (совместное использование ресурсов из разных источников).
  • express-fileupload — простое промежуточное программное обеспечение для загрузки файлов. Оно обрабатывает запросы на загрузку файлов на сервер,
    извлекает эти файлы, если они доступны, и делает их доступными в свойстве req.files.
  • lodash — Библиотека JavaScript, которая предоставляет служебные функции для массивов, чисел, объектов, строк и т.д.
  • Создаем ExpressJS сервер

    После установки необходимых зависимостей приступим к созданию нашего сервера ExpressJS.



    const express = require('express');

    const fileUpload = require('express-fileupload');

    const cors = require('cors');

    const bodyParser = require('body-parser');

    const crypto = require('crypto');

    const _ = require('lodash');



    const app = express();



    // делаем доступными загрузку файлов

    app.use(fileUpload({

        createParentPath: true

    }));



    // добавляем мидлвары

    app.use(cors());

    app.use(bodyParser.json());

    app.use(bodyParser.urlencoded({extended: true}));



    // устанавливаем порт приложения

    const port = process.env.PORT || 5000;



    app.get('/', async (req, res) => {

      res.send({ message: 'Привет' })

    });



    // запускаем 

    app.listen(port, () => 

      console.log(`Приложение на порту ${port}.`)

    );

    Загружаем файл

    Теперь создадим маршрут, позволяющий пользователям загружать фотографии своего профиля.



    app.post('/upload/profile-image', async (req, res) => {



      try {

        // если файлов нет

        if (!req.files) {

          // отправляем ответ, что нет файлов для загрузки

          res.send({

            status: false,

            message: 'Нет файлов для загрузки'

          });

        } else {

          // Используем название поля profile_image из html разметки для получения ссылки на загружаемый файл

          const avatar = req.files.profile_image;



          const filename = crypto.createHash('md5').update(avatar.name).digest('hex');



          // расширение файла

          const extension = avatar.name.substring(avatar.name.lastIndexOf('.') + 1);



          // используем метод mv() для сохранения файла в папке ./user/avatars/

          avatar.mv('./user/avatars/' + filename + '.' + extension);



          // отправляем ответ

          res.send({

            status: true,

            message: 'Файл загружен',

            data: {

              name: filename,

              extension: extension,

              mimetype: avatar.mimetype, // тип картинки, как он пришел от клиента

              size: avatar.size

            }

          });

        }

      }

      catch (err) {

        // отправляем 500 код об ошибке

        res.status(500).send(err);

      }

    });

    Как работает мидлвар express-fileupload?

    Он делает загруженные файлы доступными в свойстве req.files. Например, если вы загружаете файл с именем profile-image.jpg,
    а название поля для загрузки файла — profile_image, вы можете получить к нему доступ через свойство req.files.profile_image.

    Объект profile_image будет содержать следующую информацию:

  • profile_image.name — Имя загруженного файла, т. е. profile-image.jpg
  • profile_image.mv — Функция для перемещения файла в другое место на сервере
  • profile_image.mimetype — Тип файла
  • profile_image.size — Размер файла в байтах
  • profile_image.data — Бинарное представление загруженного файла
  • Вот так просто можно загрузить файл на сервер в ExpressJS с помощью библиотеки express-fileupload.

    Источник

    НЕТ КОММЕНТАРИЕВ

    Оставить комментарий