pdf - Angular2 显示 PDF

Question

我有一个带有 ASP.Net Web API 的 angular2 项目。我有代码从我的数据库中检索文件路径，该文件路径转到我服务器上的文档。然后我想在浏览器的新选项卡中显示此文档。有人对如何执行此操作有任何建议吗？

我很高兴在 Angular2 (Typescript) 或我的 API 中检索文件并将其流式传输。

这是我在我的 API 中检索它的尝试，但我不知道如何在 Angular2 中接收它并正确显示它:

public HttpResponseMessage GetSOP(string partnum, string description)
    {
        var sopPath = _uow.EpicorService.GetSOP(partnum, description).Path;
        HttpResponseMessage result = new HttpResponseMessage(HttpStatusCode.OK);
        var stream = new FileStream(sopPath, FileMode.Open);
        result.Content = new StreamContent(stream);
        result.Content.Headers.ContentType = new System.Net.Http.Headers.MediaTypeHeaderValue("application/octet-stream");
        return result;
    }

如有任何帮助，我们将不胜感激。

非常感谢!!!

Answer 1

首先，您需要为您的 http 请求设置选项 - 将 responseType 设置为 ResponseContentType.Blob，使用 blob() 来将响应读取为 blob 并将其类型设置为 application/pdf:

downloadPDF(): any {
    return this._http.get(url, { responseType: ResponseContentType.Blob }).map(
    (res) => {
            return new Blob([res.blob()], { type: 'application/pdf' })
        }
}

然后，为了获取该文件，您需要订阅它并且您可以创建新的ObjectURL并使用window.open() 在新标签页中打开 PDF:

this.myService.downloadPDF().subscribe(
        (res) => {
        var fileURL = URL.createObjectURL(res);
        window.open(fileURL);
        }
    );