使用docker-compose一键安装puppeteer,导出pdf

1,297 阅读2分钟

最近在使用egg.js把网页导出pdf文件,本地运行是很简单,但是部署到服务器上的docker中,puppeteer 所依赖的 Chromium 缺少所需要的依赖项,遇到了好多问题,网络上也找了很久,没有几个解释清楚的。挣扎了一天一夜,各种尝试,终于部署成功了,在此跟大家分享一下,让大家一起少走点弯路。

  • node:12.18
  • puppeteer:13.5.1 (目前最新版)
  • egg:2.33.1

直接先上完整配置:

FROM node:12.18.0
RUN mkdir -p /egg-pdf
WORKDIR /egg-pdf

COPY ./app/public/fonts/source-sans-3.006R.zip /tmp
RUN sed -i 's/deb.debian.org/mirrors.163.com/g' /etc/apt/sources.list && \
    apt update && \
    apt-get install -y dpkg wget unzip
    #fonts-droid fonts-arphic-ukai fonts-arphic-uming

RUN cd /tmp && wget http://ftp.cn.debian.org/debian/pool/main/f/fonts-noto-cjk/fonts-noto-cjk_20170601+repack1-3+deb10u1_all.deb && \
    dpkg -i fonts-noto-cjk_20170601+repack1-3+deb10u1_all.deb && \
    unzip source-sans-3.006R.zip && cd source-sans-3.006R  && mv ./OTF /usr/share/fonts/  && \
    fc-cache -f -v

RUN apt-get update && \
    apt-get -y install xvfb gconf-service libasound2 libatk1.0-0 libc6 libcairo2 libcups2 \
      libdbus-1-3 libexpat1 libfontconfig1 libgcc1 libgconf-2-4 libgdk-pixbuf2.0-0 libglib2.0-0 \
      libgtk-3-0 libnspr4 libpango-1.0-0 libpangocairo-1.0-0 libstdc++6 libx11-6 libx11-xcb1 libxcb1 \
      libxcomposite1 libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1 libxss1 \
      libxtst6 ca-certificates fonts-liberation libappindicator1 libnss3 lsb-release xdg-utils wget && \
    rm -rf /var/lib/apt/lists/*

COPY package.json /egg-pdf/package.json
RUN npm install --registry=https://registry.npmmirror.com
COPY . /egg-pdf
CMD ["npm","start"]

讲解篇:配置字体

COPY ./app/public/fonts/source-sans-3.006R.zip /tmp
RUN sed -i 's/deb.debian.org/mirrors.163.com/g' /etc/apt/sources.list && \
    apt update && \
    apt-get install -y dpkg wget unzip
    #fonts-droid fonts-arphic-ukai fonts-arphic-uming

RUN cd /tmp && wget http://ftp.cn.debian.org/debian/pool/main/f/fonts-noto-cjk/fonts-noto-cjk_20170601+repack1-3+deb10u1_all.deb && \
    dpkg -i fonts-noto-cjk_20170601+repack1-3+deb10u1_all.deb && \
    unzip source-sans-3.006R.zip && cd source-sans-3.006R  && mv ./OTF /usr/share/fonts/  && \
    fc-cache -f -v

注意:我字体的路径是放在/app/public/fonts/目录下,名字叫做:source-sans-3.006R.zip,如下图

image.png

字体的下载路径:github.com/adobe-fonts…

为什么要下载字体呢?因为如果不安装字体,导出的pdf文件就只显示数字、英文字母和图片,中文字体就不会显示,大家记的改成自己的字体文件名哦,这个很重要。

讲解篇:安装Chromium 所缺少的依赖项

RUN apt-get update && \
    apt-get -y install xvfb gconf-service libasound2 libatk1.0-0 libc6 libcairo2 libcups2 \
      libdbus-1-3 libexpat1 libfontconfig1 libgcc1 libgconf-2-4 libgdk-pixbuf2.0-0 libglib2.0-0 \
      libgtk-3-0 libnspr4 libpango-1.0-0 libpangocairo-1.0-0 libstdc++6 libx11-6 libx11-xcb1 libxcb1 \
      libxcomposite1 libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1 libxss1 \
      libxtst6 ca-certificates fonts-liberation libappindicator1 libnss3 lsb-release xdg-utils wget && \
    rm -rf /var/lib/apt/lists/*

此配置可以参照官网提供的示例:

image.png

image.png

image.png

下图中这段代码就是:

image.png

部署篇:安装环境

大家可以把项目git clone到自己的linux服务器上,再安装docker和docker-compose

安装docker,加入开机启动

curl -sSL https://get.daocloud.io/docker | sh
sudo systemctl start docker
sudo systemctl enable docker

安装 Docker Compose:

curl -L https://get.daocloud.io/docker/compose/releases/download/1.24.1/docker-compose-`uname -s`-`uname -m` > /usr/local/bin/docker-compose 
chmod +x /usr/local/bin/docker-compose

部署篇:部署服务

到根目录下后,在执行:docker-compose up -d,此过程安装可能时间很长(15分钟左右),请大家耐心等待,最后大家可以到Portainer查看,已经安装成功,可以愉快的去导出PDF文件啦!

image.png

最后:分享源代码

项目地址,需要自取:gitee.com/weijiatan/e…

感谢这篇文章的作者提供的帮助:www.jianshu.com/p/2c88eb745…