腾讯云服务器部署springboot项目+Vue项目(附带环境配置)

腾讯云服务器部署springboot项目+Vue项目(附带环境配置)

大纲

一、购买云服务器并获取云服务器账号密码

二、安装X-shell、Xftp,并使用ssh远程访问云服务器

三、配置服务器jdk环境

四、打包springboot项目并部署

五、打包vue项目并传输至服务器

六、安装nginx,并且配置80端口默认打开路径为vue默认

七、成功部署

一、购买云服务器并获取云服务器账号密码

在腾讯云官网选取云服务器配置并付款后,系统会自动创建轻量级应用服务器,本文中以CentOS 7.6 64bit操作系统为例。待创建完成后,系统会提示创建成功并告知默认用户名(CentOS默认为root,Ubuntu默认为ubuntu)。如图
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第1张图片

在服务器控制台重置云服务器密码并重启:
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第2张图片

二、安装X-shell、Xftp 7,并使用ssh远程访问云服务器

Xshell是远程连接云服务器的工具,Xftp 7是用来传输文件至云服务器上的工具。Xshell在官网下载即可,由于Xftp7新用户可免费30天使用,作者这里提供下载途径:

链接:https://pan.baidu.com/s/1MSL3mc1zsjbBBWk-PJkEzQ
提取码:492a
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第3张图片
使用X-shell建立新链接,主机处填写公网IP(在腾讯云服务器控制台获取)
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第4张图片
用户名为先前获取的用户名
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第5张图片
密码为重置后的密码(建议先重置密码,否则可能不显示该页面)
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第6张图片
点击确认,双击左侧连接即可进入
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第7张图片

三、配置服务器jdk环境

首先下载linux环境下的jdk,笔者可选择自行下载或者在上面的网盘链接下载,下载完成后。

1、在xshell中点击该按钮,打开xftp7
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第8张图片
2、直接将jdk压缩包文件拖至右侧服务器中,路径随意,需要注意的是路径和接下来输入的指令相关
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第9张图片
3、在xshell中使用cd命令进入jdk压缩文件路径,并用ll命令查看:

cd /home/package           ----这里写的是[文件路径] 
ll                         ----查看当前目录所有文件信息

4、解压:

tar -zxvf jdk-8u291-linux-x64.tar.gz

5、改名并移动:

mv jdk1.8.0_291 /usr/local/jdk1.8

6、修改配置文件:

vim /etc/profile

7、添加配置:
进入后按i键进入编辑模式,使用上下左右跳转至最下面,添加以下配置。完成后点击esc,输入‘:wq’保存并退出。

export JAVA_HOME=/usr/local/jdk1.8 export 
CLASSPATH=$:CLASSPATH:$JAVA_HOME/lib/ export 
PATH=$PATH:$JAVA_HOME/bin

8、刷新配置:

source /etc/profile

9、输入java -version查看是否配置成功
在这里插入图片描述

四、打包springboot项目并部署

1、在idea的终端中使用cd命令跳转掉springboot项目根目录
2、使用mvn clean package -DskipTests打包项目

E:\毕设2022\springboot>mvn clean package -DskipTests

如图则打包成功
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第10张图片压缩包就在sprngboot项目根目录下的target文件中
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第11张图片
3、使用xftp将项目包传输至云服务器中
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第12张图片
4、使用cd命令至jar包目录下,使用chmod命令修改权限

chmod 777 demo-0.0.1-SNAPSHOT.jar

如图则修改成功:
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第13张图片
5、启动项目

java -jar demo-0.0.1-SNAPSHOT.jar

如图则启动成功:
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第14张图片
6、设置默认自启动

nohup java -jar demo-0.0.1-SNAPSHOT.jar &
tail -500f nohup.out               //查看日志

7、查看是否启动

ps -ef | grep java

如图则已经启动
在这里插入图片描述
8、关闭java——以供替换springboot项目使用

kill -9 15499  //15499是上图中java项目的进程号

五、打包vue项目并传输至服务器

1、idea终端中使用cd进入vue项目根目录
2、打包前先删除项目下的dist文件
3、使用npm run build打包vue项目

E:\毕设2022\springboot\vue>npm run build

如图则打包成功
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第15张图片
4、传输dist文件夹至和springboot项目同级别路径下
腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第16张图片

六、安装nginx,并且配置80端口默认打开路径为vue项目入口路由

1、cd至/home/package目录下安装依赖和相关库:
目录

yum -y install gcc-c++ zlib-devel openssl-devel libtool

2、下载nginx安装包并解压:

cd /usr/local
wget http://nginx.org/download/nginx-1.14.0.tar.gz
tar -zxvf nginx-1.14.0.tar.gz

3、配置和安装

cd nginx-1.14.0
./configure --prefix=/usr/local/nginx
make && make install

4、启动nginx:

cd ../nginx/sbin
./nginx

5、查看nginx并修改location:

ps -ef | grep nginx

如图:
在这里插入图片描述

输入i进入编辑模式,找到location并将旧的注释掉(在前面加#)
添加新的location(需注意root后面的路径是你自己上传vue文件的时候所在的路径)这一步千万不能写错!!!

location / {
    root /home/server/dist;
    index index.html index.htm;
    try_files $uri $uri/ /index.html;
         }

6、停止和重启nginx:

./nginx -s reload   #重启
./nginx -s stop #关闭

七、部署成功

腾讯云服务器部署springboot项目+Vue项目(附带环境配置)_第17张图片

你可能感兴趣的:(服务器,腾讯云,spring,boot,ide,vue)