Nginx

1.Nginx能干啥？

静态资源

能高效地提供 HTML、CSS、JavaScript、图片等静态文件，减少后端应用服务器的压力。（你网站的图片、HTML 页面，Nginx 能飞快地发给用户）

正向/反向代理

反向代理是指服务器接受客户端的请求，然后将请求转发给后端服务器，并将后端服务器的响应返回给客户端。反向代理隐藏了服务器的真实身份和位置信息，客户端只知道与反向代理进行通信，而不知道真正的服务器。
正向代理是客户端发送请求后代理服务器访问目标服务器，代理服务器代表客户端发送请求并将相应返回给客户端。正向代理隐藏了客户端的真实身份和位置信息，为客户端提供代理访问互联网的功能。

负载均衡

把大量的请求按照、我们指定的指定的方式均衡的分配给集群中的每台服务器。

举个例子简单解释一下Nginx的作用

场景：你家开了个杂货铺（后端服务器），但顾客（用户）太多，门口挤得水泄不通。于是你在街口设了个"代收点"（Nginx），顾客只和代收点打交道。

🔍 核心作用：

附加服务
代收点还能顺手做打包（Gzip压缩）、验货（SSL加密）、暂存热门商品（缓存），比如顾客要买畅销酱油，直接从代收点拿，不用跑仓库。
隐藏真实店铺
顾客不知道杂货铺具体在哪（IP地址被隐藏），代收点统一收货、发货，防止小偷盯上店铺（防攻击）。
统一分发任务
顾客要买米、买菜、退货，代收点自动分给仓库、收银员、售后员（后端不同服务），顾客只用找代收点一个地方。

nginx 反向代理的好处

提高访问速度

因为nginx本身可以进行缓存，如果访问的同一接口，并且做了数据缓存，nginx就直接可把数据返回，不需要真正访问服务端，从而提高访问速度

进行负载均衡

所谓负载均衡，就是把大量的请求按照我们指定的方式均衡的分配给集群中的每台服务器。

保证后端服务安全

因为一般后台服务地址不会暴露，所以浏览器不能直接访问，可以把nginx 作为请求访问的入口；请求到达nginx 后转发到具体的服务器中，从而保证后端服务的安全。

💡提示: 上面都是我在ai上问的那种专业的概念, 看不懂很正常, 我刚开始听课的时候也不懂很懵, 直到我自己用阿里云服务器部署我自己的项目, 就懂了它大概是干什么, 哦对如果了解前端路由那块的知识, 也有很大帮助哦! ! !

