如何使用nginx实现前后端分离部署(iview-admin+webpack+nginx+laravel)

        前两天在工作中遇到一个问题:如何使用nginx配置laravel项目,使前后端分离在不同监听端口上,通过切换url实现前端和后端的分离展示。我在网上也查找了许多方法,但是大多数方法都不适用,在这里将我的方法分享一下。

        前端使用iview-admin框架搭建项目,webpack打包,后端使用laravel-admin实现。首先打开nginx配置文件/etc/nginx/sites-available中的default文件:

        

一、配置nginx前端访问

        首先需要在前端的在front-end文件夹下使用npm run build,即可在该文件夹下生成dist文件夹。前端nginx访问的配置如下:

如何使用nginx实现前后端分离部署(iview-admin+webpack+nginx+laravel)_第1张图片

       在上图的1中写上自己项目的地址,要具体到dist文件夹,在2处写上服务器的内网地址+端口号,这里端口号为后端的监听端口号,在3处也要写上后端监听的端口号。

二、配置nginx后端访问

      访问后端的nginx配置如下:

如何使用nginx实现前后端分离部署(iview-admin+webpack+nginx+laravel)_第2张图片

        在上图1处上写上项目的地址,具体到public文件夹,这是后端程序的监听在8000端口上,与前端nginx配置的后端监听端口一致。

三、总结

        这样配置就可以实现前后端分离访问,不过问题是通过前端访问后端程序时,端口号会自动重定向到8000端口,这个问题暂时没有解决。

你可能感兴趣的:(ubuntu)