如何免费将springboot+vue项目部署上线(云服务器+宝塔面板)

news2024/9/22 17:25:31

本文整个流程是在博主完成一次项目上线全过程后复盘的记录,有没有写到的细节不清楚的可以私聊提问,这里选用的是阿里云服务器,阿里云对学生用户可以免费使用一个月服务器,不定期也有活动,我白嫖了7个月服务器(阿里高校计划)如果需要可以私信我甩个链接,如果自己买的话一般来说选择一个1核2g的服务器足矣

目录

前端部分

后端部分

踩坑和注意事项


选择宝塔傻瓜式上线项目

前端部分

1.centos7下载宝塔

yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh && sh install.sh

2.在阿里云放开宝塔默认端口 8888(如果查看到宝塔的端口不一样,放开你地址上的端口)

3.命令行查看宝塔默认登录地址和账户密码

bt default  

输入登录地址 然后输入用户密码登录即可

4.打包前端项目

如果用的是webstorm,点build即可

或者终端输入命令行 

npm run build 

5.将打包后的dist文件上传至宝塔

6.添加站点,根目录中选择刚刚的文件即可,域名设置为服务器ip即可

不需要ftp,不用设置

访问完后,输入域名访问一下试一下,默认的80端口

后端部分

首先确保宝塔是6版本以上,不然不能上传java文件

1.同样 package打包一下 将target目录下的jar文件上传即可

2.下载以下软件,项目中用到什么下载对应软件

3.将这些软件配置好,确保本地能远程连接的上去,很关键

4.注意这些软件无论用到什么端口都要放开,包括阿里云和宝塔

5.新建java项目,将jar包拖进去,jdk改成宝塔下载的,端口改成项目真实端口

其他的可以不配置

成功了过一会就可以看到端口信息

踩坑和注意事项

vue项目部署后刷新页面出现404错误

原因是由于vue项目使用history模式,只需要将之改成hash重新打包上传即可。

另一个解决方法是在服务端解决:

在宝塔面板网站菜单,找到部署的vue站点,打开设置,在配置文件设置中添加以下代码:

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

对应这个地方

第二个注意的地方是端口,一定要在阿里云和宝塔放开

然后就是注意你项目中用到的mysql、redis那些都能跑通,都能远程连接上去

JDK版本问题:如果自己本地使用的jdk版本是1.8,那么服务端也要对应选择jdk1.8

感谢你能看完,如果对你有帮助的话,点个赞支持下 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/708278.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

ZYNQ——脉宽调制之呼吸灯实现

文章目录 原理简介实验代码软件仿真板上验证 原理简介 呼吸灯的实现过程就是把不同占空比的脉冲输出后加在LED上,LED灯就会显示不同的亮度,通过不断地调节方波的占空比,LED灯的亮度也会跟着变化,看起来就像是“呼吸”一样。 要得…

陪诊小程序系统|陪诊软件开发|陪诊系统功能和特点

随着医疗服务的逐步改善和完善,越来越多的人群开始走向医院就诊,而其中不少人往往需要有人陪同前往,这就导致了许多矛盾与问题的发生,比如长时间等待、找不到合适的陪诊人员等。因此为人们提供一种方便快捷的陪诊服务成为了一种新…

如何挽救误剪切的TF卡数据 ?三招救援

在日常使用TF卡过程中,我们可能会遇到误操作导致数据被剪切并丢失的情况。这无疑给我们带来了困扰,因为我们可能丢失了重要的照片、视频、文档等文件。然而,不必过于担心,因为TF卡数据剪切后的恢复仍然有希望。本文将向您介绍几种…

基于DeepLabv3Plus开发构建人脸人像分割系统

在图像分割领域中有不少优秀出色的网络,DeepLab系列就是其中非常经典的分支之一,在之前的很多项目中陆续都已经有接触到了,在处理图像分割中表现出色。 DeepLabV3Plus是一种用于语义分割任务的深度学习模型,它是DeepLab系列模型的…

市场营销书籍推荐,这些书帮你学好营销

市场营销一直是商业运作中的重要环节,因此市场营销的知识一直备受关注。在这篇文章中,小编将向你推荐三本经典市场营销书籍,通过阅读这些书籍能让你更深入了解市场营销的基本概念和策略。 1、《经理人参阅:市场营销》 《经理人参…

高效游戏项目进度管理指南:打造顺畅开发之路!

完成一个游戏项目可能是一项具有挑战性的任务,特别是当你刚刚开始时。为了确保你的项目在预算内按时运行,制定计划并管理你的进度是很重要的。以下是一些帮助你管理游戏项目进度的技巧。 1、明确游戏目标: 在开始之前,你必须明确项目的范围以…

附件类文件存储在环信和不存储在环信时的两种实现方式

场景一: 附件类文件存储在环信服务器 使用环信EMChatManager#downloadAttachment下载附件方案 (本篇文章以图片消息为例,其他附件类消息类似): 一、 通过EMFileMessageBody#getLocalUrl判断有没有本地文件; EMImageM…

