用腾讯云部署springboot+vue+mysql项目(你奶奶看了都能学会)

本项目需要用到XFTP,Xshell,宝塔,腾讯云

1.首先需要一个云服务器,我用的是腾讯云,如果不想购买可以免费试用

2.成功注册了后先重置一下密码,然后重装一下系统,装成CentOs

3.XFTP和Xshell大家可以自行去网上下载

宝塔面板 - 简单好用的Linux/Windows服务器运维管理面板 (bt.cn)通过这个页面到

在往下找到这里

4.服务器ip就是刚才在腾讯云注册后会有一个公网ip

5.密码就是你设置的密码

点击立即安装到服务器

6.安装完成后会给你面板地址和用户名密码 保存好,这个面板地址直接去访问

7.等待一段时间,进入到宝塔官网

!!!注意在登录宝塔的时候宝塔默认端口号是8888你要在的腾讯云服务器上打开这个端口,不然会有问题

8.这个修复可修复可不修复,仅仅是为了测试的话可以不用修复

后续就通过8888这个端口号访问宝塔

9.回到首页还有一个问题是将http协议改成https协议 我们直接点确定 点击继续前往就是宝塔信息了

10.进入宝塔后 首先在左边导航栏软件商店下载mysql,nginx这是必备的,安装mysql的时候选择8.0+的版本 

11.完成后回到首页进行下一步,并且勾中你刚才下载的mysql和nginx

12.接下来我们开始配置mysql,回到软件商店

13.配置完成mysql密码后,重启服务

14.接下来配置nginx

打开nginx的设置

选择配置修改,自行配置一个server

server主要配置如下

15.注意这里的listen的81端口,后续我们通过81端口访问

root后面的路径也要牢记 这个dist是你vue打包下来的文件

后续你需要把vue打包下来的dist放在这个目录下

nginx配置完毕,然后重启nginx服务

16.接下来安装jdk,我们来手动安装

首先打开你的XFTP

17.然后在你的/usr/local创建一个java将jdk的包上传到java目录下 注意jdk选择的版本不要太新,我用的是9.0版本,还有注意后缀是tar.gz(不会打包的看第30条

18.然后打开我们的Xshell,同样先进行账号和密码登录,这里就不演示了

可以看到我这里已经是成功登录了

19.通过 cd /usr/local/java 进入到我们存放jdk的目录

然后 通过 tar -zxvf (你的jdk版本)进行解压(这里有个小技巧,如果压缩包名字过长 可以用tab键一键生成),可以看到我这里已经提前解压了

20.然后我们开始配置jdk的环境变量

通过命令vim /etc/profile 进入

21.通过上下键控制选到倒数第三行,可以看到我这里已经配置好了环境变量

通过i进入编辑模式编辑

22.注意下面代码中我圈中的写出你自己解压后的文件

JAVA_HOME=/usr/local/java/jdk-9.0.1
CLASSPATH=$JAVA_HOME/lib/
PATH=$PATH:$JAVA_HOME/bin
export PATH JAVA_HOME CLASSPATH

 

23.编辑完了后先按 esc退出 然后输入:wq保存退出

然后再输入source /etc/profile命令刷新环境变量

最后使用命令 javac或者 java- version来测试是否成功

如果出现我这样,那么jdk就已经配置完毕

24.然后用xftp在服务器home文件下创建一个包存放你idea上的jar包

我这里的java存放的是idea的jar包,admin里面存放的是vue的包dist

然后顺便将vue也一起打包 会生成一个dist文件(不会打包的看第30条

这个dist的目录必须跟前面nginx配置时候 root的目录一样 所以这个admin这个文件夹一定要放在这里 也一定要存放dist

 

25.然后在用Xshell工具 进入到你放idea的jar包的位置,我这里是/home/java,通过cd命令进入

可以看到我有一个java的包,log.out是我前面运行生成的日志 暂时不用管

接下来我们使用命令nohup java -jar [jar包名字]  >log.out 来启动jar包 完了后会生成一个log.out文件,我们可以通过XFTP打开它看一看日志

26.可以看到我已经成功启动springboot项目

然后我们将本地的数据库的数据存放到云服务器上我们下载的mysql上

首先可以通过navicat连接到云服务器

在宝塔上我们新建一个数据库,步骤很简单我这里就不写了,创建完成后记住你的用户名和密码进入下一步

然后在你本地的数据库右键你的数据库,选择转储sql文件 选择结构和数据 然后打开你云服务器的musql 选择对应的数据库,右键运行sql文件选择本地转储的文件即可

27.!!!接下来还有最后一个步骤,非常重要,开放端口,宝塔和云服务器都需要开启端口,比如你的后端端口 我这里是9090 所以我开启9090端口 还有访问数据库的3306端口 都必须要打开

我在这里的意见是 多开放端口,以免出错,先跑通项目再说

28.云服务器开放端口

29.宝塔开放端口

30.到这里已经结束,后面说一些基础的比如idea如何打包和vue打包 有了解的可以跳过这块

idea打包,稍等片刻会出来一个target文件 我们可以看到一个jar包 这就表示已经成功了

31.vue的打包方式就是在你的vue终端输入 命令 npm run build 这个稍微慢一点 会生成一个dist这个就是你所需要的文件

我顺便在总结一下我遇到的错误

首先前端vue访问后端的时候我这里是通过axios 路径不要用localhost 改成 你的公网地址

后端记得要改数据库名字和账号密码(如果有修改的话),后端尽量也用公网 保持一致然后进行打包

端口号一定要开放!!!

端口号一定要开发!!!

端口号一定要开发!!!

之后通过公网ip+端口就可以进行访问了

端口号就是你nginx设置的 listen 81 81就是端口号

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值