如何在通过 HttpMessageResponse 内容发送的 javascript 中显示服务器端生成的 PDF 流 [英] How to display a server side generated PDF stream in javascript sent via HttpMessageResponse Content

问题描述

在我的服务器端，我使用的是 ASP.NET MVC Web Api，我在其中使用 Crystal 报表生成 PDF 文件并将其导出为 PDF 格式.代码如下:

On my server side I am using ASP.NET MVC Web Api, where I am generating the PDF file with Crystal report and exporting it to PDF format. The code goes as follows:

[HttpPost]
public HttpResponseMessage SetReport(string name, [FromBody]List<KontoDto> konta)
{
            var response = Request.CreateResponse(HttpStatusCode.OK);
            var strReportName = "KontoReport.rpt";
            var rd = new ReportDocument();
            string strPath = HttpContext.Current.Server.MapPath("~/") + "Reports//" + strReportName;
            rd.Load(strPath);
            rd.SetDataSource(konta);
            var tip = ExportFormatType.PortableDocFormat;
            var pdf = rd.ExportToStream(tip);
           response.Headers.Clear();
            response.Content = new StreamContent(pdf);
            response.Content.Headers.ContentType = new MediaTypeHeaderValue("application/pdf");
            return response;

}

我的 Javascript 代码是:

My Javascript code is:

  $scope.xxprint = function () {
        console.log($scope.konta);
        $http.post('/api/konto/setReport/pdf', $scope.konta, { responseType: 'arraybuffer' })
            .success(function (data) {
                 var file = new Blob([data], { type: 'application/pdf' });
                var fileURL = URL.createObjectURL(file);
                window.open(fileURL);
            });
    };

这根本行不通.我不知道这段代码有什么问题.我让浏览器打开 pdf 查看器，但它是空的.此外，创建的 pdf 已正确创建，因为我可以将其保存到磁盘并使用 Adob​​e Acrobat 查看器打开它.通过 Fiddler 查看 HttpResponseMessage 的内容似乎也是正确的.见图片:

This simply does not work. I don't know what's wrong with this code. I get the browser to open the pdf viewer, but it is empty. Also, the created pdf is correctly created as I can save it to disk and open it then with Adobe Acrobat viewer. The content of the HttpResponseMessage seems also correct viewed via Fiddler. See image:

推荐答案

看来我一直都做对了.问题出在我的 angularjs 版本(v1.08)上.升级到 v1.2 时一切正常.在 v1.08 中，responseType: 'arraybuffer' 参数(这对我所做的事情至关重要)被 angularjs 简单地忽略了.它似乎从 v.1.1 开始实施.请参阅此 SO 问题:如何在 AngularJS 中读取二进制数据在 ArrayBuffer 中?

Seems I did it correctly all the time. The problem was with my angularjs version (v1.08). When upgrading to v1.2 everything worked ok. In v1.08 the responseType: 'arraybuffer' paramater (which is crucial to what I was doing) was simply ignored by angularjs. It seems to be implemented as of v.1.1. See this SO question: How to read binary data in AngularJS in an ArrayBuffer?

这篇关于如何在通过 HttpMessageResponse 内容发送的 javascript 中显示服务器端生成的 PDF 流的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！