Nginx Proxy Manager (NPM) 主要设计为反向代理工具，但可以通过 自定义Nginx配置 托管静态页面,具体步骤如下

1. Nginx Proxy Manager 安装

我们通过docker安装 docker-compose.yml

version: '3'
services:
  app:
    image: 'chishin/nginx-proxy-manager-zh:latest'
    restart: always
    ports:
      - '80:80'
      - '81:81'
      - '443:443'
    volumes:
      - ./data:/data
      - ./letsencrypt:/etc/letsencrypt

通过如下命令启动

sh
docker compose up -d

2. 如何托管静态站点

2.1 添加代理主机

• 登录 NPM 管理界面。
• 转到 Hosts → Proxy Hosts → Add Proxy Host.
• 在 Domain Names 中填写域名（或留空托管IP访问）。
• 其他设置留空（无需填写目标地址）。

2.2 自定义nginx配置

切换到 Advanced 标签页，添加以下配置

nginx
location / {
    root /var/www/mysite;  # 替换为你的静态文件目录
    index index.html;
    try_files $uri $uri/ /index.html; # 防止vue、react等spa但页面应用刷新404问题
}

注意上面的静态文件文件要替换成宿主机的目录，例如：/data/website/meng-admin

3. 其他配置

3.1 配置api接口反向代理

nginx
# 处理以/ma/api开头的请求
location ^~ /ma/api {
    # 重写URL：去掉/ma，保留/api及后面的部分
    rewrite ^/ma(/.*)$ $1 break;

    # 代理到目标服务器
    proxy_pass http://x.x.x.x:xx; # 转发到目标地址

    # 以下为常见的代理设置，根据需要添加
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;

    
    # 如果目标服务器需要处理WebSocket，可以添加以下两行
    # proxy_http_version 1.1;
    # proxy_set_header Upgrade $http_upgrade;
    # proxy_set_header Connection "upgrade";
}

4. 开启gzip，示例配置如下

nginx
# ======================
# GZIP 压缩配置（核心）
# ======================
gzip on;  # 启用 gzip 压缩
gzip_min_length 1k;  # 最小压缩文件大小（1KB以上才压缩）
gzip_comp_level 6;   # 压缩级别（1-9，6是较好的平衡点）
gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;  # 压缩的文件类型
gzip_vary on;       # 根据客户端支持情况动态启用压缩
gzip_proxied any;   # 对所有代理请求启用压缩
gzip_buffers 16 8k; # 压缩缓冲区
gzip_http_version 1.1; # 启用压缩的最小 HTTP 版本


location / {
   root /data/website/meng-admin;
   index index.html;
    try_files $uri $uri/ /index.html;
autoindex on;
            gzip on;
}

location ^~ /vite.svg {
   root /data/website/meng-admin/;
}

location  ^~  /assets{
    alias /data/website/meng-admin/assets;
    index index.html;
autoindex on;

expires 30d;
    add_header Cache-Control "public, no-transform";

            # 启用 gzip 和 Brotli 压缩
    gzip_static on;  # 优先使用预压缩文件
    # brotli_static on;
    
    # 确保路径正确结尾
    # 注意：移除了try_files中的路径重写
    try_files $uri $uri/ =404;
}

# 处理以/ma/api开头的请求
location ^~ /ma/api {
    # 重写URL：去掉/ma，保留/api及后面的部分
    rewrite ^/ma(/.*)$ $1 break;

    # 代理到目标服务器
    proxy_pass http://x.x.x.x:xx;

    # 以下为常见的代理设置，根据需要添加
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;

# 启用代理压缩
    proxy_set_header Accept-Encoding gzip;
    
    # 如果目标服务器需要处理WebSocket，可以添加以下两行
    # proxy_http_version 1.1;
    # proxy_set_header Upgrade $http_upgrade;
    # proxy_set_header Connection "upgrade";
}