Это мои заметки для Bootcamp Йонаса Шмедтмана по Node.js на Udemy: https://www.udemy.com/course/nodejs-express-mongodb-bootcamp/

Загрузка одиночных изображений: изображения профиля

На странице учетной записи пользователя у нас есть возможность изменить фото профиля. Чтобы эта опция работала, мы будем использовать промежуточное ПО multer для обработки данных, состоящих из нескольких частей.

Настройка Multer

После установки пакета multer мы укажем способ хранения:

Метод diskStorage использует функции с обратными вызовами для установки адресатов и имен файлов. Первый аргумент в cb - это ошибка, для которой в данном случае установлено значение null. Чтобы создать имя файла, мы используем идентификатор пользователя и текущую отметку времени. Чтобы добавить расширение файла, мы извлекаем все после косой черты в типе MIME (которое выглядит как 'image/jpeg').

Затем мы создадим простой фильтр, чтобы проверить, действительно ли файл является изображением. Типы MIME упрощают это:

Мы объединим спецификацию хранилища и фильтр в новый объект multer, а затем экспортируем его как промежуточное ПО:

Обратите внимание, что аргумент 'photo' сообщает multer, где в теле запроса искать файл. Теперь мы можем использовать это промежуточное ПО в нашем маршруте:

Последний шаг - убедиться, что новое имя файла сохраняется в нашей базе данных. Мы сделаем это, проверив, есть ли в запросе файл и, если да, добавим его к объекту запроса:

Обработка изображений

В нашем дизайне изображения пользователей всегда представляют собой круги. Если пользователь загружает фото идеально квадратной формы, нам повезло. В противном случае нам придется немного изменить размер. К счастью, пакет под названием sharp упрощает эту задачу. После установки sharp мы сначала хотим изменить способ хранения загруженных файлов. В конце концов, мы не хотим записывать образ на диск только для того, чтобы немедленно прочитать его снова в нашем промежуточном программном обеспечении для изменения размера изображения. Вместо этого мы сохраним изображение в памяти, что сделает его доступным на req.file.buffer. Вот как мы используем sharp:

В одной длинной цепочке методов мы изменяем размер изображения, форматируем его как JPEG, снижаем качество до 90% и сохраняем его с той же схемой именования файлов, что и раньше (за исключением того, что теперь с фиксированным расширением). Ух!

Подключение к форме

Каждый раз, когда пользователь загружает файл, он использует форму, состоящую из нескольких частей. Мы перепишем нашу форму пользовательских данных как составную форму, чтобы принимать загруженные файлы:

Вот и все! Теперь наши пользователи могут загружать изображения через форму на странице своего аккаунта.

Загрузка нескольких изображений: изображения с тура

Загрузка изображений Mutli очень похожа на загрузку отдельных изображений. Основное отличие состоит в том, что вместо метода single мы используем метод fields, который принимает массив объектов:

Загрузка изображения обложки выглядит примерно так же, как загрузка изображения обложки. Однако все меняется, когда мы хотим загрузить три изображения для images. Начнем с установки req.body.images в пустой массив. Затем мы map над каждым изображением в массиве, проделаем те же резкие операции, что и раньше, и переместим имена файлов на req.body.images. Поскольку операции sharp являются асинхронными, мы получим массив обещаний, который будем ждать с помощью Promise.all. Все это выглядит так: