2

我正在使用 Angular2 从我的快速服务器下载生成的 .docx 文件。该文件由工具生成并保存在服务器上，然后发送到前端。

我的浏览器日志显示结果的长度大于 0，但发送的 blob 没有正文，因此无法找到文档的实际内容。

我已经关注了几个示例和教程，尤其是这个，但到目前为止还没有结果。我究竟做错了什么？

快递后台：

generate(req: express.Request, res: express.Response): void {
    try {
        var docxGenerator = new DocxGenerator();
        docxGenerator.generate((error, filename) => {
            if (error) res.send(error);
            if (filename) { 
                res.setHeader('Content-Type', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document');
                res.setHeader('Content-disposition', 'attachment; filename=GeneratedFile.docx');
                var file = fs.readFileSync(filename);
                res.end(file);
            }
        });
    } catch (error) {
        res.send(error);
    }
}

Angular2服务：

export class DocxTemplaterService {

// declarations left out for brevity

constructor(
    private http: Http,
    private authService: AuthenticationService
) {
    this.headers = new Headers({'Content-Type': 'application/json'});
    this.headers.append('Authorization', 'Bearer ' + this.authService.token());
    this.options = new RequestOptions({ headers: this.headers });
}

generateDocx(): Observable<any> {
    this.options.responseType = ResponseContentType.Blob;
    return this.http
        .post(this.docxUtilUrl + '/create', JSON.stringify(module), this.options)
        .map(response => {
            console.dir(response);
            response.blob();
        })
        .catch(this.handleError);
}

private handleError(error: any) {
    return Promise.reject(error.message || error);
}
}

Angular2组件：

generateDocx(module: Module) {
   this.docxTemplateService
       .generateDocx()
       .subscribe(
            data => {
                console.log(`Word data: ${data}`);
                if (data !== undefined) 
                    // save file somehow
                else console.log('No file to download.');
            },
            error => { this.alertService.error(error); },
            () => this.alertService.success("Success", true)
        );
}

在 Chrome 控制台中记录的 Blob 内容：

size: 68192
type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document"
__proto__: Blob

所以......没有内容的大小。帮助是apreciated！

4

1 回答 1

1

response.blob您应该在箭头函数中function使用括号显式返回。

generateDocx(): Observable<any> {
    this.options.responseType = ResponseContentType.Blob;
    return this.http
        .post(this.docxUtilUrl + '/create', JSON.stringify(module), this.options)
        .map(response => {
            console.dir(response);
            return response.blob(); //need to return response blob
        })
        .catch(this.handleError);
}

或者更确切地说，您可以使该map功能成为一个衬里

.map(response => response.blob())

类似的答案在这里

于 2017-05-14T21:23:25.890 回答