Download bestand met jQuery

Hoe kan ik een download voor een gebruiker vragen wanneer ze op een link klikken.

Bijvoorbeeld, in plaats van:

<a href="uploads/file.doc">Download Here</a>

Ik zou kunnen gebruiken:

<a href="#">Download Here</a>
 $('a').click... //Some jquery to download the file

Op deze manier wordt Google mijn HREF’s en privébestanden niet ingesproken.

Kan dit met jQuery worden gedaan, zo ja, hoe? Of moet dit worden gedaan met PHP of in plaats daarvan?


Antwoord 1, Autoriteit 100%

Ik kan dit voorstellen, als een meer gracieuze vernederende oplossing, met behulp van preventDefault:

$('a').click(function(e) {
    e.preventDefault();  //stop the browser from following
    window.location.href = 'uploads/file.doc';
});
<a href="no-script.html">Download now!</a>

Zelfs als er geen javascript is, krijgt de gebruiker ten minste op deze manier wat feedback.


Antwoord 2, Autoriteit 13%

Als u niet wilt dat zoekmachines bepaalde bestanden indexeren, kunt u robots.txt Om Webspiders te vertellen om geen toegang te krijgen tot bepaalde delen van uw website.

Als u alleen op JavaScript vertrouwt, kunnen sommige gebruikers die zoeken zonder dat het niet op uw links klikt.


Antwoord 3, Autoriteit 10%

Hier is een leuk artikel dat veel manieren weergeeft om bestanden te verbergen van zoekmachines:

http://antezeta.com/news/avoid-search-engine-indexing

JavaScript is geen goede manier om een pagina niet te indexeren; het weerhoudt gebruikers er niet van om rechtstreeks naar uw bestanden te linken (en het dus aan crawlers te onthullen), en zoals Rob al zei, zou niet voor alle gebruikers werken.
Een eenvoudige oplossing is om het kenmerk rel="nofollow"toe te voegen, maar nogmaals, het is niet compleet zonder robots.txt.

<a href="uploads/file.doc" rel="nofollow">Download Here</a>

Antwoord 4, autoriteit 7%

Ja, u moet window.location.href wijzigen in de url van het bestand dat u wilt downloaden.

window.location.href = 'http://www.com/path/to/file';

Antwoord 5, autoriteit 7%

var link=document.createElement('a');
 document.body.appendChild(link);
 link.href=url;
 link.click();

Antwoord 6, autoriteit 5%

  • JQuery-functie gebruiken

       var valFileDownloadPath = 'http//:'+'your url';
       window.open(valFileDownloadPath , '_blank');
    

Antwoord 7, autoriteit 3%

Door window.location.href = 'uploads/file.doc';te vermelden, laat je zien waar je je bestanden opslaat. Je zou natuurlijk .htacess kunnen gebruiken om het vereiste gedrag voor opgeslagen bestanden te forceren, maar dit is misschien niet altijd handvol….

Het is beter om een server-side php-bestand te maken en deze inhoud erin te plaatsen:

header('Content-Type: application/octet-stream');
header('Content-Disposition: attachment; filename='.$_REQUEST['f']);
readfile('../some_folder/some_subfolder/'.$_REQUEST['f']); 
exit;

Deze code retourneert ELK bestand als download zonder te laten zien waar je het daadwerkelijk opslaat.

Je opent dit php-bestand via window.location.href = 'scripts/this_php_file.php?f=downloaded_file';


Antwoord 8, autoriteit 2%

Verborgen iframeskan helpen


Antwoord 9, autoriteit 2%

Ik raad je aan om de mousedown-gebeurtenis te gebruiken, die BEFORE de click-gebeurtenis wordt genoemd.
Op die manier verwerkt de browser de klikgebeurtenis op natuurlijke wijze, wat vreemde code vermijdt:

(function ($) {
    // with this solution, the browser handles the download link naturally (tested in chrome and firefox)
    $(document).ready(function () {
        var url = '/private/downloads/myfile123.pdf';
        $("a").on('mousedown', function () {
            $(this).attr("href", url);
        });
    });
})(jQuery);

Antwoord 10

Kijk hier voor een vergelijkbaar bericht over het gebruik van jQuery om formulieren te wissen: Een multi- podiumvorm met jQuery

U kunt ook een probleem tegenkomen waarbij de waarden opnieuw worden ingevuld door de struts-waardestapel. Met andere woorden, u dient uw formulier in, doet wat dan ook in de actieklasse, maar wist niet de gerelateerde veldwaarden in de actieklasse. In dit scenario lijkt het formulier de waarden te behouden die u eerder hebt ingediend. Als u deze op de een of andere manier volhoudt, kunt u elke veldwaarde in uw actieklasse op nul zetten nadat u deze hebt volgehouden en voordat u SUCCESS teruggeeft.


Antwoord 11

Je kunt dit heel gemakkelijk doen met html5:

var link = document.createElement('a');
link.href = "/WWW/test.pdf";
link.download = "file_" + new Date() + ".pdf";
link.click();
link.remove();

Other episodes