使用 Node.js 文件流传输图片，替代 Base64 编码

本文将介绍如何将 Lambda 函数返回的 Base64 编码图片改为使用 Node.js 文件流传输，提升效率并减少数据量。

原代码：

const fs = require('fs');
const path = require('path');
const puppeteer = require('puppeteer');

// ... 其他代码

// 返回 Base64 编码的图片
return {
  statusCode: 200,
  headers: {
    'Content-Type': 'image/png',
  },
  body: imageBuffer.toString('base64'),
  isBase64Encoded: true,
};

优化后的代码：

const fs = require('fs');
const path = require('path');
const puppeteer = require('puppeteer');

// ... 其他代码

// 返回文件流
const imageStream = fs.createReadStream(`/tmp/${output}`);
return {
  statusCode: 200,
  headers: {
    'Content-Type': 'image/png',
  },
  body: imageStream,
};

步骤：

替换返回值中的 isBase64Encoded: true 属性。 由于我们现在使用文件流传输图片，不需要这个属性。
将返回值中的 body 属性替换为一个包含文件流的对象。 这个对象包含了文件流的内容，以及文件流的类型，并且不需要使用 Base64 编码。
将 Lambda 函数的返回类型从 JSON 改为二进制类型。 具体实现方法是在 Lambda 函数的配置中将返回类型修改为 "binary/octet-stream"。

完整的 Lambda 函数代码：

const fs = require('fs');
const path = require('path');
const puppeteer = require('puppeteer');

const launchBrowser = async () => {
  const browser = await puppeteer.launch({
    args: [
      '--disable-gpu',
      '--disable-dev-shm-usage',
      '--disable-setuid-sandbox',
      '--no-first-run',
      '--no-zygote',
      '--no-sandbox'
    ],
    headless: true,
  });

  return browser;
};

const autoScroll = async (page) => {
  return page.evaluate(() => {
    return new Promise((resolve, reject) => {
      var totalHeight = 0;
      var distance = 100;
      var timer = setInterval(() => {
        var scrollHeight = document.body.scrollHeight;
        window.scrollBy(0, distance);
        totalHeight += distance;
        if (totalHeight >= scrollHeight) {
          clearInterval(timer);
          resolve();
        }
      }, 100);
    });
  });
};

exports.handler = async (event, context) => {
  const input = JSON.parse(event.body).input;
  console.log('Input:', input);

  const fileinput = `${Date.now()}.mmd`;
  fs.writeFileSync(`/tmp/${fileinput}`, input);

  const output = `${Date.now()}.png`;
  const browser = await launchBrowser();
  const page = await browser.newPage();
  await page.emulateTimezone('Asia/Shanghai');

  try {
    const html = fs.readFileSync(path.join(__dirname, 'template.html'), 'utf8');
    const renderedHtml = html.replace('{{mermaid}}', input);
    const filehtml = `${Date.now()}.html`;
    fs.writeFileSync(`/tmp/${filehtml}`, renderedHtml);
    let url = 'file://' + path.join('/tmp', filehtml);
    await page.goto(url, { waitUntil: 'networkidle2' });
    await page.setViewport({ width: 1200, height: 800 });
    await autoScroll(page);
    await page.screenshot({ path: `/tmp/${output}`, fullPage: true, type: 'png' });

    console.log('Image generated:', output);
    const imageStream = fs.createReadStream(`/tmp/${output}`);
    return {
      statusCode: 200,
      headers: {
        'Content-Type': 'image/png',
      },
      body: imageStream,
    };
  } catch (err) {
    console.error(err);
    return {
      statusCode: 500,
      body: 'Error generating image',
    };
  } finally {
    await browser.close();
  }
};

注意： 在 Lambda 函数的配置中，需要将返回类型修改为 "binary/octet-stream"，以便 API Gateway 正确地将文件流传输给客户端。

通过以上步骤，我们成功地将 Lambda 函数返回的 Base64 编码图片改为使用 Node.js 文件流传输，有效提升了效率并减少了数据量。