Question

我正在尝试使用PhantomJS下载一些PDF文件。当我点击提交按钮时，没有直接的URL来下载PDF，因为它调用了一些内部JavaScript函数。

以下是我用来下载PDF文件的代码：

 page.open(url, function(status){
     page.evaluate(function(){
         document.getElementById('id').click();
     });
 });
 page.onResourceReceived = function(request){
     console.log('Received ' + JSON.stringify(request, undefined, 4));
 };

'id'是提交按钮的元素ID。这里的问题是即使我得到了响应（在onResourceReceived回调内）作为JSON格式，但我无法将附件保存为某些PDF文件。

当我运行上面的代码时，我得到以下输出作为JSON字符串：

 Received {
    "contentType": "application/pdf",
    "headers": [
        // Some other headers.
        {
            "name": "Content-Type",
            "value": "application/pdf"
        },
        {
            "name": "content-disposition",
            "value": "attachment; filename=FILENAME.PDF"
        },
    ],
    "id": 50,
    "redirectURL": null,
    "stage": "end",
    "status": 200,
    "statusText": "OK",
    "url": "http://www.someurl.com"
}

请仅使用PhantomJS建议解决方案。谢谢！

Answer 1

为了创建.pdf文件（使用ejs模板），我一直在使用一个名为“ html-pdf”的包（在后台使用PhantomJS）。希望我一直在使用的方法能为您提供一些指导。

我正在使用Angular，但这应适用于您正在做的事情。我使用的方法以blob形式接收来自服务器的响应，并创建一个新的Blob实例，然后使用一个插件（应为您选择的框架提供该插件）将创建的.pdf下载到浏览器中：

  generatePDF(quote) {
    this.http.post(ENV.pdfURL, { quote }, {
      // tell the server that response type expected is blob
      responseType: 'blob'
    }).subscribe((res) => {
      // create a new instance of blob using Blob constructor
      const blob = new Blob([res], { type: 'application/pdf' });
      const filename = `${quote.customerCompany}-${this.getDate()}-${quote.productName}-quote-${quote.selectedDuration / 12}yr.pdf`;
      // use a plugin to save the file to the browser
      FileSaver.saveAs(blob, filename);
    });
  }

我认为您在这里遇到麻烦的原因是，您正在要求服务器向您发送JSON作为响应，而不是blob文件对象。

Answer 2

通常，我建议停止使用PhantomJS并着眼于Headless Chrome。 Here是有关此主题的不错的文章。我为此使用 https://github.com/puppeteer/puppeteer ，它是一个易于集成的解决方案。

如何下载和保存PDF文件，该文件在PhantomJS的响应标题中作为附件接收？

2 个答案: