nginx的前端集成

对于springcloud项目，后端我们有很多的微服务，当然前端我们也可以有很多的小项目进行集成

前端项目部署思路

通过nginx来进行配置，功能如下

• 通过nginx的反向代理功能访问后台的网关资源

• 通过nginx的静态服务器功能访问前端静态页面

配置nginx

nginx安装的conf目录下新建一个文件夹leadnews.conf,在当前文件夹中新建heima-leadnews-app.conf文件

其中的文件名和你的后端服务名能联系起来就行

upstream  heima-app-gateway{
    server localhost:51601;                //网关的ip+端口
}

server {
    listen 8801;                // 前端项目的端口，不一样需要修改
    location / {
        root D:/workspace/app-web/;        // 该服务对应的项目地址路径
        index index.html;
    }
    
    location ~/app/(.*) {
        proxy_pass http://heima-app-gateway/$1;
        proxy_set_header HOST $host;  # 不改变源请求头的值
        proxy_pass_request_body on;  #开启获取请求体
        proxy_pass_request_headers on;  #开启获取请求头
        proxy_set_header X-Real-IP $remote_addr;   # 记录真实发出请求的客户端IP
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;  #记录代理信息
    }
}

 nginx.conf 把里面注释的内容和静态资源配置相关删除，引入heima-leadnews-app.conf文件加载

#user  nobody;
worker_processes  1;

events {
    worker_connections  1024;
}
http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;
    # 引入自定义配置文件
    include leadnews.conf/*.conf;
}

配置文件的路径根据你的实际情况修改即可

启动nginx

在nginx安装包中使用命令提示符打开，输入命令nginx启动项目

可查看进程，检查nginx是否启动

重新加载配置文件：nginx -s reload

打开前端项目进行测试

http://localhost:8801

ip和端口号不一样的话需要修改