Come impostare le intestazioni di richiesta prima di essere caricato in un iframe

Question

È necessario scaricare un file con intestazione "Content-Disposition" su "attachment" dal server. Sto usando jQuery.ajax per GET e su impostazione di successo nascosto iframesrc a url, che mi dà un pop-up per il download di file. E funziona perfettamente con tutti i browser. Ora voglio modificare le intestazioni delle richieste personalizzate per crittografare il file prima di scaricare GET &. Ho usato la funzione di callback beforeSend per richiedere la funzione di richiamata .

Sono in grado di ottenere il mio file crittografato che posso osservare in firebug ma il mio iframe mostra ancora file non crittografato per il download. Dopo l'ispezione, posso dire che iframe richiede un nuovo GET.

Codice

$.ajax({ 
url: "/tutorial.text", 
beforeSend: function(xhr) { xhr.setRequestHeader("PASSWORD_HEADER", userPwd); }, 
success: function() { $("#Hidden_iframe").attr("src", this.url); }         
}); 

E questo sta lavorando bene su Internet Explorer. Come posso forzare iframe a utilizzare la risorsa disponibile anziché richiedere il nuovo GET. Oppure Come posso setRequestHeader in iframe o ho davvero bisogno di un jQuery.Ajax per questa attività c'è il modo migliore per scaricare l'intestazione Content-Disposition impostata sui file degli allegati direttamente dal server.

Answer 1

Questa soluzione non utilizza iframe o modulo. Usa XHR con intestazione personalizzata su una risorsa che supporta CORS (solo svg casuali da internet per questo esempio). Le differenze chiave di questo approccio è xhr.responseType = 'arraybuffer'; e un collegamento con blob href e download attributi:

jsfiddle

// some initial data 
 
var url = '//enable-cors.org/img/cloud-download.svg'; 
 
var password = '123456'; 
 

 
// download url into arrayBuffer 
 
function download (url, password, cb) { 
 
    var xhr = new XMLHttpRequest(); 
 
    xhr.open('GET', url, true); 
 
    xhr.responseType = 'arraybuffer'; 
 
    // xhr.setRequestHeader('PASSWORD_HEADER', password); 
 
    xhr.onload = function() { 
 
     cb(xhr.response); 
 
    }; 
 
    xhr.send(null); 
 
} 
 

 
// receive binary content of url 
 
// create blob link and click on it 
 
download(url, password, function (arrayBuffer) { 
 
    var file = new File([arrayBuffer], 'some filename'); 
 
    var a = document.createElement('A'); 
 
    a.setAttribute('href', window.URL.createObjectURL(file)); 
 
    a.setAttribute('download', 'file-name-of-download.ext'); 
 
    // in firefox `a.click()` works only if `a` element is in DOM, so... 
 
    document.documentElement.appendChild(a); 
 
    a.click(); 
 
    console.log('done'); 
 
});

testato in Chrome57 e FF54.