前后端分离开发在阿里云ECS上布置spring boot后端程序和vue前端

杀死庸碌的我 2024-10-09 12:33:01 阅读 92

最近和小伙伴合作开发了一个物资管理系统,开发完以后,觉得这么好玩的项目运行在自己电脑上没啥意思,这不得部署上去让其他小伙伴玩玩?所以查阅了一些资料以后我开始部署项目,麻烦的不会,我就选择最简单的阿里云的服务器开始部署了.

事先说明奥,阿里云的试用很香,我没有接广子.

好的,废话不多说现在开始部署项目!!!!

第一部登录你的阿里云然后下一步选择产品我们当然是选择云服务器ECS

点击云服务器ECS你会到一个购买界面

第一次有个新用户试用如果只是想要部署一下自己的网站或者其他需求试用随便选一个就好了,但是如果是实际投入生产使用的项目需要部署的话,我的建议是好好选择一下服务器配置,有通用计算型什么的类型,业务需求不一样服务器购入的选择也要做出变化,而不是跟着笔者的选择,就草率的选择服务器的类型,我不是来教人选服务器的,所以我们进入下一阶段.

我们的下一步当然是点击立即购买,

之后就会进入这样的界面

我这里选择的是快速购买,因为我布置的网站使用用户最多团队40号人使用的物资管理系统,所以不用选很好的服务器,能跑就行,如果有更高的需求和特定场景的使用,一定一定去自定义购买,选择实际业务需要的服务器类型.

因为作者这里之前已经买过了,就不点下单了,买完之后我们就要开始布置了.

我们回到之前购买的界面那个位置

点击管理控制台,之后你会进入到这个界面

我们点击左边目录的实例,之后会进入这个界面

到这里之后呢,我们点击这个实例名称,没错!你需要点击这个实例名称!!!感觉自己好婆妈....

进入到这个界面以后你需要干的第一件事情是重置密码,因为买的时候没有设置密码,也不会用默认密码,这个密码是用来远程连接的密码所以设置完以后得记下来

这里输入密码记得开个记事本记录一下

上面是我的用户名,下面是我设置的密码,防止笨蛋不记录,记得设置自己的密码哦!!!,我真是保姆级别的教程了

设置好后点远程连接

然后点立即登录之后输入你重置后的密码,然后你就能看到下面这个界面

之后安装宝塔面板

选择你操作系统对应的哦,我选的操作系统是ubuntu的所以是下面这个

wget -O install.sh https://download.bt.cn/install/install_lts.sh && sudo bash install.sh ed8484bec

复制一下粘贴到那个黑的控制台界面里按下enter键就开始下载了

这里需要键入y然后继续enter安装完成以后会出现这个界面

把这里的外网面板地址内网面板地址包括username和password用记事本记录下来后面要用的,现在让我们回到控制台的界面点击安全组,我们需要放心8888端口,不然进不去宝塔面板

点击管理规则进入下面这个界面,点击手动添加

像下面这样填写然后点击保存

下一步,我们打开安装宝塔面板后给的外网面板地址,正常情况的话会是下面这种情况

另外一种情况就是你被浏览器拦截了,这种时候,你直接点击高级,然后点击继续访问即可进入现在这个界面

输入你保存的账号和密码,如果之前你没有保存,而且不小心关掉了那个黑色的控制台界面,只需要回到下面这个界面

然后输入下面的指令

bt default

就会显示你宝塔面板信息了,然后我们登录宝塔面板,进入下面这个界面,宝塔面板左上角的数字是你服务器的外网地址,我这里就不截图展示给你们看了

进来以后需要配置一下环境不然没有运行的环境,我们要布置的是vue和spring boot项目没有nginx和java环境是使用不了的,所以我们点击左边导航栏的软件商店,进入软件商店,然后搜索java

安装最下面的JDK管理器1.1然后把首页显示的的单选选上

之后是搜索nginx,像下面这个样子

安装完毕后我们点击左边导航栏回到首页,然后点击左下角的jdk管理器

下载你们后端spring boot运行的java版本,这里作者是用JDK17开发的,之后我们需要把这个JDK路劲给复制下来,我们需要配置环境变量

/www/server/java/jdk-17.0.8/bin/java

然后我们去到左边导航栏下的文件,找到root这个文件,接着进入root找到这个名字叫做.bashrc的文件,我们双击这个文件

滑到底部

到达这个文件底部以后我们需要添加java的环境变量

# Set Java environment variables

