spring boot + vue + element-ui全栈开发入门——项目部署
2024-08-25 10:29:57
前言
常用的部署方式有两种:
1.是把生成好的静态页面放到spring boot的static目录下,与打包后的spring boot项目一起发布,当spring boot运行起来后,自然而然就能访问到静态页面文件了。
这种方法比较简单,适用于非常小型的系统。优点是:不需要复杂的配置。而缺点也很明显:需要两者一同发布。我在这里就不做赘述了。
2.是通过http服务器发布,本文以nginx为例,重点介绍这种方式。
一、生成静态页面
运行npm run build
生成的页面文件在dist目录下:
二、配置nginx
windows系统下载nginx:http://nginx.org/en/download.html
下载完解压后,找到conf/nginx.conf文件,并修改:
worker_processes 1; events {
worker_connections 1024;
} http {
include mime.types;
server {
listen 80;
server_name localhost; # 静态文件夹路径
root 你的路径;
index index.html index.htm; # 后端配置
location /api/ {
proxy_redirect off;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
# 后端url
proxy_pass http://localhost:18080/;
}
}
}
其中,root项目是配置静态网页文件所在的路径,配置成你自己的目录。
location是配置spring boot项目跨域,这里我配置了当匹配到有“/api/”开头的请求,就会转到spring boot的项目中处理。
运行效果如下图所示:
访问nginx的地址,就能访问到之前生成的静态页面和spring boot的后端。
而这就是前后端分离开发的魅力所在。
git代码地址:https://github.com/carter659/spring-boot-vue-element.git
如果你觉得我的博客对你有帮助,可以给我点儿打赏,左侧微信,右侧支付宝。
有可能就是你的一点打赏会让我的博客写的更好:)
最新文章
- [ACM_图论] 棋盘问题 (棋盘上放棋子的方案数)
- github生成燃尽图
- python杂记-3(购买商品)
- RAC配置、安装
- 关于Zend Framework 2中 Zend\Session的使用
- Linux安装WebLogic12
- 共享库方案解决WAS中JAR包冲突
- Python中import机制
- ThreadLocal深入剖析
- uboot中的中断macro宏
- SpringBoot报错:The server time zone value 'Öйú±ê׼ʱ¼ä' is unrecognized or represents more than one time zone
- React 面向组件化编程 - 封装了webpack - npm run build 产生的包的 /static 引用路径问题
- 利用Syslog Watcher在windows下部署syslog日志服务器
- Nginx加载ngx_pagespeed模块,加快网站打开的速度
- Java正则表达式的总结
- linux安装phpstorm
- AutoCAD.net-错误消息大全
- asp.net mvc中配置路由默认值(Area中)
- 【java错误】错误: 编码GBK的不可映射字符
- win10 关闭自动维护计划任务
热门文章
- Petrozavodsk Winter-2018. Jagiellonian U Contest
- BSUIR Open Finals
- flask之入门
- (61)Wangdao.com第十天_JavaScript 立即执行函数
- Node.js_Buffer 缓冲区
- vue_VueRouter 路由_路由器管理n个路由_并向路由组件传递数据_新标签路由_编程式路由导航
- three.js 加入纹理(texture)的方法及注意事项
- idea创建的java web项目打包发布到tomcat
- Python基础之列表深浅复制和列表推导式
- 团队项目-课程MS需求分析心得