nginx 配置前后端分离项目

前后端分离项目,用nginx转发请求,部署到一个服务器上。

效果

后端接口是9999端口,前端静态资源是80端口,请求时都是www.xx.com,如果是后端接口前缀带上/apis/

比如登录 前端资源www.xx.com/login/a.jpg  后端接口是 www.xx.com/apis/login

服务上吧静态资源放在/home/xx/dist内,后端是jar包启动在9999端口 nginx将 www.xx.com/apis/login转发为localhost:9999/login

操作

  • 安装nginx自行百度
  • 修改nginx的配置文件  忘记了的话  搜一下  find / -name nginx.conf
  • 修改配置文件 vim nginx.conf 将其中是server改为如下 
  • 启动nginx 注意启动时指定配置文件 nginx -c /usr/nginx.conf

注意:nginx的那个正则是过滤了apis的,比如我登录接口 localhost:9999/login.那么前端请求是www.xx.com/apis/login 如果想被过滤掉自行修改下配置文件中的rewrite那个正则

附配置nginx的配置文件

 server {
        listen   80;//监听80端口 即外部浏览器访问80端口才会被转发
	    #访问后端接口,代理访问9999端口
        #以/apis开头的会访问到proxy_pass设置的
        location /apis{
        rewrite  ^.+apis/?(.*)$ /$1 break;
        include  uwsgi_params;
        proxy_pass   http://localhost:9999;
       }
	    #前端代码 页面跳转直接访问80端口
        location / {
            #增加请求头
           add_header Access-Control-Allow-Origin *;
           add_header Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Accept";
           add_header Access-Control-Allow-Methods "GET, POST, OPTIONS";
           root   /home/xx/dist;
           index  index.html index.html;
        }
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
     }

有问题联系 1294235127 欢迎指点

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值