JavaScript:如何通过 AJAX 打开返回的文件

Question

这类似于:How to open a file using JavaScript?

目标:通过双击图像检索/打开文件

function getFile(filename){
   // setting mime this way is for example only
   var mime = 'application/vnd.openxmlformats-officedocument.wordprocessingml.document';
   
   jQuery.ajax({ url      : 'get_file.pl',
                 data     : {filename:filename}, 
                 success  : function(data){
                               var win = window.open('','title');
                               win.document.open(mime);
                               win.document.write(data);
                               win.document.close();
                            }
               });
}

jQuery('#imgID').dblclick(function(){ 
   getFile('someFile.docx');
});

我正在做这件事，但我认为上面的方法适用于文本文件，但不适用于二进制文件。是否有插件可以正确执行此操作？理想的情况是在浏览器(或应用程序)中打开文件，而不是下载文件，但我怀疑这是一个梦想。如果必须使用保存/打开对话框下载文件，那很好。

---

编辑:

我忘记提及的一条信息是我希望这是一个 POST 请求。这就是我一开始关注 AJAX 的部分原因。我已经看到创建表单/iframe 来执行类似操作的解决方法，但我一直在寻找更好的返回信息处理程序。

Answer 1

在我看来，没有理由通过 AJAX 执行此操作。只需打开新窗口到 get_file.pl?filename=... 并让浏览器处理它。如果用户有能够处理 Content-Type 的插件通过get_file.pl发送，文件将显示；否则，它应该像任何其他文件一样下载。

function getFile(filename) {
   window.open('get_file.pl?filename=' + filename,'title');
}

jQuery('#imgID').dblclick(function() { 
   getFile('someFile.docx');
});

---

编辑:如果你想POST到你的脚本，you can do it与一些<form>黑客:

function getFile(filename) {
    var win = 'w' + Math.floor(Math.random() * 10000000000000);
    window.open('', win,'width=250,height=100');
    var f = $('<form></form>')
            .attr({target: win, method:'post', action: 'get_file.pl'})
            .appendTo(document.body);

    var i = $('<input>')
            .attr({type:'hidden',name:'filename',value:filename})
            .appendTo(f);

    f[0].submit();
    f.remove();
}

当然，这有点愚蠢，因为无法使用开发人员工具隐藏您的数据以防“窥探”。如果您的文件名确实很敏感，请向客户端发出访问 token ，并在您的服务器脚本中查找数据。