nginx结合前后端分离项目springboot+vue的配置

简介: nginx结合前后端分离项目springboot+vue的配置

项目采用的是前后端分离springboot+vue,通过nginx监听,转发到对应的前端页面或者后台接口调用

linux服务器上面jar包和ui的目录

/opt/hidata/hidbm-vue

nginx的相关配置

直接看nginx.conf文件

user  nginx;
worker_processes  1;
error_log  /var/log/nginx/error.log warn;
pid        /var/run/nginx.pid;
events {
    worker_connections  1024;
}
http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;
    server {
        listen       80;
        server_name  localhost;
        client_max_body_size 10M;
  location / {
      //指向前端ui的目录
            root   /opt/hidata/hidbm-vue/ui;
            try_files $uri $uri/ /index.html;
            index  index.html index.htm;
        }
  location /jsrccb {
            alias   /opt/hidata/hidbm-vue/login;
            index  index.html;
        } 
  location /stage-api/{
      proxy_set_header Host $http_host;
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header REMOTE-HOST $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      //根据前端请求代理指向后端的接口地址
      proxy_pass http://localhost:8080/;
  }
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }
    include /etc/nginx/conf.d/*.conf;
}

         


相关文章
|
3天前
|
JavaScript 前端开发 应用服务中间件
angular引入包、路由权限配置、打包问题与nginx配置问题(简单部署)
angular引入包、路由权限配置、打包问题与nginx配置问题(简单部署)
10 0
|
4天前
|
资源调度 JavaScript 前端开发
Vue的路由管理:VueRouter的配置和使用
【4月更文挑战第24天】VueRouter是Vue.js的官方路由管理器,用于在单页面应用中管理URL路径与组件的映射。通过安装并引入VueRouter,设置路由规则和创建router实例,可以实现不同路径下显示不同组件。主要组件包括:`<router-link>`用于创建导航链接,`<router-view>`负责渲染当前路由对应的组件。此外,VueRouter还支持编程式导航和各种高级特性,如嵌套路由、路由参数和守卫,以应对复杂路由场景。
|
2天前
|
前端开发 JavaScript 应用服务中间件
前端vue2、vue3去掉url路由“ # ”号——nginx配置(二)
前端vue2、vue3去掉url路由“ # ”号——nginx配置
17 0
|
2天前
|
JSON 数据可视化 前端开发
vue3+threejs+koa可视化项目——模型文件上传(第四步)
vue3+threejs+koa可视化项目——模型文件上传(第四步)
15 7
|
2天前
|
JSON 数据可视化 数据库
vue3+threejs+koa可视化项目——实现登录注册(第三步)
vue3+threejs+koa可视化项目——实现登录注册(第三步)
18 5
|
2天前
|
JavaScript 数据可视化 算法
vue3+threejs可视化项目——搭建vue3+ts+antd路由布局(第一步)
vue3+threejs可视化项目——搭建vue3+ts+antd路由布局(第一步)
17 6
|
2天前
|
JavaScript 安全 前端开发
Vue 项目中的权限管理:让页面也学会说“你无权访问!
Vue 项目中的权限管理:让页面也学会说“你无权访问!
10 3
|
2天前
|
Java Docker 容器
SpringBoot项目集成XXL-job
SpringBoot项目集成XXL-job
|
4天前
|
JavaScript
Vue 如何新建一个项目(如何安装依赖)
Vue 如何新建一个项目(如何安装依赖)
10 0
|
6天前
|
安全 应用服务中间件 网络安全
SSL原理、生成SSL密钥对、Nginx配置SSL
现在,你的Nginx虚拟主机应该已经配置了SSL,可以通过HTTPS安全访问。确保在生产环境中使用有效的SSL证书来保护通信的安全性。
19 0