网站部署杂记

技术选型

前端模板：Shiro
后端服务：Mix Space
反向代理：Caddy（支持自动 HTTPS 证书申请）
域名和服务器均在腾讯云上
docker compose部署

部署步骤

进行域名备案，如果不备案腾讯云dns会劫持域名解析，同时也会让caddy的自动申请证书功能失败
docker compose先部署caddy和mix space服务，进入后台管理界面对网站进行基础配置，特别是此配置，然后再部署shiro服务；也可三个服务一起部署，但是在后台配置完成前，一定不要访问前端服务 (原因下文会讲)

遇到的问题

caddy无法自动申请证书

caddy无法申请证书，会报如下图的acme的错误，查询后发现是因为腾讯云购买的域名的dns解析为dnspod，caddy需要安装对应的dns解析插件。

参考caddy的官方镜像的文档，知道如何build加入dnspod组件的镜像，重新build一个定制镜像即可，这是dnspod 需要的插件

Dockerfile如下：

FROM caddy:2.9.1-builder-alpine AS builder

RUN xcaddy build \
    --with github.com/caddy-dns/dnspod

FROM caddy:2.9.1-alpine

COPY --from=builder /usr/bin/caddy /usr/bin/caddy

也可以使用我已经build好的镜像chen1yuan2/caddy-dnspod:2.9.1-alpine

前端页面报【禁止访问或者API服务出现问题】的错误

在部署完三个服务后，在根据此基础设置在后台管理页面进行配置之前就访问了shiro前端页面，会出现这个issue提到的错误

通过翻源码https://github.com/Innei/Shiro/blob/8a9bad3b4ffba42dc57ec0b16ccc64a2f10bf159/src/app/(app)/api.tsx#L14 发现是使用了react的cache这个api导致的，初次访问时会调用后端接口获取上文提到的配置的内容，然后把结果缓存下来，因为此函数调用没有参数，所以后续的请求都会命中react的缓存，导致获取值一直为空，即便后续在后台配置了对应配置也无用，除非重启shiro这个前端服务

caddy反代无法找到前后端服务

因为使用了3个docker compose 分别进行部署，network不通用，需要使用一个统一的network,解决方案就是需要在mix space的compose文件里声明一个网络，然后在其他两个服务的docker-compose.yaml中使用这个网络，这样才能保证三个服务之间的通信。

参考部署配置

mix space的配置

mix-space的docker-compose.yml

services:
  app:
    container_name: mx-server
    image: innei/mx-server:latest
    environment:
      - TZ=Asia/Shanghai
      - NODE_ENV=production
      - DB_HOST=mongo
      - REDIS_HOST=redis
      - ALLOWED_ORIGINS=*.tuolanzhiren.site,tuolanzhiren.site
      - JWT_SECRET=YOU_SECRET
    volumes:
      - ./data/mx-space:/root/.mx-space
    ports:
      - '2333:2333'
    depends_on:
      - mongo
      - redis
    networks:
      - mx-space
    restart: unless-stopped
    healthcheck:
      test: ['CMD', 'curl', '-f', 'http://127.0.0.1:2333/api/v2/ping']
      interval: 1m30s
      timeout: 30s
      retries: 5
      start_period: 30s

  mongo:
    container_name: mongo
    image: mongo
    volumes:
      - ./data/db:/data/db
    networks:
      - mx-space
    restart: unless-stopped

  redis:
    image: redis:alpine
    container_name: redis
    volumes:
      - ./data/redis:/data
    healthcheck:
      test: ['CMD-SHELL', 'redis-cli ping | grep PONG']
      start_period: 20s
      interval: 30s
      retries: 5
      timeout: 3s
    networks:
      - mx-space
    restart: unless-stopped

networks:
  mx-space:
    name: mx-space

shiro的配置

shiro的docker-compose.yml

version: '3'

networks:
  mx-space:
    external: true
    name: mx-space    # 声明这是一个外部网络

services:
  shiro:
    networks:
      - mx-space
    container_name: shiro
    image: innei/shiro:latest
    volumes:
      - ./.env:/app/.env
      - ./favicon.ico:/app/public/favicon.ico
    restart: always
    environment:
      - NEXT_SHARP_PATH=/usr/local/lib/node_modules/sharp
    ports:
      - 2323:2323

caddy的配置

caddy的docker-compose.yml

networks:
  mx-space:
    external: true
    name: mx-space    # 声明这是一个外部网络

services:
  caddy_reverse_proxy:
    networks:
      - mx-space
    # Use the caddy:latest image from Docker Hub
    image: chen1yuan2/caddy-dnspod:2.9.1-alpine
    # Restart policy: restart the container unless explicitly stopped
    restart: unless-stopped
    container_name: caddy_proxy
    # ports for Caddy
    ports:
      - 443:443
      - 80:80
    volumes:
      # Mount the host Caddyfile
      - ./Caddyfile:/etc/caddy/Caddyfile
      - ./caddy_data:/data
      - ./caddy_config:/config

caddy的Caddyfile

www.tuolanzhiren.site {
    redir https://tuolanzhiren.site{uri} permanent
}

tuolanzhiren.site {
  log {
    format console
  }


    # 反向代理 socket.io
    handle /socket.io/* {
        reverse_proxy app:2333 {
            header_up Host {host}
            header_up Connection "Upgrade"
            header_up Upgrade {http.request.header.Upgrade}
        }
    }

    # 反向代理其他路径
    handle /api/v2/* {
        reverse_proxy app:2333
    }

    handle /render/* {
        reverse_proxy app:2333
    }

    handle_path /qaqdmin/* {
        rewrite * /proxy/qaqdmin{path}
        reverse_proxy app:2333
    }

    handle /proxy/* {
        reverse_proxy app:2333
    }

    # 处理 feed/sitemap/atom.xml
    handle /feed {
        reverse_proxy app:2333
    }
    handle /sitemap {
        reverse_proxy app:2333
    }
    handle /atom.xml {
        reverse_proxy app:2333
    }

    # 默认路由
    handle /* {
        reverse_proxy shiro:2323
    }
}

总结

常见问题排查

问题现象	解决方案
HTTPS 证书申请失败	检查 DNSPod 插件是否正确安装
前端配置不生效	重启 Shiro 服务清除 React 缓存
接口 404 错误	验证网络配置和路由规则