在html-pdf使用后不会渲染图像时出现EJS-view

时间:2016-12-23 14:10:17

标签: javascript image pdf sails.js ejs

我需要能够呈现html视图(没有新的视图)并向最终用户提供与PDF文件相同的视图。

第一种情况完全适用于我:我设法渲染一个简单的html5文档以及两次图像(base64版本+标准方式)。

不幸的是,当我尝试通过html5-to-pdfhtml-pdf将其转换为PDF文件时,<img>标记的非base64版本无法正常工作并显示为缺少PDF文件中的资源。

我正在使用的代码如下:

控制器:

//res is the response parameter provided to the controller

var pdf = require('html-pdf');

var variables = {

};

ejs.renderFile('./views/samplepdf.ejs', variables, function(err, result) {
  // render on success
  if (result) {
    html = result;

    pdf.create(html).toStream(function(err, stream){
      res.contentType("application/pdf");
      stream.pipe(res);
    });

  }
  // render or error
  else {
    res.end('An error occurred');
    console.log(err);
  }
});

查看:

<h2>Image</h2>
<img class="smaller" src="data:image/jpeg;base64,/validbase64ButIHadToSaveBecauseCharactersLimitExceeded" alt="Sample image" />
<img class="smaller" src="images/ymca.jpg" alt="Sample image #2" />

我仔细阅读了有关Grunt任务和资产管理的Sails规范,因此给定的images/ymca.jpg确实存在,可以从浏览器访问。我仍然不知道PDF为什么不呈现它。

1 个答案:

答案 0 :(得分:1)

您需要做的就是在pdf上渲染时使用完整的图像路径 控制器

var variables = {
  path: sails.config.appPath + 'assets/images/ymca.jpg'
};

查看

<img class="smaller" src="<%= path %>" alt="Sample image #2" />

使用html-pdf在pdf上渲染时,它不适用于绝对路径。