ROS学习篇之硬件准备(零)-thinkbook16+锐龙版 安装ubuntu20.04遇到的各种坑

文章目录 一.计算机配置二.遇到的问题及解决办法1.键盘失灵2.无法联wifi3.蓝牙搜索不到设备4.无法开热点 三.最后的感想 一.计算机配置 CPU: AMD R7 6800H (网卡,娱乐大师读出来的不对,在windos系统下,联想管家读出来网卡的型号是…

C++数据结构笔记(5)栈的顺序存储结构实现

1.对于栈和队列,相比于数组和线性表,使用规则受到了限制,因此也被称为“受限线性表”。 2.对于栈类型来说,元素符合先进后出的规律,且栈中的元素不能自由遍历。 3.栈的顺序存储结构简称为顺序栈,其思想是…

神经网络之VGG

目录 1.VGG的简单介绍 1.2结构图 3.参考代码 VGGNet-16 架构:完整指南 |卡格尔 (kaggle.com) 1.VGG的简单介绍 经典卷积神经网络的基本组成部分是下面的这个序列: 带填充以保持分辨率的卷积层; 非线性激活函数,如ReLU&a…

制作投票链接小程序教程,让你的活动更具吸引力与效果

相信投票链接是一种方便快捷的投票方式,不仅可以用于活动中的投票,还可以用于品牌营销和市场调研。投票链接是一种非常方便的方式来进行在线投票。这里就推荐一个免费制作投票活动的网站:乔拓云,创建简单、免费使用、操作灵活。支…

Linux环境搭建(三)— 搭建数据库服务器

linux (ubuntu)安装mysql 和环境配置 一、安装MySql二、配置环境三、外网访问四、重置密码五、卸载 写在前面: 本文默认你的Linux系统已经安装vim,yum等,如你使用的是一个全新的操作系统,移步上一篇开始配置…

回波数据adc_data.bin解析(附MATLAB程序)

毫米波雷达系统性能参数分析 1、xWR1642—DCA1000 TI目前有两款采集卡TSW1400和DCA1000,可以为xWR1243/1443和1642毫米波雷达进行回波数据采集。本文将主要介绍几款雷达分别用2款采集卡数据采集的回波数据格式以及MATLAB数据解析程序。 1、xWR1642—DCA1000 &…

【Servlet学习二】Servlet原理(Tomcat) ServletAPI

目录 🌟一、Servlet运行原理 🌈1、Servlet的执行原理(重点) 🌈2、Tomcat伪代码的简单理解 2.1 Tomcat初始化流程 2.2 Tomcat处理请求流程 2.3 Servlet 的 service 方法的实现 🌟二、Servlet API 详…

SFP3012-ASEMI代理MHCHXM(海矽美)快恢复二极管SFP3012

编辑:ll SFP3012-ASEMI代理MHCHXM(海矽美)二极管SFP3012 型号:SFP3012 品牌:MHCHXM(海矽美) 封装:TO-247AB 恢复时间:≤65ns 正向电流:30A 反向耐压&a…

初学spring5(三)依赖注入(DI)

学习回顾:初学spring (五) 快速上手spring Dependency Injection 一、概念 依赖注入(Dependency Injection,DI)。依赖 : 指Bean对象的创建依赖于容器 . Bean对象的依赖资源 .注入 : 指Bean对象所依赖的资源 , 由容器来设置和装配 . 二、构造器…

SQL-每日一题【180.连续出现的数字】

题目 表:Logs 编写一个 SQL 查询,查找所有至少连续出现三次的数字。 返回的结果表中的数据可以按 任意顺序 排列。 查询结果格式如下面的例子所示: 示例 1: 解题思路 1.要查询至少连续出现三次的数字,则可以转化为(…

软考A计划-系统集成项目管理工程师-项目整体管理-下

点击跳转专栏>Unity3D特效百例点击跳转专栏>案例项目实战源码点击跳转专栏>游戏脚本-辅助自动化点击跳转专栏>Android控件全解手册点击跳转专栏>Scratch编程案例点击跳转>软考全系列 👉关于作者 专注于Android/Unity和各种游戏开发技巧&#xff…

【C#】文件拖拽,获取文件路径

系列文章 【C#】编号生成器(定义单号规则、固定字符、流水号、业务单号) 本文链接:https://blog.csdn.net/youcheng_ge/article/details/129129787 【C#】日期范围生成器(开始日期、结束日期) 本文链接:h…

vue2实现一个上边为搜索,下面为复选框选中后,右侧显示已选中组件

目录 vue2实现一个上边为搜索&#xff0c;下面为复选框选中后&#xff0c;右侧显示已选中组件component / ProjectSelectItem.vue使用组件效果 vue2实现一个上边为搜索&#xff0c;下面为复选框选中后&#xff0c;右侧显示已选中组件 component / ProjectSelectItem.vue <…