Linux系统无头浏览器pupteer截图出来中文乱码

无头浏览器 Puppeteer 截图出现中文乱码(通常显示为方块或缺失字符),根本原因在于 Linux 服务器默认缺少中文字体库。Puppeteer 使用的 Chromium 浏览器无法渲染中文,是因为系统未安装支持中文的字体。


解决方案

根据公开资料,主流解决方式如下:

  • 安装中文字体到服务器
  • 更新字体缓存
  • (可选)在 Puppeteer 启动参数中指定中文字体

具体操作步骤(适用于 CentOS / Ubuntu / AliLinux 等)

  1. 安装 fontconfig(如未安装)

    bash 复制代码
    CentOS/RHEL
    yum install -y fontconfig
    
    Ubuntu/Debian
    apt-get update && apt-get install -y fontconfig
  2. 从 Windows 系统复制中文字体到服务器

    • 常用中文字体文件(位于 C:\Windows\Fonts\):

      • simsun.ttc(宋体)
      • msyh.ttc(微软雅黑)
      • simhei.ttf(黑体)
    • 将这些字体文件上传至服务器的 /usr/share/fonts/chinese/ 目录(若目录不存在则创建):

      bash 复制代码
      mkdir -p /usr/share/fonts/chinese
      通过 scp、rz 或其他方式上传字体文件至此目录
  3. 设置字体目录权限

    bash 复制代码
    chmod -R 755 /usr/share/fonts/chinese
  4. 刷新字体缓存

    bash 复制代码
    fc-cache -fv
  5. 验证中文字体是否安装成功

    bash 复制代码
    fc-list :lang=zh

    若输出包含 SimSunMicrosoft YaHei 等字体,则表示安装成功。

  6. (可选)在 Puppeteer 启动参数中指定字体

    在代码中添加 --font-family 参数,例如:

    js 复制代码
    const browser = await puppeteer.launch({
      headless: 'new',
      args: [
        '--no-sandbox',
        '--font-family=SimSun' // 指定默认中文字体
      ]
    });

Docker 部署场景

若使用 Docker 部署,可在 Dockerfile 中直接复制字体并安装:

dockerfile 复制代码
FROM node:18-alpine

安装 Chromium 依赖和中文字体
RUN apk add --no-cache \
    chromium \
    nss \
    freetype \
    ttf-liberation \
    wqy-zenhei \
    font-noto-cjk \
    fontconfig

复制中文字体(假设已将 msyh.ttc 放在本地目录)
COPY msyh.ttc /usr/share/fonts/

更新字体缓存
RUN fc-cache -fv

设置 Puppeteer 使用系统 Chromium
ENV PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true \
    PUPPETEER_EXECUTABLE_PATH=/usr/bin/chromium-browser

... 其他配置
总结

- 根本原因:Linux 服务器无中文字体。
- 核心解决:安装中文字体 + 运行 `fc-cache -fv`。
- 推荐字体:`SimSun`、`Microsoft YaHei`、`WenQuanYi Zen Hei`。
- 验证命令:`fc-list :lang=zh`。

完成上述操作后,Puppeteer 截图中文乱码问题即可解决。
相关推荐
爱写代码的森15 小时前
鸿蒙三方库 | harmony-utils之ImageUtil图片保存到本地详解
服务器·华为·harmonyos·鸿蒙·huawei
大耳朵-小飞象17 小时前
电力安全运维的智能密码:BACS如何破解设备全生命周期管理难题,让电网安全“看得见、管得住”?
运维·安全·智慧城市·能耗系统·楼宇智控·未来生活
极客侃科技18 小时前
制造企业 MES/APS 选型:SAP PP/DS 集成、ERP-MES 边界划分与一体化架构要点
运维·架构·制造
HLC++18 小时前
Linux的进程间通信
android·linux·服务器
华清远见IT开放实验室19 小时前
实验室建设案例 | 石家庄科技信息职业学院嵌入式实验室——从底层硬件到系统应用,一所应用型高校的嵌入式人才培养这样落地
linux·arm开发·stm32·嵌入式硬件·高校·实验室建设
白露与泡影20 小时前
Arthas 实战指南:从方法耗时定位到 JVM 变量热修改
服务器·jvm·c#
神奇霸王龙21 小时前
Claude Code屠榜:MiMo与Grok紧追Codex
服务器·网络·人工智能·gpt·ai·ai编程
Web极客码21 小时前
WordPress SEO优化:提升网站排名的13个关键步骤
服务器·seo·wordpress
生活爱好者!21 小时前
我把NAS当作下载机,docker一键部署qb
运维·docker·容器
groundhappy1 天前
idalib安装和codex ida-mcp配置
linux·开发语言·python