Descărcarea fișierelor folosind jQuery (Programare, Jquery, Fișier, Descărcați)

Dodinas a intrebat.

Cum pot solicita o descărcare pentru un utilizator atunci când acesta face clic pe un link.

De exemplu, în loc de:

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

Aș putea folosi:

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

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

În acest fel, Google nu-mi indexează HREF-urile și fișierele private.

Se poate face acest lucru cu jQuery, dacă da, cum? Sau ar trebui să se facă în schimb cu PHP sau altceva?

Comentarii

  • Posibil duplicat al Download File Using Javascript/jQuery –  > Por Liam.
10 răspunsuri
karim79

Aș putea sugera acest lucru, ca o soluție mai grațios degradantă, folosind 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>

Chiar dacă nu există Javascript, cel puțin în acest fel utilizatorul va primi un feedback.

Comentarii

  • Mulțumesc, asta este ceea ce căutam. De obicei folosesc „preventDefault”, doar că am omis-o mai sus pentru că am fost leneș. 😉 –  > Por Dodinas.
  • Funcționează foarte bine, dar primesc unele erori de tip MIME. Curios dacă există vreo modalitate de a trece de ele? –  > Por Nathan Hangen.
  • Ați rezolvat avertismentul de tip MIME? Primesc „Resursă interpretată ca document, dar transferată cu tipul MIME…” Mulțumesc mult. –  > Por utilizator1824269.
Rob

Dacă nu doriți ca motoarele de căutare să indexeze anumite fișiere, puteți utiliza robots.txt pentru a le spune păianjenilor web să nu acceseze anumite părți ale site-ului dvs. web.

Dacă vă bazați doar pe javascript, atunci unii utilizatori care navighează fără javascript nu vor putea să dea clic pe linkurile dvs.

Comentarii

  • Este bine de știut despre „robots.txt”. Vă mulțumesc. –  > Por Dodinas.
  • @Rob, Dacă aveți nevoie ca URL-urile să fie „private”, robots.txt nu ar ajuta, deoarece ar fi în continuare stocate în istoricul browserului și în serverele intermediare. –  > Por Pacerier.
  • 6 ani mai târziu: navigarea fără javascript? – ei bine, ai putea, de asemenea, să te plimbi în schimb. –  > Por low_rents.
  • aproape 10 ani mai târziu: la fel! sau ?  > Por toing_toing.
Kobi

Iată un articol drăguț care arată mai multe modalități de a ascunde fișierele de motoarele de căutare:

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

JavaScript nu este o modalitate bună de a nu indexa o pagină; nu va împiedica utilizatorii să se lege direct la fișierele dvs. (și astfel să le dezvăluie crawlerelor) și, așa cum a menționat Rob, nu ar funcționa pentru toți utilizatorii.
O soluție simplă este adăugarea funcției rel="nofollow" atribut, deși, din nou, nu este completă fără robots.txt.

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

Comentarii

MacAnthony

Da, ar trebui să schimbați window.location.href cu url-ul fișierului pe care doriți să îl descărcați.

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

Comentarii

  • ce se întâmplă dacă extensia fișierului este .html, în loc de download se va redirecționa către acel fișier html –  > Por Kaleem Nalband.
EL missaoui habib
 var link=document.createElement('a');
 document.body.appendChild(link);
 link.href=url;
 link.click();

Comentarii

  • nu a apărut nicio eroare, doar că nu a început descărcarea. cred că poate îmi scapă vreun punct în timpul creării elementului. –  > Por shyammakwana.me.
  • verificați în html dacă a fost creat sau nu un element <a> și verificați link-ul fișierului. –  > Por EL missaoui habib.
  • un tag a fost acolo, în body. și prin click manual se descarcă imaginea. totuși nu este necesar acum, am folosit această soluție vanillaJS. –  > Por shyammakwana.me.
  • nu există niciun motiv pentru care nu funcționează sunt link-urile corecte . testați link-ul direct în browse –  > Por EL missaoui habib.
  • $('blah').each(function(){ $('body').append('<a href="'+xxx+'" download="'+dynamicname+'" />'); }) $('a').trigger('click'); am folosit asta. –  > Por shyammakwana.me.
Ganganath Rathnasekara
  • Utilizarea funcției jQuery

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

Comentarii

  • Bună, acesta va deschide o nouă filă, cum dacă nu doriți să deschideți o nouă filă, doar descărcați direct când faceți clic? deja eliminați _blank dar nici o acțiune. –  > Por mastersuse.
Otvazhnii

Prin declararea window.location.href = 'uploads/file.doc'; arătați unde vă stocați fișierele. Desigur, ați putea folosi .htacess pentru a forța comportamentul necesar pentru fișierele stocate, dar acest lucru ar putea să nu fie întotdeauna la îndemână….

Este mai bine să creați un fișier php pe partea serverului și să plasați acest conținut în el:

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

Acest cod va returna orice fișier ca fiind descărcat, fără a arăta unde îl stocați de fapt.

Deschideți acest fișier php prin window.location.href = 'scripts/this_php_file.php?f=downloaded_file';

Comentarii

  • Această soluție m-a ajutat să rezolv problemele de descărcare de pe site-ul meu, mulțumesc! –  > Por Denniz.
  • Mulțumesc foarte mult, răspunsul tău mi-a rezolvat problema! Prea multe referințe pe care le-am încercat, dar nimic nu mă ajută. –  > Por mastersuse.
letronje

Iframele ascunse pot ajuta

Comentarii

  • var redeemFrame = document.createElement(„iframe”); var src = „doDownload.php”; redeemFrame.setAttribute(„src”,src); redeemFrame.setAttribute(„style”, „display: none”); document.body.appendChild(redeemFrame); –  > Por DarthRez.
ling

Vă sugerez să folosiți evenimentul mousedown, care este apelat ÎNAINTE de evenimentul click. în acest fel, browserul gestionează evenimentul click în mod natural, ceea ce evită orice ciudățenie de cod:

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

Russell Shingleton

Vedeți aici pentru o postare similară privind utilizarea jQuery pentru a șterge formulare: Resetarea unui formular în mai multe etape cu jQuery

De asemenea, este posibil să vă confruntați cu o problemă în care valorile sunt repopulate de către stiva de valori struts. Cu alte cuvinte, trimiteți formularul, faceți orice în clasa de acțiune, dar nu ștergeți valorile câmpurilor aferente în clasa de acțiune. În acest scenariu, formularul ar părea să mențină valorile pe care le-ați trimis anterior. Dacă le păstrați într-un fel sau altul, anulați fiecare valoare de câmp în clasa de acțiune după ce ați păstrat și înainte de a returna SUCCES.