Recently, a puppeter service was used in the project to take a screenshot. The front-end service should be packaged into the docker image

First, I use node as the initial image and print the front-end code into the image. The final image will report an error when running the screenshot, saying that it is missing: libx11 xcb so. 1. There should be some lib missing in the image, so I want to use another image as the initial image

Then I searched and searched on the Internet, and finally found another blog, which uses puppeter in docker

https://www.jianshu.com/p/6a07fbd5b299

I follow the tutorial. However, in the end, an error was reported, not the lack of Lib, but the ghost of what spawn:
Failed to launch chrome! spawn /app/node_modules/puppeteer/.local-chromium/linux-686378/chrome-linux/chrome ENOENT
It hurts. How to solve this error if you don't find the reason.

Later, I followed this article and found the official document. It turned out that there was a packaged puppeter image for a long time, which can be used directly. Wuhu takes off, damn it! I knew it would be over to search the puppeter directly in the docker hub.

https://hub.docker.com/r/buildkite/puppeteer/tags

Then I put the front-end code into this image to run. Sure enough, there was no error. When the screenshot was successful, I left excited tears.
But when I looked at it, my tears choked back, and the problem came again: the Chinese screenshots were all boxes, wdnmd

Later, I checked for a long time and found that the original problem was the lack of font. The official image was foreign, and it was reasonable not to have a Chinese image, so now I have to find a way to install a font on this image, one wave after another, but I feel very close to success.

I looked and looked, looked and looked
Finally, I found a document on github specifically to solve the problem of Chinese screenshots of docker image of buildkite / puppeter. I just want to kiss the author

https://github.com/udbmnm/docker-puppeteer-chinese

However, since this post was written in 18 years, it has been 21 years now. Some of the word library links of Dockerfile are invalid. When downloading the word library when packing, I will report an error. I followed suit, found an effective word library link, and made hundreds of millions of modifications to Dockerfile.

Here, I'd like to talk about how to follow the steps, so that someone can see my article many years later, and the font link in the article fails. When we pack the image, we download it

http://ftp.cn.debian.org/debian/pool/main/f/fonts-noto-cjk/fonts-noto-cjk_20170601+repack1-3_all.deb

If an error is reported when we directly visit the link, we will also report 404, so we will visit

http://mirrors.ustc.edu.cn/debian/pool/main/f/fonts-noto-cjk/

See if there are any documents with similar names at the bottom

Sure enough, there was a man named fonts Noto CJK_ 20170601+repack1-3+deb10u1_ all. The DEB file is the same as the previous fonts Noto CJK_ 20170601+repack1-3_ all. Deb looks very similar. It should be in fonts Noto CJK_ 20170601+repack1-3_ all. Deb is added to the file deb10u1? Then fonts Noto CJK_ 20170601+repack1-3_ all. Deb is no longer used? Damn it, it doesn't take up too much space. I've been looking for it for a long time.

Finally, post the DockerFile I successfully run

# Pull basic image
FROM buildkite/puppeteer:10.0.0

# Set domestic image source
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
#Here is the setting image
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    && \
    wget https://hub.fastgit.org/adobe-fonts/source-sans-pro/releases/download/2.040R-ro%2F1.090R-it/source-sans-pro-2.040R-ro-1.090R-it.zip && \
    unzip source-sans-pro-2.040R-ro-1.090R-it.zip && cd source-sans-pro-2.040R-ro-1.090R-it  && mv ./OTF /usr/share/fonts/  && \
    fc-cache -f -v

# Set time zone
RUN rm -rf /etc/localtime && ln -s /usr/share/zoneinfo/Asia/Shanghai /etc/localtime

RUN apt-get update

RUN apt-get -y install fontconfig xfonts-utils

RUN fc-list :lang=zh

# Setting environment variables
ENV NODE_ENV production

WORKDIR /app

COPY ./package.json /app/

# Clear npm cache file
#RUN npm cache clean --force && npm cache verify
# If set to true, UID/GID switching is prohibited when running package scripts
RUN npm config set unsafe-perm true

RUN npm config set registry https://registry.npm.taobao.org

# Install pm2
#RUN npm i pm2 -g

RUN npm install

COPY . /app/

EXPOSE 3000

CMD npm start  --trace-warnings

You can see that there is really no random code this time. It's hard to top