Docker 搭建网站图标获取应用

共计 2009 个字符，预计需要花费 6 分钟才能阅读完成。

如果搭建过导航网站，那么对这个烦人的事情一定不陌生，那就是需要获取目标网站的图标，方便找网站的时候快速定位。

而我搭建的 onenav，使用官方获取网站图标的 api，大部分都不能获取到。

/>

直到看见了 favicon-downloader 这个开源的应用，发现获取图标的成功率比较高，于是就用上了。但是还发现了一些问题，还在 github 上提了几个 issue，成功让作者把版本 0.2.5.rc 修改到了 0.2.9.rc。

现在个人使用上，感觉还是不错了，效果如图：

/>

搭建方式如下：

version: '3'
services:
  favicon:
    image: seadfeng/favicon-downloader:0.2.9.rc
    container_name: favicon
    ports:
        - 3000:3000
    restart: always

需要注意的是，最好搭建在香港 vps 上，因为这个程序首先会去网站找图标，如果程序本身能力不足导致找不到会调用 google、duckduckgo 的 api 去找。

/>

搭建好就可以使用了，例如：https://favicon.153224.xyz/favicon/www.qcyqq.com

但是为了让它更好用，可以在 nginx 上做文章。因为作者目的是可以部署在 pages 上，所以他并没有做缓存，也就是说每次都需要进行查询，会导致速度很慢。另外一点，作者使用的 api 没有以 png、jpg 等静态资源文件结尾，可能导致浏览器不会进行缓存。

这里贴一下我的反代配置：

http {
    # 其他配置 
    ...
    proxy_cache_path /var/cache/nginx/favicon levels=1:2 keys_zone=image_cache:10m max_size=1g inactive=30d use_temp_path=off;
    server {
        listen 80;
        listen       443 ssl;
        listen  [::]:443 ssl;
        server_name  favicon.153224.xyz;
        ssl_certificate  /etc/nginx/conf.d/cert/153224.xyz_ecc/fullchain.cer;
        ssl_certificate_key /etc/nginx/conf.d/cert/153224.xyz_ecc/153224.xyz.key;

        #不需要的话直接注释即可
        if ($server_port != '443') { 
            rewrite ^(.*)$ https://$host:443$1 permanent; 
        }

        location / {
            # 对于特定的图片扩展名（png, jpg, gif, ico）
            if ($uri ~* \.(png|jpg|gif|ico)$) {
                rewrite ^/(.*)\.(png|jpg|gif|ico)$ /$1 last;
            }

            # 使用缓存机制
            proxy_cache image_cache;
            proxy_cache_valid 200 30d;
            proxy_cache_valid 404 1m;

            # 包含公共的 Nginx 配置文件
            proxy_buffer_size   128k;
            proxy_buffers   4 256k;
            proxy_busy_buffers_size   256k;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header Host $host;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            add_header 'Access-Control-Allow-Origin' '*';
            add_header 'Access-Control-Allow-Credentials' 'true';
            add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
            add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
            if ($server_port = 443) {
                add_header Content-Security-Policy upgrade-insecure-requests;
            }

            proxy_pass http://127.0.0.1:3000/;
        }

    }
}

这里做了两个事，首先如果请求 api 为图片或图标类型，去掉后缀再请求，也就是说 https://favicon.153224.xyz/favicon/www.qcyqq.com.png 也能拿到网站图标。第二个是设置缓存，将图标资源缓存到磁盘，这样即使客户端缓存失效了，服务端可以直接拿到缓存而不需要再发起请求。