寻求服务器端Web应用与REST API部署的配置建议

嘿，根据你现在的部署情况，我整理了几个实用的优化方案，帮你简化访问流程、提升服务可靠性：

你现在三个应用用不同端口，用户访问得记一串数字，体验很差。用Nginx做反向代理，把所有请求都收拢到80（HTTP）或443（HTTPS）端口，用户只需要记域名就行，还能灵活区分不同服务。

配置思路 #

按域名或路径来转发请求：

• 用户Web应用（React+Node.js）：绑定主域名 www.xyz.com，转发到 localhost:3389
• 管理Web应用：用子域名 admin.xyz.com 或路径 www.xyz.com/admin，转发到Apache的管理端
• 用户API：用子域名 api.xyz.com 或路径 www.xyz.com/api，转发到Apache的API服务

Nginx配置示例（子域名区分） #

# 用户Web应用
server {
    listen 80;
    server_name www.xyz.com;

    location / {
        proxy_pass http://localhost:3389;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}

# 管理端应用
server {
    listen 80;
    server_name admin.xyz.com;

    location / {
        proxy_pass http://localhost:8080; # 假设管理端是Apache的默认站点
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}

# 用户API
server {
    listen 80;
    server_name api.xyz.com;

    location / {
        proxy_pass http://localhost:8080; # 假设API是Apache的另一个虚拟主机
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        # API必备的CORS配置，避免跨域问题
        add_header Access-Control-Allow-Origin *;
        add_header Access-Control-Allow-Methods 'GET, POST, PUT, DELETE, OPTIONS';
        add_header Access-Control-Allow-Headers 'Content-Type, Authorization';
    }
}

如果不想用子域名，也可以用路径区分（把配置合并到同一个server块）：

server {
    listen 80;
    server_name www.xyz.com;

    # 用户Web应用
    location / {
        proxy_pass http://localhost:3389;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }

    # 管理端应用
    location /admin {
        proxy_pass http://localhost:8080/admin;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }

    # 用户API
    location /api {
        proxy_pass http://localhost:8080/api;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        # CORS配置
        add_header Access-Control-Allow-Origin *;
        add_header Access-Control-Allow-Methods 'GET, POST, PUT, DELETE, OPTIONS';
        add_header Access-Control-Allow-Headers 'Content-Type, Authorization';
    }
}

你现在把管理端和API都放在Apache的8080端口，很容易出现路径冲突。建议给它们配置独立的虚拟主机，各自用不同的根目录：

Apache虚拟主机配置示例 #

在Apache的sites-available目录下新建两个配置文件：

# 管理端Laravel配置
<VirtualHost *:8080>
    ServerName admin.localhost # 本地测试用，线上改成admin.xyz.com
    DocumentRoot /var/www/laravel-admin/public

    <Directory /var/www/laravel-admin/public>
        AllowOverride All
        Require all granted
    </Directory>
</VirtualHost>

# API Laravel配置
<VirtualHost *:8080>
    ServerName api.localhost # 本地测试用，线上改成api.xyz.com
    DocumentRoot /var/www/laravel-api/public

    <Directory /var/www/laravel-api/public>
        AllowOverride All
        Require all granted
    </Directory>
</VirtualHost>

配置完成后启用站点：

sudo a2ensite laravel-admin.conf laravel-api.conf
sudo systemctl restart apache2

现在都是HTTP访问，不安全也不符合现代网站规范。用Let's Encrypt免费证书就能搞定，步骤很简单：

1. 安装certbot工具：sudo apt install certbot python3-certbot-nginx（Ubuntu/Debian）
2. 获取证书并自动配置Nginx：sudo certbot --nginx -d www.xyz.com -d admin.xyz.com -d api.xyz.com
3. 按提示操作，certbot会自动帮你把HTTP请求跳转到HTTPS

Node.js应用容易因为异常崩溃，用PM2可以确保进程持续运行，还能方便查看日志和监控：

1. 安装PM2：npm install pm2 -g
2. 启动你的React Node.js服务：pm2 start server.js --name "user-web-app"（替换成你的入口文件）
3. 设置开机自启：pm2 startup，然后按提示执行生成的命令
4. 查看日志：pm2 logs user-web-app，排查问题很方便

React应用构建后会生成静态文件，直接用Nginx托管这些文件，能减轻Node.js的压力，访问速度也更快：

1. 先构建React应用：npm run build
2. 修改Nginx配置，优先托管静态文件：

server {
    listen 443 ssl;
    server_name www.xyz.com;
    # SSL配置由certbot自动生成，不用手动改

    root /path/to/react-app/build;
    index index.html;

    # 静态资源设置长期缓存，提升加载速度
    location /static/ {
        expires 30d;
        add_header Cache-Control "public, immutable";
    }

    # SPA应用的路由兼容，找不到的页面返回index.html
    location / {
        try_files $uri $uri/ /index.html;
        # 如果是SSR应用，就用proxy_pass转发到Node.js，否则直接用上面的配置就行
    }
}

内容的提问来源于stack exchange，提问作者anshuk_pal