如何在iframe中加载之前设置请求标头

时间:2012-06-05 08:13:25

标签: jquery iframe http-headers

我需要下载服务器将“内容处理”标题设置为“attachment”的文件。我使用jQuery.ajax用于GET,并将成功设置隐藏iframe srcurl,这为我提供了文件下载弹出窗口。它在所有浏览器中都运行良好。 现在我想在GET&之前更改自定义请求标头以加密文件下载。我为它使用了jQuery.ajax预请求回调函数beforeSend

我能够获取我在firebug中可以观察到的加密文件,但我的iframe仍然显示非加密文件供下载。检查后,我可以说iframe要求新的GET。

代码

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

这在Internet Explorer上运行良好。我如何强制iframe使用可用资源而不是请求新的GET。 或者我如何在iframe中 setRequestHeader 或者我真的需要jQuery.Ajax来完成此任务是否有任何最好的方法来下载直接从服务器设置为附件文件的Content-Disposition标头。< / p>

1 个答案:

答案 0 :(得分:0)

此解决方案不使用iframe或表单。它在支持CORS的资源上使用XHR和自定义标头(在本例中只是来自Internet的随机svg)。此方法的主要区别在于xhr.responseType = 'arraybuffer';以及包含blob href和download属性的链接:

jsfiddle

&#13;
&#13;
// 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');
});
&#13;
&#13;
&#13;

在Chrome57和FF54中测试过。