Nginx前端后端共用一个域名如何配置

原创

已于 2025-02-07 11:37:19 修改 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#nginx #前端 #运维

于 2025-01-26 11:12:06 首次发布

在 Nginx 中配置前端和后端共用一个域名的情况，通常是通过路径或子路径将请求转发到不同的服务。以下是一个示例配置，假设：

前端静态文件在 /var/www/frontend/。
后端 API 服务运行在 http://127.0.0.1:5000。
域名是 example.com，其中：
静态前端通过 example.com 访问。
后端 API 通过 example.com/api/ 访问。

server {
   
   
    listen 80;
    server_name example.com;

    # 配置前端静态文件
    location / {
   
   
        root /var/www/frontend;
        index index.html;

        # 支持前端 history 模式路由
        try_files $uri $uri/ /index.html;
    }

    # 配置后端 API 路由
    location /api/ {
   
   
        proxy_pass http://127.0.0.1:5000;
        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;
    }

    # 配置错误页面（可选）
    error_page