在新的浏览器选项卡中打开pdf内容

时间:2014-12-12 10:56:20

标签: javascript jquery ajax pdf

我有一个GET Ajax请求,它返回一个内容,以application / pdf格式编码。 例如,我的请求返回一个这种类型的字符串:

  

%PDF-1.4% 40 obj<>流   x ndndstreamendobj 6 0 obj<>streamx ]o 0 + e{Q $ R N @ -   nwBL $ .JDL |>獝[   > {= _'(寒1`ؚyWGXϽo16Ӳ.4(uC8jHl F6 * KFA ^ TEG = J0}   7L z p H & ɴ L Z

请原谅我渲染的特殊字符:问题就是这样。我想从我的请求中获取此响应,并在另一个浏览器选项卡中正确打印此内容。我编写了代码来执行此操作:我使用了Blob对象。正确打开“阅读pdf”页面。但是,我只看到一个完全白色的pdf文档,这表明我的回复没有写在已创建的文档上。

下面我将向您展示我的请求代码:

$.ajax({
    type: "GET",
    url:urll + parameter,
    async: true,
    crossDomain: true,
    accept: {
          pdf: 'application/pdf'
    },
    success:function(response, status, xhr){

        alert("Response: "+response);
        alert("Status: "+status);
        alert("Xhr: "+xhr);

        // check for a filename
        var filename = "";
        var disposition = xhr.getResponseHeader('Content-Disposition');
        if (disposition && disposition.indexOf('attachment') !== -1) {
            var filenameRegex = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/;
            var matches = filenameRegex.exec(disposition);
            if (matches != null && matches[1]) filename = matches[1].replace(/['"]/g, '');
        }

        var type = xhr.getResponseHeader('Content-Type');
        var blob = new Blob([response], { type: type });

        if (typeof window.navigator.msSaveBlob !== 'undefined') {
            // IE workaround for "HTML7007: One or more blob URLs were revoked by closing the blob for which they were created. These URLs will no longer resolve as the data backing the URL has been freed."
            window.navigator.msSaveBlob(blob, filename);
        } else {
            var URL = window.URL || window.webkitURL;
            var downloadUrl = URL.createObjectURL(blob);

            if (filename) {
                // use HTML5 a[download] attribute to specify filename
                var a = document.createElement("a");
                // safari doesn't support this yet
                if (typeof a.download === 'undefined') {
                    //window.location = downloadUrl;
                    window.open(downloadUrl, '_blank');
                } else {                        
                    a.href = downloadUrl;
                    a.download = filename;
                    document.body.appendChild(a);
                    a.setAttribute("target","_blank");
                    a.click();
                }
            } else {
                //window.location = downloadUrl;
                window.open(downloadUrl, '_blank');
            }

            setTimeout(function () { URL.revokeObjectURL(downloadUrl); }, 100); // cleanup
        }
    },
    error: function(xhr,status,error){
        alert("error "+xhr+" "+error+" "+status);
    }
});

2 个答案:

答案 0 :(得分:0)

据我了解,您使用GET并在新标签中需要pdf文件。 Soo ...你为什么不在这样的新窗口中打开这个网址

var fullUrl = urll + parameter;
window.open(fullUrl);

答案 1 :(得分:0)

我在使用AngularJS时遇到了类似的问题($ resource和$ http)。我的解决方案是设置responseType: 'arraybuffer'。这是XMLHttpRequest的一部分(参见https://xhr.spec.whatwg.org/#interface-xmlhttprequest),但jQuery没有公开它。

您可以使用此插件将其添加到jQuery:https://github.com/henrya/js-jquery/tree/master/BinaryTransport

正如我所说,这对AngularJS有用。希望它也是您正在寻找的解决方案:)