Скачать файл, используя Javascript / jQuery

Question

У меня очень похожее требование указано здесь .

Мне нужно, чтобы браузер пользователя запускал загрузку вручную, когда $('a#someID').click();

Но я не могу использоватьwindow.href, поскольку он заменяет содержимое текущей страницы файлом, который вы пытаетесь загрузить.

Вместо этого я хочу открыть загрузку в новом окне / вкладке.Как это возможно?

Answer 1

С помощью тега привязки и PHP это можно сделать, проверьте ответ

JQuery Ajax для загрузки файла PDF

HTML
    <a href="www.example.com/download_file.php?file_source=example.pdf">Download pdf here</a>

PHP
<?php
$fullPath = $_GET['fileSource'];
if($fullPath) {
    $fsize = filesize($fullPath);
    $path_parts = pathinfo($fullPath);
    $ext = strtolower($path_parts["extension"]);
    switch ($ext) {
        case "pdf":
        header("Content-Disposition: attachment; filename=\"".$path_parts["basename"]."\""); // use 'attachment' to force a download
        header("Content-type: application/pdf"); // add here more headers for diff. extensions
        break;
        default;
        header("Content-type: application/octet-stream");
        header("Content-Disposition: filename=\"".$path_parts["basename"]."\"");
    }
    if($fsize) {//checking if file size exist
      header("Content-length: $fsize");
    }
    readfile($fullPath);
    exit;
}
?>

Я проверяю размер файла, потому что если вы загружаете pdf из облачного фронта CDN, вы не получите размер документа, который вынуждает документ загружаться в 0 КБ. Чтобы избежать этого, я проверяю это условие

 if($fsize) {//checking if file size exist
      header("Content-length: $fsize");
    }

Answer 2

Я использую решение @ rakaloof без JQuery (потому что вам здесь не нужно ).Спасибо за идею!Вот решение на основе форм vanillaJS:

const uri = 'https://upload.wikimedia.org/wikipedia/commons/b/bb/Test_ogg_mp3_48kbps.wav';
let form = document.createElement("form");
form.setAttribute('action', uri);
document.body.appendChild(form);
form.submit();
document.body.removeChild(document.body.lastElementChild);

Answer 3

Firefox и Chrome протестированы:

var link = document.createElement('a');
link.download = 'fileName.ext'
link.href = 'http://down.serv/file.ext';

// Because firefox not executing the .click() well
// We need to create mouse event initialization.
var clickEvent = document.createEvent("MouseEvent");
clickEvent.initEvent("click", true, true);

link.dispatchEvent(clickEvent);

На самом деле это "хромированный" способ для Firefox (я не тестировал его в других браузерах, поэтому, пожалуйста, оставляйте комментарии о скомпилируемости)

Answer 4

Я знаю, что опаздываю на вечеринку, но я хотел бы поделиться своим решением, которое является вариантом решения Imagine Breaker выше. Я пытался использовать его решение, потому что его решение кажется мне наиболее простым и легким. Но, как говорили другие, в некоторых браузерах это не сработало, поэтому я добавил некоторые изменения, используя jquery.

Надеюсь, это может кому-то помочь.

function download(url) {
  var link = document.createElement("a");
  $(link).click(function(e) {
    e.preventDefault();
    window.location.href = url;
  });
  $(link).click();
}

Answer 5

Примечание. Поддерживается не во всех браузерах.

Я искал способ загрузить файл с помощью jquery без необходимости устанавливать URL-адрес файла в атрибуте href с самого начала.

jQuery('<a/>', {
    id: 'downloadFile',
    href: 'http://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon@2.png',
    style: 'display:hidden;',
    download: ''
}).appendTo('body');

$("#downloadFile")[0].click();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>