docker运行puppeteer-core

Docker-compose运行alpine

写一个dockerc-compose.yaml

ersion: '3.3'
services:
  node:
    image: alpine:latest
    command: sh -c "sleep infinity" # 防止容器自动停止
    volumes:
      - .:/mnt # 根据实际情况将容器外的文件映射到容器内部的/mnt文件内
    ports:
      - "8797:8797" # 我的alpine中跑了一个nodejs服务端口在0.0.0.0:8797

上述volumes文件映射，我的目录如下:
├── docker-compose.yaml
└── app/ # 项目目录
.:/mnt会在容器的/mnt目录下存在一个映射的app目录。

保存后，运行以下代码运行容器

docker-compose up -d

进入容器

 docker exec it [alpine容器id] sh

ps：docker ps查看容器id

修改alpine国内源<进入容器后>

要在 Alpine Linux 中修改国内源，可以编辑 /etc/apk/repositories 文件来指定国内的镜像源。你可以使用 vi 或者 nano 等文本编辑器来进行编辑。

例如，你可以使用以下命令来编辑 repositories 文件：

vi /etc/apk/repositories

然后在文件中添加类似以下内容的镜像源：（删除原来的）

http://mirrors.ustc.edu.cn/alpine/latest-stable/main
http://mirrors.ustc.edu.cn/alpine/latest-stable/community

添加老版本的chromium源

http://mirrors.ustc.edu.cn/alpine/latest-stable/main
http://mirrors.ustc.edu.cn/alpine/latest-stable/community
http://mirrors.ustc.edu.cn/alpine/v3.19/community
http://mirrors.ustc.edu.cn/alpine/v3.19/main

v3.19有chromium 124.0.6367.78 ，对应的puppeteer-core的22.7.1；

在项目的package.json设置

  "dependencies": {
    "puppeteer-core": "22.7.1"
    ...
  },

保存文件后，运行 apk update 命令来使更改生效。这样就可以使用国内的镜像源来安装 Alpine Linux 软件包了。

安装软件包

apk add --no-cache nss freetype harfbuzz ca-certificates ttf-freefont nodejs npm

安装chromium v3.19

apk add chromium=124.0.6367.78-r0

设置环境变量

export PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true
export PUPPETEER_EXECUTABLE_PATH=/usr/bin/chromium-browser

进入目录

cd /mnt/app/

安装cnpm

npm install cnpm -g --registry=https://registry.npmmirror.com

cnpm install

Hono做的一些代码部分

import puppeteer from "puppeteer-core";

export async function makePdf(body: any) {
  const browser = await puppeteer.launch({
    executablePath: "/usr/bin/chromium", // 如果不知道chromium的位置：使用`which chromium`
    args: ["--no-sandbox"],
  });
  const page = await browser.newPage();
  await page.setContent(body); // 一定要await，不然图片和一些资源会加载失败
  // page还有其他方法来打开网页，比如通过url链接，打开html文件，请参考官方文档
  const pdfFile = await page.pdf({
    path: "output.pdf",
    format: "A4",
    landscape: false,
  });
  await browser.close();
  return pdfFile;
}

makePdf('<h1>Hello PDF</h1>') // 会产生一个文件，同时返回文件。

import { serve } from "@hono/node-server";
import { Hono } from "hono";
import { makePdf } from "根据你的目录来";
import { stream } from "hono/streaming";
import { makeHTMLTxt } from "一个生成字符串的函数"; // return `<h1>123</h1>`类似的字符串

const app = new Hono();

app.get("/", (c) => {
  return c.text("Hello Hono!");
});

app.post("/createPdf", async (c) => {
  const data = await c.req.json(); 
  const file = await makePdf(makeHTMLTxt(data));
  return stream(c, async (stream) => {
    await stream.write(file);
  });
});

const port = 8797;
const hostname = "0.0.0.0";

console.log(`Server running at http://${hostname}:${port}`);
console.log(`Server running at http://localhost:${port}`);

serve({
  fetch: app.fetch,
  port,
  hostname,
});