Javascript 通过发送POST参数在Ext JS 4中显示PDF

要使用Ext JS 4应用程序显示PDF文档，我使用以下代码（GET请求）：

现在我想显示一个PDF，它需要生成一个由POST请求发送的复杂JSON对象。我尝试发送一个带有JSON参数“myJsonParameter”的“ajax请求”，并显示结果。是否可以在窗口中显示request.responceText（其中包含我的PDF的二进制数据）

Ext.Ajax.request({
    url: 'getDocument.do',
    jsonData: myJsonParameter,
    binary: true,
    success: function(response, options){
        Ext.create("Ext.window.Window", {
            items: {
                xtype: 'component',
                html: '<embed width=100% height=100%' +
                    ' type="application/pdf"' +
                    ' src="data:application/pdf;' +
                    response.responseText +
                    '"></embed>'
            }
        }).show();
    }
});    

备注：我不知道这是否是一个好方法；欢迎任何帮助

提前谢谢

目前最好的解决方案是接收POST参数的iframe（但我找不到一种方法以JSON格式发送{toto:'abc'}）

var=this；
Ext.Ajax.request({
url:“”，
超时：120000，//可选
范围:即,，
参数：{
投资者id：投资者id，
场景id：场景id，
程序id：程序id，
行动:"po",，
操作：“生成”
},
故障：功能（响应）{
//处理故障条件
},
成功：功能（响应）{
var responseObj=Ext.JSON.decode（response.responseText）；
var isSuccess=responseObj.success；
var errorMsg=responseObj.errorMsg；
var url=responseObj.url；
如果（isSuccess==“false”）{
//处理故障条件
}否则{
//网址
var popUp=Ext.create（'Ext.window.window'{
//标题：false，
身高：800，
莫代尔：是的，
宽度：1024，
布局：'锚'，
主播：“100%100%”，
标题：“建议书输出”，
最大化：是的，
可最小化：正确
});
添加（{html:'}）；
popUp.add({
xtype:'按钮'，
宽度：'80'，
cls:“关闭按钮”，
处理程序：函数（）{
var win=Ext.WindowManager.getActive（）；
如果（赢）{
win.close（）；
}
}
});
popUp.show（）；
}
}
});

---

我们使用下面的代码生成，请尝试。

是否有任何特殊原因不使用查询字符串参数和您发布的第一个snipet？是的！对于字符串参数，我通常尽量不超过255个字符。”myJsonParameter大于此值，并且必须是JSON格式，因为“getDocument.do”是一个Spring应用程序请求，它将我的JSON对象映射为创建Java对象。您在服务器端正确获取了

myJsonParam

吗？您的PDF是否按预期生成。。。对不起，耽搁了这么长时间。。假期（：@third_eye:没问题，我也这么想！是的，我收到了预期的“myJsonParameter”。我和这篇文章有同样的问题：但是我必须在客户端机器上安装默认的PDF查看器来显示PDF；所以最好的解决方案是iframe。我将发布我使用的带有post参数的解决方案（没有JSON）因为我不能在这个问题上花太多时间。谢谢你的帮助！好吧，很高兴你修复了它（：我已经在寻找类似的解决方案：我在控制台的“Ext.JSON.decode”行收到一个JavaScript错误。错误是：Ext.JSON.decode（）：你正在尝试解码一个无效的JSON字符串：%PDF-1.4%�쏢 ...请求头=Accept:text/html，application/xhtml+xml，application/xml；q=0.9，/；q=0.8*接受编码：gzip，deflate*接受语言：en-US，en；q=0.5*缓存控制：无缓存*连接：保持活动*内容长度：8*内容类型：application/x-www-form-urlencoded；charset=UTF-8*用户代理：Mozilla/5.0（Windows NT 6.1；WOW64；rv:26.0）Gecko/20100101 Firefox/26.0*X-Requested-With:XMLHttpRequest@korgoth请检查您的服务器响应并更正它，这是唯一的解决方案。让我烦恼的是做一件基本的事情所需的工作量，例如能够显示生成的PDF！！！将测试您的解决方案。

Ext.Ajax.request({
    url: 'getDocument.do',
    jsonData: myJsonParameter,
    binary: true,
    success: function(response, options){
        Ext.create("Ext.window.Window", {
            items: {
                xtype: 'component',
                html: '<embed width=100% height=100%' +
                    ' type="application/pdf"' +
                    ' src="data:application/pdf;' +
                    response.responseText +
                    '"></embed>'
            }
        }).show();
    }
});    

Ext.create("Ext.window.Window", {
    items: {
        xtype: 'component',
        loader: {
            url: 'getDocument.do',
            autoLoad: true,
            ajaxOptions: {
                binary: true,
                jsonData: myJsonParam,
                headers: "application/pdf"
            }
        }
    }
}).show();

Ext.create('Ext.window.Window', {
    items: [{
        xtype: 'component',
        autoEl: {tag: 'iframe', name: 'myIframe'}
    },{
        xtype: 'form', hidden: true, 
        listeners: {
            afterrender: function(form){
                form.getForm().doAction('standardsubmit',{
                    target : 'myIframe', method : 'POST',
                    params: {toto: 'abc'},
                    url : '../myPath/getDocument.do'
                });
            }
        }
    }]
}).show();

    var that = this;
    Ext.Ajax.request({
        url: '<app url>',
        timeout: 120000, // optional
        scope : that,
        params: {
            investor_id:investor_id,
            scenario_id:scenario_id,
            prog_id:prog_id,
            action: 'po',
            operation: 'generate'
        },
        failure: function(response) {
            //handle failure condition
         },
         success: function(response){
            var responseObj = Ext.JSON.decode(response.responseText);
            var isSuccess = responseObj.success;
            var errorMsg = responseObj.errorMsg;
            var url = responseObj.url;

            if( isSuccess=="false" ) {
                //handle failure condition
            } else {
                //url
                var popUp = Ext.create('Ext.window.Window', {
                    //header:false,
                    height: 800,
                    modal:true, 
                    width: 1024,
                    layout:'anchor',
                    anchor:"100% 100%",
                    title:'Proposal Output',
                    maximizable: true,
                    minimizable: true
                });
                popUp.add({html: '<iframe height="730", width="1000" src="'+ url +'"></iframe>'});
                popUp.add({
                    xtype: 'button',
                    width: '80',
                    cls: 'close-button',
                    handler: function(){
                        var win = Ext.WindowManager.getActive();
                        if (win) {
                        win.close();
                        }
                    }
                });
                popUp.show();
            }
        }
 });