Playwright Chromium在AWS EKS生产环境中字体失效问题求助

以下是针对该场景的具体解决方案：

• 容器内安装缺失字体
  EKS容器镜像（包括Playwright官方镜像）通常默认缺少中文字体或自定义字体，需在Dockerfile中添加字体安装步骤：

  # Debian/Ubuntu镜像安装中文字体示例
  RUN apt-get update && apt-get install -y --no-install-recommends \
      fonts-wqy-microhei \
      fonts-wqy-zenhei \
      && rm -rf /var/lib/apt/lists/*
  
  # 若使用自定义字体，复制字体文件到容器并刷新缓存
  COPY ./assets/your-custom-font.ttf /usr/share/fonts/
  RUN fc-cache -fv
  

• 调整Chromium启动参数
  在启动Chromium时添加字体渲染相关参数，适配容器环境：

  const browser = await chromium.launch({
    timeout: 1200000,
    args: [
      '--no-sandbox', // EKS容器环境必填
      '--disable-dev-shm-usage',
      '--font-render-hinting=none',
      '--force-color-profile=srgb',
      '--default-font-size=16',
      '--set-custom-fonts-path=/usr/share/fonts' // 指定字体目录
    ]
  })
  

• HTML中强制指定字体
  在截图用的HTML里通过CSS明确指定字体，避免依赖系统默认字体：

  .content {
    font-family: "WenQuanYi Zen Hei", "Microsoft YaHei", sans-serif;
    /* 自定义字体需先引入 */
    /* @font-face {
      font-family: 'CustomFont';
      src: url('./assets/custom-font.ttf') format('truetype');
    } */
  }
  

  注意将自定义字体文件打包进容器，确保HTML能正确加载。

• 使用Playwright官方镜像并补充字体
  直接基于Playwright官方镜像构建，它已包含基础依赖，只需补充缺失字体：

  FROM mcr.microsoft.com/playwright:v1.40.0-jammy
  RUN apt-get update && apt-get install -y fonts-wqy-zenhei
  COPY . /app
  WORKDIR /app
  RUN npm install
  

• 验证容器内字体可用性
  在容器内执行fc-list命令检查字体是否安装成功，比如：

  fc-list | grep "WenQuanYi"
  

  若无输出，说明字体未正确安装，需排查镜像构建步骤。

内容的提问来源于stack exchange，提问作者Rakesh Chand