javascript - 使用 PHP 包装器从 wkhtml 生成 PDF,发送回 Angular 4 时,仅在 Chrome 中打开

标签 javascript php angular pdf

我在 Angular 4 中生成一个 html,将它发送到 wkhtmltopdf 的 PHP 包装器,然后返回到 Angular,这在 Chrome 中工作正常,显示 PDF。我需要它也显示在 Firefox 中。这是将 PDF 发送到 PHP 的代码:

public getPdf() {
    const html = this.pdfEl.innerHTML;

    alert(html);

    this.rest.post(
      '/pdf',
      { html },
      {
        headers: new Headers(),
        responseType: ResponseContentType.Blob
      }
    ).subscribe(
      (value) => {
        //alert('subscribe receiver in pdf button directive');
        this.url = URL.createObjectURL(value.blob());
        open(this.url);
      });

  }

到目前为止我已经尝试过但没有奏效的是:
1. 设置 this.url = URL.createObjectURL(new Blob([value.blob()], {type: 'application/pdf'})); 而不是 this.url = URL.createObjectURL(value.blob());
2. 将其设置为 header 而不是 new Headers() :

new Headers({ 
              'Content-Type': 'application/json', 
              'Accept': 'application/pdf'
            }),

有什么解决这个问题的建议吗,伙计们?谢谢。

最佳答案

如果 value.blob() 返回一个 Blob 您还设置了 blob typeapplication/pdf。这必须在响应端完成,因为该属性是只读的。

Blob Documentation

Blob.type Read only A string indicating the MIME type of the data contained in the Blob. If the type is unknown, this string is empty.

或者,如果您 value.blob() 只返回一个数组缓冲区,您必须自己创建一个新的 Blob

new Blob([value.blob()], {type: 'application/pdf'});

关于javascript - 使用 PHP 包装器从 wkhtml 生成 PDF,发送回 Angular 4 时,仅在 Chrome 中打开,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48227969/

相关文章:

javascript - 表格行数据没有扩展到足以在悬停时更改背景颜色

javascript - 如何在 Vue.js 中实现基于 session cookie 的身份验证?

javascript - 调整最小图像尺寸

angular - 从 Angular 5 的输入文本字段中获取值

javascript - async.each 不在最后调用回调

php - 如何从未输入某些日期的数据库表中创建 30 天的数据数组?

php - 使用 PHP 的内置服务器设置 Eclipse PDT

php - 在 PHP 中确定 .csv 分隔符

javascript - 如何在 Typescript 中为 Angular2 编写 console.log 包装器?

javascript - Angular2 zone.run() 与 ChangeDetectorRef.detectChanges()