乐趣区

关于mysql:在Linux上从零开始部署前后端分离的VueSpring-boot项目

jiezi

最近做了一个前后端拆散的商城我的项目来相熟开发的整个流程，最初心愿能有个正式的部署流程，于是试着把我的项目放在云服务器上，做了一下发现遇到了不少问题，借此记录一下整个部署的过程。

应用的技术栈如题目所说大体上是 Vue+Spring boot，但还是要提一下具体的版本，因为在解决问题的过程中发现因为开发环境的不同会产生诸多影响，查找问题时如果没有版本作为前提常常会呈现很多不必要的误会，甚至是误操作，十分浪费时间。具体版本状况如下：

  • Vue 2.6.11
  • Vue-cli 4.5.0
  • Spring boot 2.1.1
  • MySQL 8.0.13（尤其留神）
  • Nginx

1 上传工具

部署的第一步要把文件上传至云服务器，并且后续还要在云服务器上进行操作，办法很多，我这里抉择了 Xshell 和 Xftp 这两个工具，均出自 NETSARANG 这家公司，须要留神的是在国内的官网上暗藏了收费家庭版的申请地址，能够通过间接拜访 Xshell、Xftp 收费许可 进行下载，须要填写姓名和邮箱。

1.1 Xftp

首先在 Xftp 中新建连贯，填写主机地址和用户名明码，连贯胜利就能够看到左侧选项卡为本地的文件目录，右侧为云服务器的文件目录，只有从左侧或右侧将文件拖动到另一边就能够实现相应文件的上传和下载，下方传输选项卡会显示具体进度，图形化的界面相当直观，不做过多的阐明了。

对于 Linux 的目录标准我没有查到太多须要的信息，所以我这里是在根目录新建了一个名为 app 的文件夹来寄存网站利用，对于网站的打包咱们在下一节阐明，这里咱们把握如何上传文件就能够。

1.2 Xshell

Xshell 的连贯建设办法与 Xftp 差不多，填写主机地址，连贯后再输出用户名明码，连贯后就能够在云服务器上进行操作了。

通过这两个工具与云服务器建立联系后咱们就能够开始着眼于网站利用本身的问题了。

2 前端

相对来说前端的部署没有遇到太多问题，所以咱们先从前端开始

2.1 Vue

因为我应用了 Vue-cli，所以我的项目实现后通过执行命令 npm run build 程序就会主动打包到我的项目目录下的 dist 文件夹，打包后的目录构造如下：

之后通过 Xftp 将这个文件夹上传至云服务器上，之前我曾经新建了一个文件夹来寄存，因为咱们还可能有其余我的项目，并且后盾也须要一个文件夹，所以建设具体文件夹构造如下：

新建文件夹能够应用 Xftp 的图形界面疾速建设，也能够在 Xshell 中应用指令，看集体的爱好和习惯，如果须要常常应用 Linux 零碎，倡议应用指令多加练习。

在 Windows 端进行开发的时候，在控制台应用 npm run serve 指令就能够疾速启动一个本地网站，然而这样的网站只能在内网被拜访，必定是达不到咱们最后在外网拜访的目标，所以这里要借助反向代理服务器，我抉择的是被宽泛应用的 Nginx。

2.2 Nginx

  1. 选定装置目录 
cd /usr/local/src

  1. 在服务器上安装 Nginx 之前先装置若干依赖：
yum install gcc
yum install pcre-devel
yum install zlib zlib-devel
yum install openssl openssl-devel

这些依赖的作用能够参考这一篇 Linux 上装置 Nginx 依赖环境和库、Nginx 装置，Nginx 服务命令，我没有逐个试过短少某个依赖会有什么问题，在装置 Nginx 之前就曾经装置好这些依赖了。

  1. 下载 Nginx 安装包并解压

能够从官网抉择须要的版本。

wget http://nginx.org/download/nginx-1.13.7.tar.gz  #下载
tar -xvf nginx-1.13.7.tar.gz                        #解压
  1. 执行配置并装置 
cd nginx-1.13.7       #切换目录
./configure           #执行配置
make && make install  #编译装置（默认装置在 /usr/local/nginx）
  1. 装置实现后查看版本无误启动 
/usr/local/nginx/sbin/nginx -v  #查看版本

cd /usr/local/nginx/sbin        #cd 到 nginx 的装置地位的 sbin 目录下
./nginx                         #启动 nginx