3、📦 配置示例(用nginx部署项目的完整流程）

放置前端文件：

把前端打包后的所有文件（通常在dist目录下）复制到 Nginx 的html目录（默认路径：/usr/share/nginx/html）
比如：如果打包后的文件在本地./dist，执行命令：cp -r ./dist/* /usr/share/nginx/html/

修改配置文件：

找到 Nginx 的配置文件（通常在/etc/nginx/conf.d/default.conf或/etc/nginx/nginx.conf）
替换成你需要的配置

访问验证：

浏览器访问http://localhost（80 端口），就能看到你的前端页面
前端调用/api/xxx接口时，会自动转发到localhost:8081/xxx

也就是说整个nginx你只需要注意这两个文件夹html目录和Nginx 的配置文件（通常在/etc/nginx/conf.d/default.conf或/etc/nginx/nginx.conf）: 其中最重要的也是这个配置文件, 上面提到的nginx的工作原理和好处都是它实现的

bash 复制代码

server {
    # Nginx对外监听80端口（你浏览器访问的端口）
    listen       80;
    # 访问域名，localhost即可
    server_name  localhost;
    # 上传文件大小限制，保持10MB即可
    client_max_body_size 10m;

    # 前端页面配置（核心）
    location / {
        # 前端打包后的dist文件存放目录（关键！需要改成你实际的路径）
        # 示例：如果你的前端打包文件放在 /usr/share/nginx/html/dist ，就写 root /usr/share/nginx/html/dist;
        # 如果直接放在Nginx默认的html目录，就写 root html;
        root   html;
        # 前端首页文件
        index  index.html index.htm;
        # 解决Vue/React等前端路由刷新404的问题（必须保留）
        try_files $uri $uri/ /index.html;
    }
        
    # 后端接口转发配置（修改为你的8081端口）
    location ^~ /api/ {
        # 去掉/api前缀（如果后端接口本身就带/api，可删除这行）
        rewrite ^/api/(.*)$ /$1 break;
        # 转发到你的后端服务地址：localhost:8081
        proxy_pass http://localhost:8081;
        # 补充必要的proxy配置（避免后端获取不到正确的请求信息）
        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   500 502 503 504  /50x.html;
    location = /50x.html {
        root   html;
    }
}

nginx监听的是80端口，服务器名是本地（http://localhost:80）。如果匹配到api字符（http://localhost:80/api/xxx），就转发到proxy_pass对应的地址（http://localhost:8081/xxx）。

要注意的是这段配置:

java 复制代码

location ^~ /api/ {//匹配 location ^~ /api/
    rewrite ^/api/(.*)$ /$1 break;//执行 rewrite：/api/report/empGenderData → 变成 /report/empGenderData
    proxy_pass http://localhost:8081;//转发到后端：http://localhost:8081/report/empGenderData
}

它的意思是:

① 当前端http://localhost:80/api/xxx,去掉 /api 前缀

java 复制代码

/api/student/countByDept
→ 变成
/student/countByDept

② 转发给后端 8081

Nginx 自己去访问：

java 复制代码

http://localhost:8081/student/countByDept

🧩扩展: 你可能会有这样的疑问:我现在有好几个项目在我的服务器, 我是不是要有要好多nginx?

我们完全不用新建多个 Nginx 容器, 因为80 端口是服务器的 "大门"，只能被一个 Nginx 容器占用 ------ 只需要在同一个 Nginx 容器里配置多个 server 块，用「域名 / 路径区分不同项目」即可。

🎯 方案 1：用「不同域名」区分不同项目（推荐，生产环境常用）

如果你的服务器有多个域名（或想解析多个二级域名），比如：

项目 1：project1.xxx.com → 对应前端 1 + 后端 1
项目 2：project2.xxx.com → 对应前端 2 + 后端 2

修改后的 nginx.conf 示例：

java 复制代码

user  nobody;
worker_processes  1;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;

    # 项目1：project1.xxx.com
    server {
        listen       80;
        server_name  project1.xxx.com; # 你的第一个域名/二级域名

        # 项目1前端静态资源
        location / {
           root   /usr/share/nginx/html/project1; # 前端1打包文件放在这个目录
           index  index.html index.htm;
           try_files $uri $uri/ /index.html;
        }
        # 项目1后端API转发
        location ^~ /api/ {
           rewrite ^/api/(.*)$ /$1 break;
           proxy_pass http://project1-server:8080; # 项目1后端容器名
           proxy_set_header Host $host;
           proxy_set_header X-Real-IP $remote_addr;
           proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        }
    }

    # 项目2：project2.xxx.com
    server {
        listen       80;
        server_name  project2.xxx.com; # 你的第二个域名/二级域名

        # 项目2前端静态资源
        location / {
           root   /usr/share/nginx/html/project2; # 前端2打包文件放在这个目录
           index  index.html index.htm;
           try_files $uri $uri/ /index.html;
        }
        # 项目2后端API转发
        location ^~ /api/ {
           rewrite ^/api/(.*)$ /$1 break;
           proxy_pass http://project2-server:8080; # 项目2后端容器名
           proxy_set_header Host $host;
           proxy_set_header X-Real-IP $remote_addr;
           proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        }
    }
}

🎯 方案 2：用「不同路径」区分不同项目（无域名时用）

如果只有一个公网 IP / 域名，比如：

项目 1：http://你的公网IP/project1 → 对应前端 1 + 后端 1
项目 2：http://你的公网IP/project2 → 对应前端 2 + 后端 2

修改后的 nginx.conf 示例

java 复制代码

user  nobody;
worker_processes  1;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;

    server {
        listen       80;
        server_name  你的公网IP; # 只有一个IP/域名

        # 项目1：路径 /project1
        location /project1/ {
           root   /usr/share/nginx/html; # 前端1打包文件放在 /usr/share/nginx/html/project1
           index  index.html index.htm;
           try_files $uri $uri/ /project1/index.html; # 注意路径补全
        }
        # 项目1API：路径 /project1/api
        location ^~ /project1/api/ {
           rewrite ^/project1/api/(.*)$ /$1 break;
           proxy_pass http://project1-server:8080;
           proxy_set_header Host $host;
           proxy_set_header X-Real-IP $remote_addr;
           proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        }

        # 项目2：路径 /project2
        location /project2/ {
           root   /usr/share/nginx/html; # 前端2打包文件放在 /usr/share/nginx/html/project2
           index  index.html index.htm;
           try_files $uri $uri/ /project2/index.html;
        }
        # 项目2API：路径 /project2/api
        location ^~ /project2/api/ {
           rewrite ^/project2/api/(.*)$ /$1 break;
           proxy_pass http://project2-server:8080;
           proxy_set_header Host $host;
           proxy_set_header X-Real-IP $remote_addr;
           proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        }
    }
}