当前位置: 首页 > 知识库问答 >
问题:

在浏览器中查看/下载来自node.js后端的pdf

商和颂
2023-03-14

我在我的节点后端生成一个pdf,如下所示:

router.post('/api/submissions/generatecontract', auth, function (req, res, next) {
  if (!req.body.stallholderId || !req.body.edition) {
    return res.json({status: 400, message: 'Please enter all fields.' });
  }

  var doc = new PDFDocument();

  doc.fontSize(25).text('Here is some text', 100, 80);
  doc.end();

  return doc.pipe(res);
});

现在,当我调用后端和控制台时。记录响应,我得到以下输出:

_正文:“%PDF-1.3↵%����↵50 obj↵

标头:标头_headersMap:地图大小:(...)原型:地图[1] 0:{"内容类型"=

我看到我的PDF在回复的正文中。但我现在如何在浏览器中查看或下载它?如果有必要的话,我会在前端使用Angular2。

我找到的信息是以前的angular 2版本。

共有1个答案

卫甫
2023-03-14

我是这样解决的:

  generateContract(stallholder: Stallholder, submission: Submission) {
    let headers = new Headers();
    let options = new RequestOptions({ headers: headers });

    headers.append('authorization', 'Bearer ' + this.userService.getToken());

    this.http.get(this.apiUrl + `api/editions/${submission.edition}`, options)
      .map(res => res.json()).subscribe(data => {
        if (data.status === 200) {
          let total = submission.metersStreet * data.price;
          let params = `email=${stallholder.email}&firstName=${stallholder.firstName}&lastName=${stallholder.lastName}
          &name=${stallholder.name}&metersStreet=${submission.metersStreet}&metersDepth=${submission.metersDepth}
          &edition=${submission.edition}&total=${total}`;
          this.openPdfFile(params);
        }
      });
  }

  openPdfFile(params) {
    this.downloadFile(params, function (blob) {
      let win: any = window.open('_blank');
      let blobb = new Blob([blob], {type: 'application/pdf'});
      let url: any = URL.createObjectURL(blobb);
      win.location.href = url;
    });
  }

  downloadFile(params, success) {
    let xhr = new XMLHttpRequest();
    xhr.open('POST', this.apiUrl + 'api/submissions/generatecontract', true);
    xhr.setRequestHeader('authorization', 'Bearer ' + this.userService.getToken());
    xhr.responseType = 'arraybuffer';
    xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
    xhr.onreadystatechange = function () {
      if (xhr.readyState === 4) {
        if (success) {
          success(xhr.response);
        }
      }
    };
    xhr.send(params);
  }
 类似资料:
  • 基本用法 管理前端模块 生成前端模块 脚本文件的实时生成 browserify-middleware模块 参考链接 随着JavaScript程序逐渐模块化,在ECMAScript 6推出官方的模块处理方案之前,有两种方案在实践中广泛采用:一种是AMD模块规范,针对模块的异步加载,主要用于浏览器端;另一种是CommonJS规范,针对模块的同步加载,主要用于服务器端,即node.js环境。 Brows

  • 问题内容: 因此,我有了这个Electron应用程序,并且在一个.html文件中,我链接了另一个脚本,该脚本为该程序提供了一些实用程序功能,其中一个是这个: 因此,这应该使用集成的电子PDF查看器(使用Chromium)在新窗口中打开PDF。我使用了臭名昭著的,我尝试了可以为BrowserWindow定义的成千上万的首选项,但是它总是打开窗口,然后开始下载文件而不显示它。 我三重检查了文件路径,“

  • 目录 1.如何在浏览器查看后台echo、var_dump输出的内容 2.如何在浏览器查看后台代码的错误信息 3.如何查看一览返回的数据信息 1.如何在浏览器查看后台echo、var_dump输出的内容 如下图是前端代码,我们看fID设置的是2 我们看一下后台,通过echo输出拼接的sql 我们点击服务按钮,触发action:queryNewsWap,按F12之后,打开浏览器调试,点击Network

  • 问题内容: 我见过的大多数实现都是在客户端进行浏览器检测。我只是想知道是否有可能在将任何资源发送到客户端之前进行浏览器检测。 谢谢。 问题答案: 那应该为您工作。只需将其放在响应处理程序中即可。

  • 在我的php文件中,我有以下内容来创建一个带有FPDF库的PDF: 但是请求是响应这个,而不是打开一个保存对话框来保存我的PDF。 %PDF-1.3 3 0 obj<>endobj 4 0 obj<>stream x 3 R@2π35 W(çR qπw 3 t04多30 pispéz*[(hx·ääää+çó)·(j*dé7 w endstream endobj 1 0 obj /xobject<