这里能够先拜访一下服务器的外网 IP 试试，呈现 Welcome to nginx 就阐明曾经启动胜利了。

Nginx 装置实现后批改配置文件以对应咱们的网站利用，批改文件的办法也能够抉择应用 Xftp 或者在 Linux 上用指令操作 

location / {
    root   /app/osd_mall/vue_app/dist;
    index  index.html index.htm;
}

location /api {proxy_pass http://localhost:28019/api/v1;}

这里映射了两个地址，第一个就是网站前端局部的主体，应该没有太多的差别，次要的问题应该集中在第二个地址上，因为我做的是一个前后端拆散的我的项目，后端接口也是蕴含在我的项目里的，那么必然存在跨域问题，开发时应用了 Vue 的 Proxy 从前端解决，代码如下：

而后在 axios 里配置对应的名称即 api，这样就能够解决跨域的问题，但这只是本地开发时应用的办法，在 Linux 服务器上通过 Nginx 反向代理能够更平安地解决跨域问题，所以上图中的代码就不再须要了，打包前须要正文或者删除。

axios.defaults.baseURL = process.env.NODE_ENV == 'development' ? '/api' : '/api'

配置批改实现后测试配置文件，没有问题后重启 Nginx 服务 

./nginx -t            #测试配置文件
./nginx -s reload     #重启 Nginx

这时曾经能够通过咱们的外网 IP 拜访前端页面了，然而因为还没有配置后端接口，所以根本是没有数据和图片的。不言而喻，上图中的本地地址 http://localhost:28019/api/v1 就是咱们的后端接口地址，那么咱们接下来就对后端的部署进行阐明。

3 后端

绝对于前端来说，后端遇到的问题堪称是层出不穷，两头有很多挫折，好在最初都解决了，其中有几个就是结尾强调的版本问题。

3.1 Java

首先要装置 Java 环境，从官网下载须要的版本，而后和之前一样，通过 Xftp 上传：

创立目录，解压：

mkdir /usr/java
tar zvxf server-jre-8u271-linux-x64.tar.tar.gz -C /usr/java

为了能在全局应用 java 命令，配置环境变量：

# 批改环境配置文件
vi /etc/profile

# 编辑配置文件，在外面增加如下三行
export JAVA_HOME=/usr/java/jdk1.8.0_271
export PATH=$JAVA_HOME/bin:$PATH
export CLASSPATH=.:$JAVA_HOME/lib/dt.jar:$JAVA_HOME/lib/tools.jar

# 使环境变量失效
source /etc/profile

# 验证是否配置胜利，查看 java 版本
java -version

3.2 Spring boot

要将 Spring boot 我的项目打包部署有很多抉择，详情能够看这篇文章 java 我的项目部署 Linux 服务器几种启动形式总结经验

我这里抉择的是应用 jar 包部署，通过 Maven 打包的步骤就不阐明了。再次通过 Xftp 将 jar 文件上传至服务器，我的截图里有一个 dev 版本的是保留了控制台日志的版本，失常只须要一个就能够。

3.3 Screen

下面介绍的文章里有提到 java 我的项目会运行在前台，当咱们的 Xshell 窗口敞开后，我的项目其实也是会敞开的，但如果让连入的机器也放弃开机也并不合理，所以应用 nohub 指令将 jar 程序始终挂载在后盾。这里再介绍另一种办法，那就是 Screen 工具。

Screen 是一款由 GNU 打算开发的用于命令行终端切换的自由软件。用户能够通过该软件同时连贯多个本地或近程的命令行会话，并在其间自在切换。GNU Screen 能够看作是窗口管理器的命令行界面版本。它提供了对立的治理多个会话的界面和相应的性能。

Screen 在一些风行的发行版上曾经预装置了，你能够应用上面的命令查看是否曾经在你的服务器上安装了。

screen -v

如果没有能够通过自带的包管理器简略地装置。

yum -y install screen
screen -S yourname      #创立一个名为 yourname 的 session
screen -ls              #列出以后所有的 session
screen -r yourname      #回到 yourname 这个 session
screen -d yourname      #近程 detach 某个 session
screen -d -r yourname   #完结以后 session 并回到 yourname 这个 session

应用 Screen 就如同切换窗口个别，这样在服务器性能容许的状况下就能够同时挂载多个利用，同时也绝对方便管理。

3.4 MySQL

1. 装置

刚开始部署的时候，我简直疏忽了 MySQL，之后也没想到这是最花工夫的局部，但如果遵循正确的步骤其实并不艰难。

大部分的工具咱们都能够通过包管理器 yum 来装置，上文的 Screen 正是如此，我本认为 MySQL 也是如此，不过查了一下发现最后的确如此，但自从 MySQL 被收买之后就存在版权问题了，所以 CentOS7 曾经不再反对 MySQL，而是在外部集成了 MariaDB，两者颇有渊源，后果就是文件会有抵触，所以还要先卸载 MariaDB 才行。

# 列出所有被装置的 rpm package
rpm -qa | grep mariadb
# 卸载（留神“版本号”依据以后零碎显示的版本信息的为准）rpm -e mariadb-libs-5.5.37-1.el7_0.x86_64
# 如果提醒依赖检测失败能够强制卸载
rpm -e --nodeps mariadb-libs-5.5.37-1.el7_0.x86_64

# 装置依赖
yum install vim libaio net-tools

之后咱们要决定是通过 repo 源间接从服务器下载安装还是本人去官网下载一个再上传到服务器上，最后我是按一些教程的步骤间接从 repo 源下载，但因为抉择的版本不对，最初程序无奈正确建设连贯，重复尝试之后抉择从社区版官网下载须要的版本。

进入网站默认是最新版本，要找之前的版本点击 Archives，在新的页面抉择对应的版本。而后是抉择操作系统，CentOS 零碎就是 Red Hat 的社区发行版，内核是雷同的，或者用通用版本（Generic）也能够。

下载 bundle 包，解压出其中如图所示的五个文件上传至服务器，顺次装置 mysql-community-common、mysql-community-libs、mysql-community-client、mysql-community-server、mysql-community-release。

# 顺次类推
rpm -ivh mysql-community-common-8.0.13-1.el7.x86_64.rpm

# 如果呈现“依赖检测失败”问题再前面增加 --force --nodeps 强制装置
rpm -ivh mysql-community-common-8.0.13-1.el7.x86_64.rpm --force --nodeps

当初常见的 MySQL 版本个别是 5.7 和 8.0 之后的若干小版本，依据应用版本的不同，后续的配置有很大的不同，我应用的版本是 8.0.13，接下来也是以 8.0 版本为例。

2. 重置明码

在这一步遇到了诸如权限问题、版本不对、字段不同等状况，因为部署时齐全没想到有如此多的问题，没有留下截图，这里说一下整体的思路：首先要登录 MySQL，装置实现后可能会有一个随机明码，记录下来，用这个明码登录进数据库，如果有权限问题就先给 MySQL 文件夹受权，登录之后通过数据表批改默认明码，指令如下：

# 登录，- p 前面没有空格，间接输出明码，5.7 版本明码默认为空，8.0 应用随机明码
mysql -u root - p 明码
# 切换数据库
use mysql;
# 批改明码（不能用 123456 这种简略的明码，须要大小写和数字，如果还是想用简略的明码，看下文）update user set password=password('123456') where user='root';
# 退出
exit;

设置实现后就能够用新密码登录了，如果设置有问题或者没有记录随机明码还有通过批改本地文件来重置明码的形式，这里就不介绍了。

如果只是集体开发，不想用太过简单的明码怎么办？能够通过批改明码规定来解决这一问题，同样的，5.7 和 8.0 版本也存在区别：

# 5.7
set global validate_password_policy=0;
set global validate_password_length=1;

# 8.0
set global validate_password.policy=0;
set global validate_password.length=1;

# 查看明码验证变量
SHOW VARIABLES LIKE 'validate_password%';

明码等级表

Policy Tests Performed
0 or LOW Length
1 or MEDIUM Length; numeric, lowercase/uppercase, and special characters
2 or STRONG Length; numeric, lowercase/uppercase, and special characters; dictionary file

3. 近程连贯

每次要查数据库都要登录 Linux 就会很不不便，而且界面不敌对，如果咱们想用本地的 Navicat 拜访近程的数据库要怎么设置呢？

首先要敞开防火墙或者凋谢数据库的 3306 端口（最好还是凋谢端口），

# 查看防火墙状态
systemctl status firewalld

# 开启防火墙服务
systemctl start firewalld

# 凋谢指定端口
firewall-cmd --zone=public --add-port=3306/tcp --permanent

# 从新载入
firewall-cmd --reload

如果应用的是云服务器，还要记得在平台上凋谢指定端口：

设置完防火墙之后依然不能近程登录，因为咱们没有受权用户，先查问一下用户表：

select user,host from user;

能够看到除了 remote 都是 localhost，remote 就是我新建的专门用于近程登录的用户，host 代表的是该用户能够在哪个地址下登录，“%”代表所有地址都能够。5.7 之前的版本能够通过受权间接隐式创立用户，8.0 之后不能够了。间接批改 root 用户的 host 也是能够的，然而这样登录时会有些小区别，具体遗记了，这里我举荐新建一个用户。

/* 创立用户，这里的明码同样也受后面设置的明码等级限度 */
CREATE USER '用户名'@'%' IDENTIFIED BY '明码';

/* 受权 */
grant all privileges on *.* to '用户名'@'%';

执行后应用 Navicat 近程登录如果报错 1251 client does not support authentication，阐明 MySQL8 与 Navicat 的加密形式不同，批改加密形式：

alter user 用户名 identified with mysql_native_password by '明码';

这样就能够从本地间接拜访近程的数据库了。

4. 卸载 MySQL

如果你在装置时可怜呈现问题，有各种各样的问题须要重装 MySQL，那么能够依据这篇文章 Linux 下彻底卸载 mysql 详解来卸载 MySQL。

5. 程序建设数据库连贯

到这里就是最初一步了，我在这里呈现问题后试了各种办法都没有胜利建设连贯，用户名明码都没有错的状况下可能须要查看以下几个方面：

  • 数据库版本与程序的驱动版本是否统一
  • 数据库连贯串是否正确
  • 账号是否有拜访权限

援用的插件版本要与服务器上安装的数据库版本统一

5.7 和 8.0 的连贯串有不少区别，8.0 须要很多额定词条，这里留下我的连贯串 

jdbc:mysql://localhost:3306/onesideddice_mall?useUnicode=true&serverTimezone=Asia/Shanghai&characterEncoding=utf8&autoReconnect=true&allowPublicKeyRetrieval=true&useSSL=false&allowMultiQueries=true

6. 导入数据

这一步很简略了，有各种办法，这里记录一下导入服务器上的 sql 文件这种形式：

create database abc;      /* 创立数据库 */
use abc;                  /* 应用已创立的数据库 */
set names utf8;           /* 设置编码 */
source /home/abc/abc.sql  /* 导入备份数据库 */

3.5 Nginx 图片服务器

在前端局部咱们曾经在 Nginx 中配置过后端接口了，为什么这里还要再提一次呢？其实实践上到这一步之前，就曾经实现网站的部署了，如果两头各种对接没有其余问题，网站曾经能够失常运行了，然而如果你的站点中有大量的图片，则不得不思考图片要以什么形式存储，相对路径如何设置等。在部署实现后在图片展现上我遇到了很多问题，其中比较显著的就是图片的相对路径转换问题，在察看了一些网站的后，我发现他们的图片通常独自寄存在图片服务器上，这样图片的门路绝对稳固又不便设置，于是我就想到用 Nginx 再配置一个图片服务器进去，尽可能地利用现有的服务器资源，当然也能够抉择七牛云这种专门的图片服务器，这样图片的拜访应该会更加稳固疾速。

  1. 配置 Nginx

在 Nginx 的配置里增加一个新的 Server，不便与咱们的网站利用辨别，配置如下：

server {
    listen       8000;
    server_name  localhost;

    location / {
        root   /app/osd_mall/images;
        autoindex on;
    }
}
  • root 则是将 images 映射到 /home/ftpadmin/hatlth/images/
  • autoindex on 便是关上浏览性能。

设置批改实现后记得测试并重载 Nginx。

  1. 凋谢端口

和之前凋谢数据库端口雷同。

  1. 批改文件拜访权限 
chown ftpadmin /app/osd_mall/images
chmod 777 -R /app/osd_mall/images
  1. 批改程序

依据本人的站点批改门路，因为应用了对立的图片服务器，当初能够设置一个配置项来专门治理图片地址了，绝对于之前要不便很多，本地环境也能够应用这个线上的图片服务器。

4 完结

到这里，根本的部署就实现了，实现了从本地 Windows 端到 Linux 服务端的转换，在解决问题的过程中没有想到有如此多的问题，记录的时候脱漏了很多细节，但次要的问题应该都得以解决，心愿能帮忙遇到问题的人，也不便本人日后回顾浏览。

退出移动版