L'attributo di download con un nome di file non funziona?

Question

L'attributo di download viene utilizzato per fare in modo che i browser scarichino la risorsa a cui punta un'ancora piuttosto che navigare verso di essa. E come opzione, può essere fornito un nuovo nome di file per il file scaricato.

Nota che non tutti i browser supportano questo. Vedi http://caniuse.com/#feat=download

Supponiamo che abbiamo avuto il seguente link anchor:

<a href="http://video-js.zencoder.com/oceans-clip.mp4" download="video.mp4"> download </a> 

Facendo clic sul link, mi sarei aspettato di scaricare il file con il nome, video.mp4. Ma il vero nome del file, che è oceans-clip.mp4 è stato usato per il file scaricato. Sai perché il nuovo nome del file non è stato usato qui? (l'ho provato con Chrome)

Grazie!

Answer 1

Secondo HTML element reference->[a]

Può essere utilizzato con blob: URL e dei dati: gli URL, per rendere più facile per gli utenti di scaricare contenuti che viene generato a livello di codice utilizzando JavaScript (ad esempio, un quadro realizzato utilizzando un Web di disegno online app).

Se l'intestazione HTTP Content-Disposition: è presente e fornisce un nome file diverso da questo attributo, l'intestazione HTTP ha la priorità su questo attributo.

Se questo attributo è presente e Content-Disposition: è impostato su inline, Firefox dà priorità a Content-Disposition, come per il caso del nome del file, mentre Chrome dà priorità all'attributo di download.

Questo attributo è onorato solo per i collegamenti a risorse con la stessa origine.

Non è della stessa origine, quindi non funzionerà.

Answer 2

Questo in realtà è possibile con JavaScript, anche se il supporto del browser sarebbe discutibile. Puoi usare XHR2 per scaricare il file dal server al browser come Blob, creare un URL per Blob, creare un'ancora con la sua proprietà href e impostarla su quell'URL, impostare la proprietà di download su qualunque nome di file desideri che sia essere, quindi fare clic sul collegamento. Funziona su Google Chrome, ma non ho verificato il supporto in altri browser.

window.URL = window.URL || window.webkitURL; 

var xhr = new XMLHttpRequest(), 
     a = document.createElement('a'), file; 

xhr.open('GET', 'someFile', true); 
xhr.responseType = 'blob'; 
xhr.onload = function() { 
    file = new Blob([xhr.response], { type : 'application/octet-stream' }); 
    a.href = window.URL.createObjectURL(file); 
    a.download = 'someName.gif'; // Set to whatever file name you want 
    // Now just click the link you created 
    // Note that you may have to append the a element to the body somewhere 
    // for this to work in Firefox 
    a.click(); 
}; 
xhr.send();