Как стать автором
Обновить
5
0
Долгов Денис @DolgovDenis

Frontend

Отправить сообщение

Как обойти ограничение браузера и прикрепить сразу два файла и более: мультидобавление файлов

Время на прочтение4 мин
Количество просмотров10K
Привет, Хабр!

Давайте решим нетривиальную задачу. Представьте, что вам нужно скачать данные через интерфейс элементарным способом, например, кликнуть по кнопке «Скачать файлы».

Возьмём по умолчанию Chrome v.88. Задача звучит так:

  • Сгенерировать файлы на стороне клиента.
  • Скачать все сгенерированные файлы одним кликом.

Это может быть всё что угодно: кучка бинарников, большие архивы с бэкапами, галерея картинок и прочее. Мы же будем говорить именно о механизме скачивания как таковом, поэтому в качестве примера возьмём скачивание текста и картинок.


Само собой, можно решить такую задачу, просто сжав все нужные файлы в один ZIP-архив, а потом уже скачать его. Выходит, пользователь скачает единый файл, который потом самостоятельно разархивирует. Например, можно использовать библиотеку jszip, которая позволяет скачивать набор файлов, сжав их.

Вот небольшой пример скачивания с предварительным сжатием из документации:

var zip = new JSZip();
zip.file("Hello.txt", "Hello World\n");
var img = zip.folder("images");
img.file("smile.gif", imgData, {base64: true}); zip.generateAsync({type:"blob"}).then(function(content) {
// see FileSaver.js
saveAs(content, "example.zip"); });

«А где тут нетривиальность?» — спросите вы. И будете правы. А если речь идёт об одновременном скачивании с сайта двух, трёх или десяти файлов? Например: есть лист в селекте, в котором можно выбрать определённое количество файлов для скачивания. Введём дополнительное условие: у пользователя нет установленного архиватора, поэтому вариант со сжатием в архив отбрасываем. Как решить такую задачу?
Читать дальше →
Всего голосов 11: ↑10 и ↓1+15
Комментарии16

11 вещей которые я узнал, читая спецификацию flexbox

Время на прочтение8 мин
Количество просмотров101K

Я всегда считал, что с flexbox довольно легко работать — глоток свежего воздуха после стольких лет float'ов и clearfix'ов.


Правда недавно я обнаружил что борюсь с ним; что-то растягивалось, когда я не думал, что оно должно тянуться. Я поправил здесь, другой элемент сжался. Я починил это, что-то другое ушло за экран. Какого Джорджа Буша тут происходит?


В конце концов, все заработало, но солнце село, а мой процесс был привычной игрой с CSS. Или… как называется та игра, где надо ударить крота, а затем другой крот выпрыгивает и надо ударить и его тоже?


Как бы там ни было, я решил что пора вести себя как взрослый разработчик и выучить flexbox должным образом. Но вместо того, чтобы прочитать 10 очередных блог-постов, я решил отправиться прямиком к исходнику и прочитать The CSS Flexible Box Layout Module Level 1 Spec


Вот хорошие отрывки.


Читать дальше →
Всего голосов 66: ↑62 и ↓4+58
Комментарии33

Информация

В рейтинге
Не участвует
Откуда
Москва, Москва и Московская обл., Россия
Дата рождения
Зарегистрирован
Активность