使用 Docker 和 Nginx 打造高性能的二維碼服務

時間 2019-12-18

標籤使用 docker nginx 打造高性能二維服務欄目 Docker 简体版

原文原文鏈接

使用 Docker 和 Nginx 打造高性能的二維碼服務

本文將演示如何使用 Docker 完整打造一個基於 Nginx 的高性能二維碼服務，以及對整個服務鏡像進行優化的方法。若是你的網絡情況良好，完整操做和體驗時間應不超過 15 分鐘。javascript

動手前的腦洞

最近有一個小需求，須要在頁面中快速生成一些二維碼。java

說到生成二維碼，方法不少，好比按照 QRCode 算法進行計算以後：linux

使用各類服務端語言，而後調用 GD 繪圖庫在語言中的 API 進行繪製，並生成圖片，而後配合可以提供 HTTP 服務的軟件對用戶提供圖片訪問地址。nginx
使用服務端語言，而後使用 CSS 和 HTML 生成能夠識別的頁面圖案，而後配合可以提供 HTTP 服務的軟件對用戶提供圖片訪問地址。git
使用客戶端腳本，使用 Canvas 生成二維碼圖片，或者和上一個方案同樣，生成 DOM 圖案。github
…算法

可是隻是爲了一個功能，就去配置一套完整的語言環境，引入一堆三方依賴，總有一種殺雞用牛刀的感受，而且在資源利用效率上來講，也不是最優解。docker

而使用客戶端進行生成，如今雖然不存在太多的兼容問題，可是須要額外引入腳本資源，圖片生成效率也相對較慢。ubuntu

那麼有沒有什麼環保高效的方案呢？瀏覽器

天然是有的，仍是選擇服務端生成，可是扔掉語言運行時，直接使用 Nginx 提供服務。

使用 Nginx 進行二維碼生成

這裏可使用一個現成的開源模塊 ngx_http_qrcode_module 。

它經過將用戶請求參數進行轉換，並調用使用 C 實現的二維碼快速生成庫 libqrencode 的 QRcode_encodeString實現二維碼快速生成，在未開啓緩存的狀況下，測試平均生成圖片在 10ms 左右。

爲了方便你們理解所有的安裝配置過程，我先提供一個「囉嗦」版本的 Dockerfile：

FROM ubuntu:18.04
RUN cat /etc/apt/sources.list | sed -e "s/archive\.ubuntu\.com/mirrors\.aliyun\.com/" | sed -e "s/security\.ubuntu\.com/mirrors\.aliyun\.com/" | tee /etc/apt/sources.list
RUN apt update && \
apt install -y unzip wget
WORKDIR /data
# https://github.com/fukuchi/libqrencode
RUN apt install -y autoconf automake autotools-dev libtool pkg-config libpng-dev && \
cd /data && wget https://github.com/fukuchi/libqrencode/archive/master.zip && unzip master.zip && rm -rf master.zip && \
cd libqrencode-master && ./autogen.sh && ./configure && make && make install && ldconfig && \
cd .. && rm -rf libqrencode-master
RUN apt install -y libgd-dev
ADD ngx_http_qrcode /data/ngx_http_qrcode
ADD nginx-1.15.5.tar.gz /data
ADD nginx.conf /data
RUN apt install -y libpcre3 libpcre3-dev && \
cd nginx-1.15.5 && ./configure --add-module=../ngx_http_qrcode/ && \
make && make install && mv /data/nginx.conf /usr/local/nginx/conf/nginx.conf && \
cd .. && rm -rf ngx_http_qrcode

將上面的文件保存完畢。接下來咱們來配置 Nginx。

