相关疑难解决方法(0)

我有一个基于jquery的单页webapp.它通过AJAX调用与RESTful Web服务进行通信.

我正在努力完成以下任务:

1. 将包含JSON数据的POST提交到REST URL.
2. 如果请求指定了JSON响应,则返回JSON.
3. 如果请求指定了PDF/XLS/etc响应,则返回可下载的二进制文件.

我现在有1和2工作,客户端jquery应用程序通过基于JSON数据创建DOM元素来显示网页中返回的数据.从Web服务的角度来看,我也有#3工作,这意味着如果给出正确的JSON参数,它将创建并返回二进制文件.但我不确定在客户端javascript代码中处理#3的最佳方法.

是否有可能从这样的ajax调用中获取可下载的文件？如何让浏览器下载并保存文件？

$.ajax({
    type: "POST",
    url: "/services/test",
    contentType: "application/json",
    data: JSON.stringify({category: 42, sort: 3, type: "pdf"}),
    dataType: "json",
    success: function(json, status){
        if (status != "success") {
            log("Error loading data");
            return;
        }
        log("Data loaded!");
    },
    error: function(result, status, err) {
        log("Error loading data");
        return;
    }
});

服务器响应以下标头:

Content-Disposition:attachment; filename=export-1282022272283.pdf
Content-Length:5120
Content-Type:application/pdf
Server:Jetty(6.1.11)

另一个想法是生成PDF并将其存储在服务器上并返回包含该文件的URL的JSON.然后,在ajax成功处理程序中发出另一个调用,执行以下操作:

success: function(json,status) {
    window.location.href = json.url;
}

但这样做意味着我需要对服务器进行多次调用,而我的服务器需要构建可下载的文件,将它们存储在某处,然后定期清理该存储区域.

必须有一种更简单的方法来实现这一目标.想法？

编辑:在查看$ .ajax的文档后,我看到响应dataType只能是其中之一xml, html, script, json, jsonp, text,所以我猜测没有办法使用ajax请求直接下载文件,除非我在使用中嵌入二进制文件@VinayC答案中建议的数据URI方案(这不是我想做的事情).

所以我想我的选择是:

1. 不使用ajax而是提交表单帖子并将我的JSON数据嵌入到表单值中.可能需要搞乱隐藏的iframe等.

2. 不使用ajax而是将我的JSON数据转换为查询字符串以构建标准GET请求并将window.location.href设置为此URL.可能需要在我的单击处理程序中使用event.preventDefault()以防止浏览器从应用程序URL更改. …

我有一个包含各种文本字段和两个按钮的表单 - 导出到Excel并导出为CSV.

用户可以将值提供给表单中的不同字段,然后单击其中一个按钮.

预期的行为是应该触发Ajax请求,并将字段值作为参数,并且应该下载所选文件(按钮点击的Excel/CSV)(我没有提交表单,因为需要在提交前的值).

我一直在使用以下代码成功下载Ajax请求的代码:

result  =   Ext.decode(response.responseText);

try {
    Ext.destroy(Ext.get('testIframe'));
}

catch(e) {}

Ext.core.DomHelper.append(document.body, {
    tag: 'iframe',
    id:'testIframe',
    css: 'display:none;visibility:hidden;height:0px;',
    src: result.filename,
    frameBorder: 0,
    width: 0,
    height: 0
});

在文件是在服务器上物理创建的情况下,上面的代码工作正常.但是在我当前的项目中,文件不是在服务器上创建的,而是使用正确的标题将内容流式传输到浏览器.

因此,当文件在服务器上不存在时,有没有办法使用Ajax下载文件？只是补充一点,我有一长串参数需要发送到服务器,因此无法将它们全部添加到iframe的src中.

任何人都可以指导这个吗？

在此先感谢您的帮助.