web-dev-qa-db-fra.com

Télécharger le fichier en utilisant jQuery

Comment puis-je demander un téléchargement à un utilisateur lorsqu'il clique sur un lien?.

Par exemple, au lieu de:

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

Je pourrais utiliser:

<a href="#">Download Here</a>

 $('a').click... //Some jquery to download the file

De cette façon, Google n'indexe pas mes fichiers HREF et privés.

Cela peut-il être fait avec jQuery, si oui, comment? Ou cela devrait-il être fait avec PHP ou quelque chose à la place?

jqueryfiledownload
107
Dodinas

Je pourrais suggérer ceci, en tant que solution plus dégradante, en utilisant 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>

Même s'il n'y a pas de Javascript, au moins de cette façon, l'utilisateur obtiendra des commentaires.

154
karim79

Si vous ne voulez pas que les moteurs de recherche indexent certains fichiers, vous pouvez utiliser robots.txt pour dire aux internautes de ne pas accéder à certaines parties de votre site Web.

Si vous utilisez uniquement le javascript, certains utilisateurs qui naviguent sans lui ne pourront pas cliquer sur vos liens.

22
Rob

Voici un bel article qui montre de nombreuses façons de cacher des fichiers aux moteurs de recherche:

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

JavaScript n'est pas un bon moyen de ne pas indexer une page; cela n'empêchera pas les utilisateurs de créer des liens directs avec vos fichiers (et donc de les révéler aux robots d'exploration) et, comme l'a mentionné Rob, cela ne fonctionnerait pas pour tous les utilisateurs.
Une solution facile consiste à ajouter l'attribut rel="nofollow", bien que là encore, il ne soit pas complet sans le fichier robots.txt.

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

Oui, vous devrez changer le window.location.href à l'URL du fichier que vous voulez télécharger.

window.location.href = 'http://www.com/path/to/file';
11
MacAnthony
 var link=document.createElement('a');
 document.body.appendChild(link);
 link.href=url;
 link.click();
9
EL missaoui habib

En indiquant window.location.href = 'uploads/file.doc';, vous indiquez où vous stockez vos fichiers. Vous pouvez bien sûr utiliser .htacess pour forcer le comportement requis pour les fichiers stockés, mais cela peut ne pas toujours être difficile ....

Il est préférable de créer un fichier php côté serveur et d'y placer ce contenu:

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

Ce code renverra TOUS les fichiers sous forme de téléchargement sans indiquer l'endroit où vous les stockez.

Vous ouvrez ce fichier php via window.location.href = 'scripts/this_php_file.php?f=downloaded_file';

6
Otvazhnii

  • Utilisation de la fonction jQuery

        var valFileDownloadPath = 'http//:'+'your url';

   window.open(valFileDownloadPath , '_blank');
3
Ganganath Rathnasekara

Iframes cachés peut aider

3
letronje

Je vous suggère d'utiliser l'événement mousedown, appelé avant l'événement click. De cette façon, le navigateur gère l'événement click naturellement, ce qui évite toute bizarrerie de code:

(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);
2
ling

Voir ici pour un article similaire sur l'utilisation de jQuery pour effacer des formulaires: Réinitialisation d'un formulaire à plusieurs étapes avec jQuery

Vous pouvez également rencontrer un problème où les valeurs sont remplies par la pile de valeurs struts. En d'autres termes, vous soumettez votre formulaire, vous faites n'importe quoi dans la classe d'action, mais vous n'effacez pas les valeurs de champ associées dans la classe d'action. Dans ce scénario, le formulaire semble conserver les valeurs que vous avez précédemment soumises. Si vous les persistez d'une manière ou d'une autre, annulez simplement chaque valeur de champ dans votre classe d'action après avoir persisté et avant de renvoyer SUCCESS.

0
Russell Shingleton