哈哈哈哈哈哈

终于被我用AI发掘到 同一个域名部署多个不同类型项目的ngxin解决方案了！！！

就是有一个一直纠结我的问题

我现在有一个Nuxt项目部署在a.cn/ 下面
然后我想在此项目基础上创建多个附属项目挂载在a.cn/admin/*** 下面，
这时候问题就来了，Nuxt的基础项目的路由会因为它本身项目里没有/admin/**路径的原因 拦截该路由并重定向404

这个问题从 23年就开始纠结我了，因为当时有 多个项目需要部署在这个路径之下。关于这个问题 我咨询过 前端群、ChatGpt、问心、Copilot、等。就在昨天晚上也就是3月22日，我尝试性的询问 国产AI deepseek，在一番询问下，给出了这个出色解决方案！

balabala

server
{
listen 80;
   server_name 192.168.24.133;
    index index.html index.htm default.htm default.html;
    #    root /www/wwwroot/ces/api;

    # HTTP反向代理相关配置开始 >>>
    location ~ /purge(/.*) {
                proxy_cache_purge cache_one    
                $host$request_uri$is_args$args;
    }

这里！！！

  ** 项目2
  # 优先处理 /admin/ 请求，指向静态资源目录
  location ^~ /admin/ {
      alias /www/wwwroot/ces/admin/;  # 注意结尾的斜杠
      try_files $uri $uri/ /index.html;
      # 解决 Vue 路由的 History 模式 404 问题
      if (!-e $request_filename) {
          rewrite ^/admin/(.*) /admin/index.html last;
      }
  }

因为这个是一个Vue3的技术栈 所以生产出来的结果是静态的SPA项目 如果是动态的需要部署到其他端口的可以参考这个方案

server {
    listen 80;
    server_name a.cn;
    # 主Nuxt应用
    location / {
        proxy_pass http://localhost:3000; # 主应用运行端口
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }
    # 附属项目
    location /admin/ {
        proxy_pass http://localhost:3001/; # 附属应用运行端口
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        # 可选：去掉路径中的/admin前缀，若附属项目需要处理根路径
        # rewrite ^/admin/(.*) /$1 break;
    }
}

balabala

    location /api {
        proxy_pass http://127.0.0.1:666;
        proxy_set_header Host $host:$server_port;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header REMOTE-HOST $remote_addr;
        add_header X-Cache $upstream_cache_status;
        proxy_set_header X-Host $host:$server_port;
        proxy_set_header X-Scheme $scheme;
        proxy_connect_timeout 30s;
        proxy_read_timeout 86400s;
        proxy_send_timeout 30s;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }
    ** 项目1
    location / {
        proxy_pass http://127.0.0.1:777;
        proxy_set_header Host $host:$server_port;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header REMOTE-HOST $remote_addr;
        add_header X-Cache $upstream_cache_status;
        proxy_set_header X-Host $host:$server_port;
        proxy_set_header X-Scheme $scheme;
        proxy_connect_timeout 30s;
        proxy_read_timeout 86400s;
        proxy_send_timeout 30s;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }
    # HTTP反向代理相关配置结束 <<<

    access_log  /www/wwwlogs/api.log;
    error_log  /www/wwwlogs/api.error.log;
}

这样就可以通过 a.cn访问 a.cn/ 和 a.cn /admin 两个路径下的不同项目了！！ 而且刷新不会被第一个项目的路由所捕捉导致跳转404！！！