(一)服务器购买与配置

1. 购买服务器

进入腾讯云官网点击最新活动,进入云+校园专区,我购买的是第一个

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

购买完成后,进入控制台,云产品选择轻量应用服务器,即可查看到自己的服务器,记住自己的公网IP

在这里插入图片描述

2. 重置密码

点击进入服务器详情,初次使用需重置密码

在这里插入图片描述

点击重置密码按提示操作即可,记住这个密码

3. 添加端口

点击防火墙,添加常用端口,我添加了mysql端口3306及我后端常用的8080和9090端口

在这里插入图片描述

(二)Xshell安装与使用

1. 安装Xshell

进入Xshell家庭学校版官网,填写邮箱,该邮箱将收到相应的安装包链接

在这里插入图片描述

点击邮箱收到的链接即可开始下载,下载后按提示安装即可

2. 使用Xshell连接服务器

打开Xshell,新建一个连接,填入以下信息

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

建议勾选记住用户名和密码,点击确定,登陆成功

在这里插入图片描述

(三)go和mySQL环境安装与后端部署

1. 安装Go环境

将go安装包下载并解压到/usr/local

cd /usr/local
wget https://dl.google.com/go/go1.17.6.linux-amd64.tar.gz
tar -xzvf go1.17.6.linux-amd64.tar.gz

在$HOME创建go工作目录

cd ~
mkdir workspace_go

配置环境变量并设置代理

vim /etc/profile

在/etc/profile文件中加入这几行

export GOROOT=/usr/local/go
export PATH=$PATH:$GOROOT/bin
export GOPATH=$HOME/go
export GO111MODULE=auto
export GOPROXY=https://goproxy.cn,direct

在这里插入图片描述

执行/etc/profile文件

source /etc/profile

测试go环境,进入workspace_go,创建helloworld.go

cd workspace_go
vi helloworld.go

写入测试程序

package main

import "fmt"

func main() {
    fmt.Println("Hello, World!")
}

运行测试程序

go run helloworld.go

出现以下结果说明go环境配置完成

在这里插入图片描述

2. 安装mySQL环境

下载了安装用的Yum Repository

wget -i -c http://dev.mysql.com/get/mysql57-community-release-el7-10.noarch.rpm

安装mySQL

yum -y install mysql57-community-release-el7-10.noarch.rpm
yum -y install mysql-community-server

【注意:】

如果报错Failing package is: mysql-community-client-5.7.38-1.el7.x86_64 GPG Keys are configured as: file://,则执行以下语句再执行报错前的语句

rpm --import https://repo.mysql.com/RPM-GPG-KEY-mysql-2022

mySQL安装完成

在这里插入图片描述

启动mySQL

systemctl start  mysqld.service

查看mySQL运行状态

systemctl status mysqld.service

mySQL正常运行

在这里插入图片描述

找出root用户的原始密码

grep "password" /var/log/mysqld.log

用这个原始密码进入数据库

mysql -uroot -p

修改原始密码(‘newpassword’为新密码,必须要大小写字母数字和特殊符号(,/’;:等)

ALTER USER 'root'@'localhost' IDENTIFIED BY 'new password';

开启mySQL远程访问

grant all privileges on *.* to 'root'@'%' identified by 'password' with grant option;
flush privileges; 

查看mySQL状态,可看到字符集不是utf-8

status;

在这里插入图片描述

先退出mySQL,再修改mySQL配置文件

exit
vi /etc/my.cnf

再/etc/my.cnf中加入这几行

[client]
default-character-set=utf
character-set-server=utf8
collation-server=utf_general_ci

在这里插入图片描述

保存后重启mySQL,输入status再次查看,可看到变化

service mysqld restart
mysql -u root -p
status

在这里插入图片描述

在本机上远程访问服务器上的mySQL,成功

在这里插入图片描述

3. 打包并部署后端

安装unzip

yum install -y unzip zip

在本机上将后端项目压缩成以.zip结尾的压缩文件(注意,如果使用gorm连接mySQL,需要先在mySQL中建库,然后修改后端中的数据库名及密码)

在这里插入图片描述

进入workspace_go,输入rz将该压缩文件上传至云端

cd worksapce_go
rz

解压并运行

unzip 文件名.zip
go run 主文件名.go

这样后端就成功部署好了

但每次关闭Xshell连接后后端都会停止运行,我们需要用screen命令保存会话内容

安装screen

yum install screen

创建screen会话(此时要先停止后端运行)

screen -S 会话名

在新的会话中运行后端,按ctrl+a d返回

恢复会话内容

screen -r 会话名

在这里插入图片描述

即可返回之前的对话

在这里插入图片描述

这样即时关闭Xshell,后端仍在继续运行

【注意:】

如果忘记了会话名字,可输入该语句查询

screen -ls

若要删除会话,可输入该语句删除

screen -S 会话名 -X qiut

若同一个会话名有多个会话,输入该语句删除对应会话(编号可查询得)

screen -S 编号.会话名 -X quit

(四)nginx安装与前端部署

1. 安装nginx

下载nginx安装包

cd /usr/local
wget -c https://nginx.org/download/nginx-1.10.1.tar.gz

解压nginx压缩包并打开

tar -zxvf nginx-1.10.1.tar.gz
cd nginx-1.10.1

配置

./configure

编译安装并查看安装路径

make
make install
whereis nginx

配置完成后需进行修改

vi /usr/local/nginx/conf/nginx.conf

在这里插入图片描述

启动、停止nginx

cd /usr/local/nginx/sbin/
./nginx
./nginx -s stop

重启nginx

./nginx -s quit
./nginx

【注意:】

如果出现错误:nginx: [error] open() "/usr/local/nginx/logs/nginx.pid" failed,则输入该语句再运行报错前的语句

/usr/local/nginx/sbin/nginx -c /usr/local/nginx/conf/nginx.conf

设置开机自启动nginx,修改配置文件

vi /etc/rc.local

在最后一行输入

/usr/local/nginx/sbin/nginx

在这里插入图片描述

保存并设置执行权限

chmod a+x /etc/rc.local 

2. 打包并部署前端

修改前端项目中的src/main.js,修改公网IP

在这里插入图片描述

修改vite.config.js,修改相对路径和包限制大小

在这里插入图片描述

在终端输入下面语句进行打包

npm run build

打包完成后我们在项目中可看见一个dist文件夹,将dist文件夹的内容压缩成dist.zip

在这里插入图片描述

在Xshell中进入/usr/local/nginx/html

cd /usr/local/nginx/html

新建一个文件夹,该文件夹名作为最终访问的网址的路径,一般为项目名以便于区分

mkdir 项目名

进入该文件夹,将dist压缩包上传至云端并解压

cd 项目名
rz
unzip dist.zip

解压完成后可看到以下内容,前端也部署完成了

在这里插入图片描述

在浏览器输入公网IP/项目名即可出现第一个前端页面

在这里插入图片描述

关闭Xshell,也能成功交互

在这里插入图片描述

(五)总结

部署教程到这里就结束咯,这也是我第一次尝试部署前后端,中途也遇到了许多坑,把过程记下来和大家分享,希望能给小伙伴们提供参考~

Logo

技术共进,成长同行——讯飞AI开发者社区

更多推荐