Если файл генерируется на фронт-енд, то как инициировать скачивание файла в js? Давайте посмотрим.
Скачивание инициируется после нажатия пользователем на ссылку в браузере. Потому мы создадим элемент ANCHOR и выполним клик по нему.
Так как контент не передаётся с сервера, то он должен быть локальным. В этом нам поможет кодирование ссылки в виде blob объекта, куда мы сохраним наши данные для скачивания.
Пример функции для скачивания текста в виде файла:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
function download(data, filename) { const file = new Blob([data], { type: 'text/plain' }); const a = document.createElement('A'); const url = URL.createObjectURL(file); a.href = url; a.download = filename; document.body.appendChild(a); a.click(); setTimeout(function() { document.body.removeChild(a); window.URL.revokeObjectURL(url); }, 0); } |
Т.к. после скачивания ссылка нам становится не нужна, то она удаляется из DOM.
Данная запись опубликована в 31.07.2023 19:55 и размещена в рубрике javaScript.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Декабрь 10, 2016 г.
Чтобы убедить вас, что метод генетических алгоритмов - это очень простая штука, был создан данный пример. Мы найдем с помощью генетического алгоритма, что кратчайший путь между двумя точками - это прямая.
Постановка задачи:
Заданы две точки на плоскости ...
Читать
Май 16, 2025 г.
В веб-разработке важно уметь правильно обрабатывать процесс загрузки изображений. Браузеру может потребоваться время на подгрузку файла, особенно при медленном соединении или больших изображениях. Задача разработчика — отслеживать статус загрузки изображения ...
Читать
Сентябрь 2, 2015 г.
Хотите сделать галерею своими руками, без сторонних модулей в Drupal? Тогда читайте дальше.
Настроим поле для галереи
Для начала нам надо определиться, ...
Читать
Февраль 22, 2017 г.
Подбирал плагин, реализующий компонент для выбора диапазона чисел. Перебрал не мало "добра", были и некоторые довольно свежие плагины, но остановил свой ...
Читать