Sfat rapid Folosind atributul descărcare HTML5

Crearea unui link de descărcare în HTML este simplu; adăugați o etichetă de ancorare și indicați fișierul în href atribut. Cu toate acestea, unele tipuri de fișiere (cum ar fi imagini, .pdf, .txt și .doc) nu vor fi descărcate. În schimb, acestea vor fi deschise în browser.

Dacă aveți acces la serverul de pe site-ul dvs., există unele soluții pe care le puteți utiliza, cum ar fi configurarea .htaccess, pentru a descărca direct aceste fișiere. Dacă site-ul dvs. este găzduit cu un serviciu gratuit, cum ar fi paginile WordPress.com, Blogspot sau, probabil, paginile Github care nu vă permit să faceți acest lucru, luați în considerare utilizarea Descarca atribut.

Utilizând atributul "Descărcare"

 Descarca atributul face parte din spec. HTML5 și exprimă un link ca Descarca link mai degrabă decât a de navigaţie legătură.

 Descarca atribut vă permite de asemenea să redenumiți numele fișierului la descărcare. Când fișierul se află pe server, mai ales dacă a fost generat automat, acesta poate fi denumit sistematic cu numere și liniuțe, de exemplu Acme-doc-2.0.1.txt. Ar fi mai bine pentru utilizatori să primească fișierul cu un nume mai sensibil când este descărcat, poate ca: Documentația Acme (versiunea 2.0.1) .txt (nu uitați extensia fișierului).

Iată cum ar arăta acest lucru în practică:

Descărcați text 

Faceți o încercare pe pagina demo și ar trebui să găsiți fișierul descărcat cu numele specificat în Descarca atribut.

O pereche de note:

  • Firefox permite numai utilizatorilor să descarce fișiere de aceeași origine datorită unei preocupări de securitate. Fișierul trebuie să provină de la propriul dvs. server sau nume de domeniu, altfel va fi deschis în browser.
  • În timp ce descărcarea fișierelor de origine încrucișată este permisă în Chrome și în cea mai recentă versiune de Opera (cu Chromium / Blink), ambele vor ignora valoarea atributului. Cu alte cuvinte, numele fișierului va rămâne neschimbat.

Furnizarea de Fallback

La momentul scrierii, Descarca atributul nu este încă implementat în Safari și (așa cum vă puteți aștepta) pe Internet Explorer. Spunând că, în conformitate cu statutul de IE modern, acesta este în prezent în fruntea listei de dezvoltare și primind multe voturi. 

Între timp, putem adăuga o schimbare decentă, cum ar fi furnizarea de instrucțiuni suplimentare sub link-ul de descărcare pentru browserele care nu sunt compatibile. Pentru a face acest lucru, va trebui să descărcați Modernizr împreună cu Descarca caracteristică inclusă.

Configurați construirea Modernizr.

Apoi putem adăuga următorul scenariu.

dacă (! Modernizr.adownload) var $ link = $ ('a'); $ link.each (functie () var $ download = $ (acest) .attr ('download'); '
') .addClass ("instrucțiune de descărcare"). text ("Faceți clic dreapta și selectați" Descărcați fișierul conectat "); $ El.insertAfter ($ (aceasta)); );

Scriptul va testa dacă browserul acceptă Descarca atribut; dacă nu, va adăuga un nou 

 cu clasa pentru scopuri de styling, precum și textul de instrucțiuni, și introduceți-l imediat sub orice legătură care a fost furnizată cu Descarca atribut.

Instrucțiunea de text apare în Safari.

Înfășurarea în sus

 Descarca atributul face ca manevrele de descărcare să fie foarte convenabile pentru oricine nu are acces la configurația de pe server. Aștept cu nerăbdare să pun în aplicare Internet Explorer și Safari Descarca atribuiți în curând!