worker_processes 1;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 80;
server_name localhost;
location / {
set $fg_color 000000;
set $bg_color FFFFFF;
set $level 0;
set $hint 2;
set $size 300;
set $margin 80;
set $version 2;
set $case 0;
set $txt "https://soulteary.com";
if ( $arg_fg_color ){
set $fg_color $arg_fg_color;
}
if ( $arg_bg_color ){
set $bg_color $arg_bg_color;
}
if ( $arg_level ){
set $level $arg_level;
}
if ( $arg_hint ){
set $hint $arg_hint;
}
if ( $arg_size ){
set $size $arg_size;
}
if ( $arg_margin ){
set $margin $arg_margin;
}
if ( $arg_ver ){
set $version $arg_ver;
}
if ( $arg_case ){
set $case $arg_case;
}
if ( $arg_txt ){
set $txt $arg_txt;
}
qrcode_fg_color $fg_color;
qrcode_bg_color $bg_color;
qrcode_level $level;
qrcode_hint $hint;
qrcode_size $size;
qrcode_margin $margin;
qrcode_version $version;
qrcode_casesensitive $case;
qrcode_urlencode_txt $txt;
qrcode_gen;
}
}
}

將上面的配置保存爲 nginx.conf，而後使用下面的命令進行鏡像構建。

docker build -t docker.lab.com/qrcode.lab.com .

若是你的網絡通暢，5分鐘以內，這個鏡像就構建完畢了。接下來，咱們對它進行一下可用性驗證。

將下面的配置文件保存爲 docker-compose.yml，而後使用 docker-compose up 命令啓動，一個支持 HTTP/HTTPS，域名爲 qrcode.lab.com 的網站就準備就緒了。

這裏我使用了 Traefik 進行服務發現，感興趣的童鞋能夠參考我之前寫的文章：使用服務發現改善開發體驗、更完善的 Docker + Traefik 使用方案、使用 Traefik 的一些補充細節），一旦你開始使用並掌握了它，你會發現搭建高可擴展的 Web 服務變的更簡單了。

version: '3'
services:
qrcode:
image: docker.lab.com/qrcode.lab.com:0.0.2
expose:
- 80
networks:
- traefik
labels:
- "traefik.enable=true"
- "traefik.port=80"
- "traefik.frontend.rule=Host:qrcode.lab.com"
- "traefik.frontend.entryPoints=http,https"
networks:
traefik:
external: true

而後咱們在瀏覽器中分別訪問，來驗證二維碼服務是否就緒：

https://qrcode.lab.com
https://qrcode.lab.com/?size=150&margin=20&txt=https%3A%2F%2Fsoulteary.com

看來服務是正常運行的，本文的基礎需求到這裏就解決了，而且，爲了這個服務可以更好的被使用，咱們能夠在書籤中輸入下面的腳本代碼：

javascript:(function(){document.location.href='https://qrcode.lab.com/?size=150&txt='+encodeURIComponent(document.location.href);})()

當你點擊書籤的時候，會將當前頁面自動轉換爲一個能夠掃描的二維碼。

經過整合語句優化容器鏡像

雖然上面的內容已經知足了咱們的基礎需求，可是做爲一個有追求的開發者，咱們不光是要追求執行效率，還要追求儲存效率。

雖然 Nginx 的運行資源佔用很少。

top - 09:50:29 up 21 days, 19 min, 0 users, load average: 0.03, 0.05, 0.05
Tasks: 4 total, 1 running, 3 sleeping, 0 stopped, 0 zombie
%Cpu(s): 0.3 us, 0.3 sy, 0.0 ni, 99.4 id, 0.0 wa, 0.0 hi, 0.0 si, 0.0 st
KiB Mem : 6101684 total, 332268 free, 3649484 used, 2119932 buff/cache
KiB Swap: 998396 total, 936632 free, 61764 used. 2122020 avail Mem
PID USER PR NI VIRT RES SHR S %CPU %MEM TIME+ COMMAND
8 nobody 20 0 72352 4792 3124 S 0.7 0.1 0:00.02 nginx
1 root 20 0 70800 4996 4240 S 0.0 0.1 0:00.01 nginx

可是使用 docker images 命令查看鏡像詳情，咱們能夠看到這個鏡像仍是挺大的，有 400+MB。

REPOSITORY TAG IMAGE ID CREATED SIZE
docker.lab.com/qrcode.lab.com 0.0.1 d98376b43ae9 About a minute ago 454MB

