欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Vue+Springboot前后端分离项目线上nginx配置

程序员文章站 2022-06-13 19:11:59
...

Vue+Springboot前后端分离项目线上nginx配置

实验室做项目的时候遇到了前后端分离上线的问题,前端使用的vue框架,后台是用springboot框架。后台的上线是在Tomcat上部署的,是由同学完成的。

Vue项目

用vue-cli搭建项目框架,其中用到vue-router路由跳转,因为地址不是真实存在的,而是由vue-router创建出来的虚拟路径,所以跳转地址后,无法查找到,需要单独在nginx配置文件里单独配置路由部分。

nginx的配置文件

server{
    listen 80;
    server_name www.baidu.com;//域名
    access_log /etc/nginx/logs/access.log combined;
    root /....;//前端打包文件地址
    index index.html;//打包文件入口地址

    location / {
        try_files $uri $uri/ @router;
        index index.html;
    }

    location @router {
        rewrite ^.*$ /index.html last;
    }

    location /portal/ {
        proxy_pass http://127.0.0.1:8090;
    }

    location /qqLogin/ {
        proxy_pass http://127.0.0.1:8090;
    }
}