Node.js Jimp和it'；s缓冲区数据未按预期使用Puppeter生成PDF

我正在使用，&puppeter生成整页屏幕截图，但我从Jimp和Puppeter获取的缓冲区数据在我的情况下不起作用（我从Puppeter获取的缓冲区数据，即png2im我的代码工作正常，但png正在生成错误。）

为了生成pdf，我有以下内容

      doc.image(req.current.image, {
                fit: [595.28, 841.89],
                align: 'center',
                valign: 'center'
            })
            .fillColor('blue')
            .text('Date Created: ' + dt, 100, 30)
            .underline(100, 22, 300, 27, { color: '#0000FF' });
            doc.addPage();
        }

png的控制台日志

Jimp {
   _background: 0,
   bitmap:
   { data:
      <Buffer ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff 
            ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ... 
            63816510 more bytes>,
      width: 1780,
      height: 8963 } }

---

即使在我使用fullPage:true时，木偶演员也不会生成完整的页面截图

      await page.screenshot({ fullPage: true});

我们可以使用和Jimp生成整页屏幕截图，在我的例子中，我们从Jimp获得的缓冲数据不起作用，我用以下方法修复了该问题：-

      png.getBuffer('image/png', (err, Buff) => {
           req.current.image = Buffer;
        });

---

我也遇到了这个问题，我使用的是Lambda/Serverless和相同的puppeter全页截图软件包，但我的问题略有不同

无论我如何表达以下内容：

const screenshotFullPage = await fullPageScreenshot(page);

screenshotFullPage
  .getBufferAsync('image/png')
  .then(async buffer => {
    let params = {
      ContentType: 'image/png',
      Bucket: 'polsenv-builds',
      Key: `${paths.screenshotPath}/${slug}.png`,
      Body: buffer,
    };

    await s3.putObject(params).promise();
  });

lambda函数的第一个实例可以工作，我可以使用上面的方法，它成功地编写了一个完整的页面截图，但是，当它使用lambda函数的第二、第三、第四个等实例时，我得到以下结果：

TypeError: screenshotFullPage.getBufferAsync is not a function
    at Prerender.renderPage (...)
    at process.internalTickCallback (internal/process/next_tick.js:77:7)

Jimp {
  _background: 0,
  bitmap:
   { data:
      <Buffer 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 ... 27505390 more bytes>,
     width: 1080,
     height: 6367 } }

转储

screenshotFullPage

当它出错时，我得到以下信息：

TypeError: screenshotFullPage.getBufferAsync is not a function
    at Prerender.renderPage (...)
    at process.internalTickCallback (internal/process/next_tick.js:77:7)

Jimp {
  _background: 0,
  bitmap:
   { data:
      <Buffer 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 ... 27505390 more bytes>,
     width: 1080,
     height: 6367 } }

Jimp{
_背景：0，
位图：
{数据：
,
宽度：1080，
身高：6367}

鉴于第一个有效的功能：

Jimp {
  domain: null,
  _events: [Object: null prototype] {},
  _eventsCount: 0,
  _maxListeners: undefined,
  bitmap:
   { width: 1080,
     height: 1440,
     depth: 8,
     interlace: false,
     palette: false,
     color: true,
     alpha: true,
     bpp: 4,
     colorType: 6,
     data:
      <Buffer 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 00 ff 00 00 ... 6220750 more bytes>,
     gamma: 0 },
  _background: 0,
  _originalMime: 'image/png',
  _exif: null,
  _rgba: true,
  writeAsync: [Function],
  getBase64Async: [Function],
  getBuffer: [Function: getBuffer],
  getBufferAsync: [Function: getBufferAsync],
  getPixelColour: [Function: getPixelColor],
  setPixelColour: [Function: setPixelColor] }

Jimp{
域：空，
_事件：[对象：空原型]{}，
_事件提示：0，
_maxListeners:未定义，
位图：
{宽度：1080，
身高：1440，
深度：8，
交错：假，
调色板：错，
颜色：对，
阿尔法：是的，
bpp:4，
颜色类型：6，
数据：
,
gamma:0}，
_背景：0，
_OriginalTime:'image/png'，
_exif:null，
_rgba：是的，
writeAsync:[函数]，
getBase64Async:[函数]，
getBuffer:[函数：getBuffer]，
getBufferAsync:[函数：getBufferAsync]，
getPixelColor:[函数：getPixelColor]，
setPixelColor:[函数：setPixelColor]}

---

所以它可以安全地使用

屏幕快照fullpage.bitmap.data

？因为这是一直可用的吗？为什么Jimp返回了两个不同的对象？

接下来，我仍然遇到了整页屏幕截图的问题，无论我尝试了什么，上面的包、非常大的视口等等，都有切掉页面部分或大量空白的问题

然而，迄今为止效果相当好的是：

    await page.goto(url, ...)

    const bodyWidth = await page.evaluate(() => document.body.scrollWidth);
    const bodyHeight = await page.evaluate(() => document.body.scrollHeight);
    
    await page.setViewport({ width: bodyWidth, height: bodyHeight });

---

是的，我在最后一张完整的页面截图中也遇到了类似的空白问题，我对页面高度进行了一定的划分，以从截图中删除空白。很抱歉反应太晚。

    await page.goto(url, ...)

    const bodyWidth = await page.evaluate(() => document.body.scrollWidth);
    const bodyHeight = await page.evaluate(() => document.body.scrollHeight);
    
    await page.setViewport({ width: bodyWidth, height: bodyHeight });