nginx搭建前后端分离工程

今天药忘吃喽~ 2022-10-10 01:38 6阅读 0赞

首先需要在本地安装配置nginx。步骤可以看之前的博客 [https://blog.csdn.net/weixin\_42740540/article/details/118230464][https_blog.csdn.net_weixin_42740540_article_details_118230464]。有了nginx后。主要是针对nginx.conf文件做配置即可。

1.  首先将前端界面的包放到服务器的某个路径下。我的路径为/home/wftapp/vcc-app/page/H5![20210625145646398.png][]

配置nginx.conf

server {
    	         listen       8123;  //访问监听端口
    	    #    listen       somename:8080;
    	         server_name  localhost;
    	
    	        location / {
    	            root   /home/wftapp/vcc-app/page/H5/; #界面路径
    	            index  index.html index.htm;
    	            try_files $uri $uri/ /index.html;
            }
    	        
    	        access_log  logs/pkf-access.log ;   #日志路径
    	
    	        error_page   500 502 503 504  /50x.html;
            location = /50x.html {
    	            root   html;
            }
    	        
    	        location /api {
             proxy_pass  http://127.0.0.1:8066; #后端服务接口
    	        }
    
    	    }

配置完成后要检查下主机的端口在防火墙中有没有开启

firewall-cmd --zone=public --query-port=8123/tcp  检测8123端口是否开放返回yes就是开放了。如果没开放则执行

firewall-cmd --zone=public --add-port=8123/tcp --permanent 重启防火墙

systemctl restart firewalld.service  再执行检查命令是否开放

4.直接访问界面。注意这里访问一定要跟nginx配置的路径对应。不然可能出现访问不到的情况。要么是502要么是404。像我nginx配置的访问location /是这个。所以访问直接ip:端口/进行访问才能访问得到。

[https_blog.csdn.net_weixin_42740540_article_details_118230464]: https://blog.csdn.net/weixin_42740540/article/details/118230464
[20210625145646398.png]: /images/20221005/5e96b1b02a8543a48a4270efcfbe53c1.png