Express Angular - 提供 PDF

Question

我正在开发一个 MEAN 堆栈应用程序，我正在尝试在前端 (Angular) 中显示来自后端 (Express) 的 pdf。但是每次，文件在传输过程中都会损坏。有人有想法吗？ 这是我的代码（简化）：

后端：

import * as express from "express";
import * as fs from "fs";

myController.getPdf(req:express.Request, res:express.Response):void {
    res.setHeader('Content-Type', 'application/pdf');
    res.setHeader('Content-Length', fs.statSync('myPdf.pdf').size);
    fs.createReadStream('myPdf.pdf).pipe(res);
}

前端：

import {Http,ResponseContentType} from "@angular/http";

constructor(@Inject(Http) private _http:Http) {}

this._http.get('ENDPOINT', {responseType: ResponseContentType.ArrayBuffer})
    .map(response => {
        window.open(URL.createObjectURL(
            new Blob([response],{type:'application/pdf'})
))});

编辑：中间件：

import * as compression from "compression";
import * as zlib from "zbil";
import * as express from "express";
import * as bodyParser from "body-parser";
import * as session from "express-session";
import * as passport from "passport";
import * as morgan from "morgan";
import * as helmet from "helmet";

application: express.Application;
let _root = process.cwd();

application.use(compression({
    level: zlib.Z_BEST__COMPRESSION,
    threshold: "1kb"
}));
application.use(express.static(_root + "/node_modules/"));
application.use(express.static(_root + "/jspm_packages/"));
application.use(express.static(_root + "/client/dev/"));
application.use(bodyParser.json());
application.use(session({
    secret: 'abcd',
    saveUnitialized: true,
    resave: true,
}));
application.use(passport.initialize());
application.use(passport.session());
application.use(morgan("dev"));
application.use(helmet());

Answer 1

知道了！

使用 fs.statSync('myFile.pdf').size 作为 Content-Length 效果很好。

问题出在另一端：必须将响应映射到 blob() 函数：

this._http.get(ENDPOINT, {responseType: ResponseContentType.ArrayBuffer})
    .map(response => {
        window.open(URL.createObjectURL(
            new Blob(response.blob(), {type:'application/pdf'}));
    });

Answer 2

我认为，您的“Content-Length”标头无效。文件系统的 size 方法以字符返回字符串长度。

一些 UTF-8 字符包含多个字节。

更好的方法是使用来自http://nodejs.org/api/buffer.html 的 Buffer.byteLength(string, [encoding])。它是一个类方法，因此您不必创建任何 Buffer 实例。