Полное руководство по загрузке файлов в Next.js (S3, Presigned URLs, Dropzone)

Загрузка файлов может показаться простой, но на самом деле она сопряжена со множеством сложностей. Загрузка через сервер Next.js не сработает из-за ограничения на размер тела запроса в 1 МБ. Загрузка напрямую с клиента небезопасна. Правильный подход — использование предварительно подписанных URL-адресов. В этом видео я покажу вам, как генерировать предварительно подписанные URL-адреса с помощью S3 и как использовать их для безопасной загрузки файлов. Мы начнем с создания полностью настраиваемой и доступной зоны перетаскивания. Затем мы реализуем загрузку файлов с помощью S3 и предварительно подписанных URL-адресов. Я также покажу вам, как отслеживать ход загрузки с помощью нативных XHR-запросов. В конце мы также реализуем удаление файлов. Это видео — полное руководство по созданию безопасного и удобного процесса загрузки файлов в Next.js с использованием S3 и предварительно подписанных URL-адресов. 📸 Программа для записи экрана: https://dub.sh/eDa47SO 🔒 Моё любимое решение для аутентификации: https://dub.sh/xeU8r3v 👨🏻‍💻 Репозиторий GitHub: https://github.com/ski043/file-upload... 🌍 Мой сайт: https://marshalcode.com/ 👋🏻 Discord:   / discord   ✅ Подписывайтесь на меня в X: https://x.com/janmarshaldev 📧 Только для деловых запросов: jan@alenix.de Временные метки: 00:00 Вступление 01:16 Введение в проект 02:30 Создание зоны перетаскивания 09:30 Проверка файлов 15:30 Что такое предварительно подписанные URL-адреса? 20:44 Состояние на стороне клиента 27:00 Генерация предварительно подписанных URL-адресов 36:00 Создание корзины S3 45:00 Загрузка файлов с использованием предварительно подписанных URL-адресов 48:00 Отслеживание прогресса (XHR) 01:02:00 Удаление файлов