Как скачать файл с javascript?
Я хочу иметь возможность загружать данный файл при нажатии кнопки. Файл будет предоставлен через вызов API. На данный момент он будет у меня в локальном хранилище.
Итак, моя папка выглядит примерно так:
rootFolder
-JS file
-HTML file
-download file (`sample.csv`)
Как мне создать загрузочный link?
Я пробовал до сих пор с:
<a download = "sample.csv"></a>
Я также пытался использовать событие onclick:
<a download = "sample.csv" onclick = "download()"></a>
function download|(){
.....code that calls the `api`
}
Я не знаю, как подходят эти 2: the download API, если он есть, и обработчик событий click, если вы планируете делать дополнительную логику при загрузке.
Файл находится в файловой системе сервера в том месте, которое я описал.
Хорошо, тогда вам просто нужно сделать все правильно, и это должно работать ... Вам все еще нужно использовать атрибут href ссылки для ссылки на файл; download — это дополнительный атрибут, который вы добавляете. developer.mozilla.org/en-US/docs/Web/HTML/Element/a#Атрибуты
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 3
Вы можете предоставить ссылку на эту функцию для загрузки файла:
function downloadURI(uri, name)
{
var link = document.createElement("a");
link.download = name;
link.href = uri;
link.click();
}
А если файл лежит в моем локальном хранилище, то все равно работает?
что именно вы подразумеваете под локальным хранилищем? вы не используете какой-либо локальный сервер?
Вы можете сделать это через HTML <a href = "/path/to/sample.csv"></a>, но если вам нужно сделать это в JS, есть библиотека https://github.com/eligrey/FileSaver.js/.
поскольку ответ от @saibbyweb не работает во всех браузерах, когда я пишу это, я рекомендую другое, но похожее решение, проверенное и работающее в последних (на момент написания) Firefox, Chrome, Opera, Edge, Safari, мобильном Safari, мобильном Chrome :
function downloadUrl(url){
window.open(url, '_self');
}
Излишне говорить, что вы также можете открывать ссылки в новых вкладках с помощью _blank вместо _self, но вы потенциально пугаете блокировщиков всплывающих окон, открывая новые вкладки/окна с помощью Javascript.