export JAVA_HOME=/www/server/java/jdk-17.0.8#这个等号后面是填写我之前让你保存的java安装路径

export PATH=$JAVA_HOME/bin:$PATH

export CLASSPATH=.:$JAVA_HOME/lib/dt.jar:$JAVA_HOME/lib/tools.jar

export JRE_HOME=$JAVA_HOME/jre

之后就变成这个样子了,记得保存一下,之后我们需要对后端和前端的项目进行打包,java后端打包成jar包,前端打包后的文件,在项目文件的dist文件里,别告诉我你不会打包项目,然后来看怎么部署项目,不然我真的想要敲你脑袋了.

这里我的后端项目部署的监听端口是9000,我的前端项目监听的端口是8082,我们先需要在防火墙里放行我们项目需要的端口,点击安全然后添加端口规则,我就不一步一步教了,这里我已经放行了8082和9000这里两个端口,但是这还是不够的,我们需要在外面的控制台也放行这两个端口

像下面这个样子

然后我们回到宝塔面板,点击左边导航的网站,准备部署前端项目了,我们进入这个界面,点击php项目

然后我们点添加站点然后你会进入这个界面

这里你布置一个网站需要有一个域名,这里你得去买一下域名,其实乱填也是完全可以的呢,只是如果没有正确认证的话,这个域名是用不了的,这里按照我php版本填的纯静态就行,然后点击确定

接着点击画圈这个部分进入项目的根目录

接着进入这个界面,里面的文件是作者上传的项目文件

在这个界面点击左上角的上传文件文件夹,把你打包好的jar包和dist文件里的内容上传,这里的dist文件内的内容必须像作者这样,不能散开,我教授一个小技巧,你可以对打包好的vue项目中的文件挨个压缩,在把压缩好的文件上传进来后,在双击解压,这里我得说一下,你的后端接口对应的数据库,需要填你实际业务对应的数据库,也可以在服务器内搭建一个数据库,在你的mybatis的数据库里要填正确的数据库信息像这样,填写实际的哦,如果你打算将数据库建在这个服务器中,接下来我会继续说的

之后就是前端的接口信息

这里的url需要替换成你的后端请求的url布置以后一般会是你服务器的外网ip也就是你宝塔面板左上角的数字

冒号后面的是,服务器程序监听的端口哦,接下来我们先复制一下后端程序的名称点击后面的更多然后重命名复制一下名称

然后我们点击终端

输入这个后面是你要运行的java程序直接右键粘贴就可以出来了,按下enter就可以运行了

nohup java -jar material-management-0.0.1-SNAPSHOT.jar

用nohup运行的项目关掉终端后也是在一直运行的哦,日志点击,nohup.out就可以看了,这里我们在点击网站,点java项目,点击添加项目,然后点击从已启动的项目中接管,在改个项目名称

就可以方便管理了,会变成下面这个样子

php项目是这样的

这里网站就部署完了,我们接下来说一下数据库这里,点击导航栏来到数据库这里,直接点添加数据库

填写以下数据库名称和密码啥的,之后点击导入

这里需要你的数据库的sql文件,比如说从你本地的mysql中转储一个.sql文件,这里作者用的是navicat

这样子就可以导出一个.sql文件,然后点击导入上传这个.sql文件之后导入就行了,这样子服务器上的数据库就和你本地的数据库的数据和结构都是一致的了,这里我得说一个问题,一个很重要的问题,如果mybatis连接服务器上这个数据库的话,用户名一定不是root,这样子是连接不上的,要使用

这里的数据库名用户名和密码,不然的话你是连不上的.你要使用可视化数据管理工具,连接远程数据库,url是你的外网ip地址用户名和密码,是你创建后看到的这个,这些都是你设置的,别说不知道忘记了哦,之后需要去安全组设置放行规则,放行3306端口,同时需要在防火墙放行3306,这样子就可以用远程可视化数据库工具访问,部署的数据库了,这样子你的项目就部署完毕了,如果部署成功了,记得给个小小的点赞,写了3小时博客,手有点小酸,如果部署不上,可以评论区请求帮助哦!

访问你自己的网站的话,如果你买的域名的实名还没审核通过的话,访问你网站是服务器外网ip前端vue监听的端口比如作者的访问就是114.55.xxx.xxx:8082,后面域名审核过了,直接访问域名就是你的网站了哦



声明

本文内容仅代表作者观点,或转载于其他网站,本站不以此文作为商业用途
如有涉及侵权,请联系本站进行删除
转载本站原创文章,请注明来源及作者。