SpringBoot、Vue项目部署到Ubuntu服务器

原创 已于 2023-06-09 17:10:23 修改 · 1.2k 阅读 · 8 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#spring boot #vue.js #ubuntu

于 2023-06-09 00:15:13 首次发布
本文详细介绍了如何在Ubuntu20.04服务器上部署SpringBoot应用和Vue前端项目，通过nginx进行反向代理，使得前端请求能通过/api/路径转发到后端。首先安装JDK1.8，然后打包SpringBoot项目并运行。接着部署Vue项目，安装nginx并配置反向代理规则，最后重启nginx服务完成部署。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

SpringBoot、Vue项目部署到Ubuntu服务器

点击查看部署到Docke版本

前置情景

本文章基于Ubuntu 20.04平台部署。Vue项目通过nginx反向代理转发到SpringBoot端口。本文中，前端请求到后端的url地址会加上前缀 /api，举例：

前端向后端请求：

axios.post('/api/operationsummary/sysuser/getIdListByName')

在这里插入图片描述

后端实际的请求格式：

/operationsummary/sysuser/getIdListByName

在这里插入图片描述

后续会利用前端增加的 /api/ 在nginx做代理，使得前端可以跟后端通信。

部署

在Ubuntu中安装JDK1.8

输入命令：

sudo apt-get install openjdk-8-jre

等待安装完成，完成后输入java -version可验证是否安装成功。</

最低0.47元/天 解锁文章

200万优质内容无限畅学
男居
关注
vue项目部署到ubuntu服务器(超级简单)
m0_62262778的博客
04-05 2974
Linux（ubuntu）服务器下如何通过nginx部署vue项目
Vue项目部署到服务器（ubuntu）
天天向上
03-12 4058
Vue 1.在服务器安装nodejs和npm，打开服务器的terminal。 sudo apt-get install nodejs sudo apt install nodejs-legacy sudo apt install npm 2.设置镜像源 sudo npm config set registry https://registry.npm.taobao.org sudo npm config list 打开vscode，右击项目，Open in Integrated Terminal，输入
Ubuntu服务器上部署Vue项目
Lyy1991Wdl的专栏
06-13 3384
Ubuntu 虚拟机上使用nginx 代理部署Vue项目
ubuntu部署vue项目（不使用docker）
weixin_45326523的博客
07-07 1534
不使用docker部署vue项目
在Ubuntu中部署Springboot项目
qq_25447799的博客
01-13 3019
前后端分离(Vue+SpringBoot)项目部署云服务器
m0_70405779的博客
07-28 2570
云服务器可以提供高可用性、可扩展性和灵活性，适合部署Vue+SpringBoot项目。本文将介绍如何使用云服务器部署Vue+SpringBoot项目
ubuntu上部署vue项目到ngixn中+SpringBoot项目+postgresql数据库
weixin_44231698的博客
07-26 1085
部署vue和springboot及postgres
ubuntu服务器部署vue springboot前后端分离项目
xiaobai_cpp的博客
07-12 404
vue springboot前后端分离项目部署到云服务器
Windows下springboot项目部署到Ubuntu20.04中
BBQpotato的博客
07-07 297
Windows下MySQL57的java-connect-mysql版本是5.1.43在aliyun镜像public可以下载。因为数据库版本不同Windows下数据库版本为MySQL57,Ubuntu20.04中根据。WIndows下的pom.xml和application.properties文件（仅显示两者不同的部分）方法下载的是MySQL8.0.23，因此需要修改配置和依赖。在数据库连接部分，修改数据库连接信息。Ubuntu下的连接工具在central下载。
ubuntu配置springboot+vue项目运行环境
彼岸笙箫的博客
07-01 2425
ubuntu 22.04 配置springboot+vue+nginx(出码生成)项目运行环境
springboot项目发布到ubuntu服务器上
08-25
springboot项目发布到ubuntu服务器上
Vue项目部署到服务器(ubuntu)
赤蓝紫の博客
01-02 3737
Vue项目部署到服务器(ubuntu) 工具：WinSCP、PuTTy(可能不是专业的工具，是本人上操作系统的课用到的软件，直接用来部署了) 打包项目，npm run build 执行npm run build命令后，会生成一个dist文件夹。 这一步如果得不到预期的结果，可以把vue.config.js文件中的publicPath节点变为’./’，如果不存在，则新建文件 把项目文件放到服务器上 用WinSCP登录服务器后，理论上直接把本地的文件直接拖过去，就能复制过去了。但是ubuntu没有ro
【前端部署】Ubuntu22.04 使用nginx部署vue前端项目教程
weixin_53459689的博客
02-19 5928
【2024最新前端部署】Ubuntu22.04 使用nginx部署vue前端项目教程。一.ubuntu安装nginx。二.vue项目代码打包。三.ubuntu修改nginx配置文件。四.部署前端代码
Ubuntu部署SpringBoot项目
一位不想写代码偏偏还在挣扎的万年小白
04-03 1183
ubuntu部署springboot项目，基础环境部署、maven打包、文件上传、运行jar包。
手把手教你：Vue 项目在 Ubuntu 服务器上的 Nginx 部署全流程
@LPX
03-05 708
确保Nginx配置中包含 try_files $uri $uri/ /index.html;浏览器访问 http://your_server_ip 或配置的域名。如果需要HTTPS，可以使用Let's Encrypt申请免费证书。建议将静态文件放在/var/www目录下保持规范。
在ubuntu上使用docker部署springboot项目
weixin_45326523的博客
07-05 899
docker部署springboot项目
将springboot项目打包部署到Ubuntu虚拟机并运行，以及遇到的问题解决
weixin_65935591的博客
05-17 910
com.mysql.cj.jdbc.exceptions.CommunicationsException: Communications link failure java.sql.SQLException:null, message from server: "Host '192.168.0.131' is not allowed to connect. Caused by: org.attoparser.ParseException: Error resolving template [/commo
在服务器上部署一个Vue项目
Slatter的博客
01-19 344
这个地方使用的操作系统是Ubuntu，如果你是Windows可能对你帮助不大，不过建议做开发还是在Linux下进行，当然Mac OS也是完全OK的，操作上差异不大。如果上手Linux比较困难，可以参考从零入手Ubuntu系统，这会让你使用起来很大程度上降低才用Linux的不适感。对于Ubuntu的安装，不管是B站还是各大博客都有很多教程了，这里不再赘述。 这里已经将其做成了视频，从docker的安装使用、服务器购买及使用、vue项目的创建及测试到最终成功在服务器上部署一个Vue项目供其他人访问，链接如下（视
ubuntu部署springboot项目（不使用docker）
weixin_45326523的博客
07-07 873
不使用docker部署springboot项目
springboot vue部署服务器
最新发布
03-11
好的，我现在需要帮助用户了解如何将Spring Boot和Vue项目部署到生产服务器。首先，我得回顾一下用户提供的引用内容，看看里面有没有有用的信息。 用户提到了三个引用，分别是关于华为云服务器部署流程、分片上传到...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值