Javascript 是否从XMLHttpRequest阻止内容处置附件?
我想从我编写的C#Web服务器对png文件执行javascript xhr请求。 这是我使用的代码Javascript 是否从XMLHttpRequest阻止内容处置附件?,javascript,content-disposition,Javascript,Content Disposition,我想从我编写的C#Web服务器对png文件执行javascript xhr请求。 这是我使用的代码 var imgUrl = "http://localhost:8085/AnImage.png?" + now; var request = new XMLHttpRequest(); request.open('GET', imgUrl, false); request.send(); // this is in a try/catch 在服务器端,我发回文件并
var imgUrl = "http://localhost:8085/AnImage.png?" + now;
var request = new XMLHttpRequest();
request.open('GET', imgUrl, false);
request.send(); // this is in a try/catch
在服务器端,我发回文件并添加内容处置头。
我得到以下答复
我确保在内容类型之后的标题中附加内容处置(屏幕截图来自Firebug,它按字母顺序追加)
结果是没有触发任何对话框,我是否在响应中遗漏了什么
编辑:
出于几个原因,我想用javascript执行所有操作。
第一:我不想展示图像,我想把一切都隐藏起来。
第二:请求图像时,我希望仅在特定请求时添加内容配置。此类请求用“警告”标题标记,标题值为“AttachmentRequest”
我认为当请求通过XHR时,
Content Disposition
不会触发任何文件保存对话框。使用XHR意味着您将在代码中处理结果
如果希望提示用户将图像保存到文件中,我已经成功地使用了此技术:
window.open("http://localhost:8085/AnImage.png?" + now);
它的缺点是,它会短暂地闪烁一个空白的打开窗口,直到标题到达,然后新窗口关闭并出现“保存文件”对话框
使用iframe
可防止车窗闪烁:
var f = document.createElement('iframe');
f.style.position = "absolute";
f.style.left = "-10000px";
f.src = "http://localhost:8085/AnImage.png?" + now;
document.body.appendChild(f);
另外,我想知道内容处置对img
元素的处理有什么影响(如果有):
var img = document.createElement('img');
img.style.position = "absolute";
img.style.left = "-10000px";
img.src = "http://localhost:8085/AnImage.png?" + now;
document.body.appendChild(img);
我没有尝试过,但是浏览器可能会尊重标题。您需要确保在所有希望支持的浏览器上进行测试。为什么需要这样做?您只需使用图像对象加载图像,无需Ajax。@camus完全不同。像这样使用内容配置
应该“强制”用户下载文件,而不仅仅是让浏览器“下载”文件itself@Ian使用ajax也不会强制执行任何操作。@加缪这是问题的关键。如何让它强制下载。但无论哪种方式,AJAX都不是必需的,除非有某种表单帖子,他们需要生成图像或其他东西(这里看起来不是这样),我的观点仍然站得住脚,你不能使用ajax来实现这一点。我认为没有窗口的情况下通常是这样做的。open
/flash带有iframe…但仍然使用内容配置appendChild解决方案不起作用,但window.open技巧在我们想要使用的浏览器(FF、Chrome和IE)上运行良好。非常感谢TJ@Ian:好的,是的(令人尴尬的是,在我的例子中,几乎总是有一个帖子涉及,所以它更复杂)。谢谢,我已经更新了答案。@malber:很高兴这有帮助!你也可以尝试一个iframe
(我已经更新了答案,在上面的评论中我链接了我的另一个答案,以便描述一种在下载开始之前显示“片刻”div或类似div的技术…)。TJ iframe技巧非常有效,谢谢!请您替换文件.body.appendChild(img);要记录.body.appendChild(f);请在第一段代码中?
var img = document.createElement('img');
img.style.position = "absolute";
img.style.left = "-10000px";
img.src = "http://localhost:8085/AnImage.png?" + now;
document.body.appendChild(img);