這裏咱們修改一下上面的鏡像 Dockerfile，嘗試從新進行鏡像構建。

FROM ubuntu:18.04
RUN cat /etc/apt/sources.list | sed -e "s/archive\.ubuntu\.com/mirrors\.aliyun\.com/" | sed -e "s/security\.ubuntu\.com/mirrors\.aliyun\.com/" | tee /etc/apt/sources.list
WORKDIR /tmp
RUN apt update && apt install -y unzip wget autoconf automake autotools-dev libtool pkg-config libpng-dev libgd-dev libpcre3 libpcre3-dev && \
wget https://nginx.org/download/nginx-1.15.5.tar.gz && tar -zxvf nginx-1.15.5.tar.gz && rm -rf nginx-1.15.5.tar.gz && \
wget https://github.com/dcshi/ngx_http_qrcode_module/archive/master.zip && unzip master.zip && mv ngx_http_qrcode_module-master ngx_http_qrcode_module && rm -rf master.zip && \
wget https://github.com/fukuchi/libqrencode/archive/master.zip && unzip master.zip && mv libqrencode-master libqrencode && \
cd libqrencode && ./autogen.sh && ./configure && make && make install && ldconfig && \
cd /tmp/nginx-1.15.5 && ./configure --add-module=../ngx_http_qrcode_module/ && make && make install && \
apt remove -y unzip wget autoconf automake autotools-dev libtool pkg-config && \
rm -rf /tmp/* && rm -rf /var/cache/
ADD nginx.conf /usr/local/nginx/conf/nginx.conf
EXPOSE 80
ENTRYPOINT [ "/usr/local/nginx/sbin/nginx", "-g", "daemon off;" ]

再次構建完畢，咱們會發現鏡像只是減小了 35MB，相比較 400MB 多的總體體積，優化部分杯水車薪。

REPOSITORY TAG IMAGE ID CREATED SIZE
docker.lab.com/qrcode.lab.com 0.0.1 a24ffc73121a 1 minutes ago 420MB

那麼優化就到此爲止了麼？顯然不是。

經過優化基礎鏡像來優化容器鏡像

這裏咱們選擇使用體積更小的 Linux 鏡像， Alpine來進行一樣功能的二維碼服務的容器鏡像。

由於 Alpine 和 Ubuntu 不是一個社區進行維護，因此軟件包不少名稱是不一樣的，這裏我直接提供我已經查找修改完畢的鏡像文件。

若是你也有相似的需求，須要將不一樣系統的軟件進行遷移安裝，能夠在 https://pkgs.alpinelinux.org/packages 查找你所須要的軟件包的名稱。

FROM alpine:3.8
RUN cat /etc/apk/repositories | sed -e "s/dl-cdn.alpinelinux.org/mirrors.aliyun.com/" | tee /etc/apk/repositories && \
apk --update add openssl-dev pcre-dev zlib-dev wget build-base autoconf automake libtool libpng-dev libgd pcre pcre-dev pkgconfig gd-dev && \
cd /tmp && \
wget https://nginx.org/download/nginx-1.15.5.tar.gz && tar -zxvf nginx-1.15.5.tar.gz && rm -rf nginx-1.15.5.tar.gz && \
wget https://github.com/dcshi/ngx_http_qrcode_module/archive/master.zip && unzip master.zip && mv ngx_http_qrcode_module-master ngx_http_qrcode_module && rm -rf master.zip && \
wget https://github.com/fukuchi/libqrencode/archive/master.zip && unzip master.zip && mv libqrencode-master libqrencode && \
cd libqrencode && ./autogen.sh && ./configure && make && make install && ldconfig || true && \
cd /tmp/nginx-1.15.5 && ./configure --add-module=../ngx_http_qrcode_module/ && make && make install && \
apk del build-base autoconf automake pkgconfig && \
rm -rf /tmp/* && rm -rf /var/cache/apk/*
ADD nginx.conf /usr/local/nginx/conf/nginx.conf
EXPOSE 80
ENTRYPOINT [ "/usr/local/nginx/sbin/nginx", "-g", "daemon off;" ]