一、Koa2+MySQL项目线上部署
1、上传与安装依赖
a、上传项目并安装项目依赖
先将你的项目(除了 node_modules
)放到服务器指定的位置,例如我存放的位置:
# 我的项目名称就叫cms-server
/usr/local/html/cms-server
然后通过ssh连接服务器,进入该目录,执行 npm i
安装依赖包。
这里很有可能会安装失败,原因是被package-lock.json影响。解决方案:
$ rm package-lock.json
# 方法一:
# 如果没安装过yarn就全局安装一下
$ npm i yarn -g
$ yarn
# 方法二:
# 如果不愿意使用yarn,也可以用cnpm淘宝镜像
$ npm install -g cnpm --registry=https://registry.npm.taobao.org
$ cnpm i
安装完依赖包之后,安装压缩与解压工具:
# ubuntu新系统已自带解压与压缩工具,这一步可不做
$ sudo apt-get install unzip zip
b、ubuntu卸载MySQL
首先在终端中查看MySQL的依赖项:
$ dpkg --list|grep mysql
卸载:
$ sudo apt-get remove mysql-common
$ sudo apt-get autoremove --purge mysql-server-5.7
清除残留数据:
$ dpkg -l|grep ^rc|awk '{print$2}'|sudo xargs dpkg -P
再次查看MySQL的剩余依赖项:
$ dpkg --list|grep mysql
继续删除剩余依赖项:
$ sudo apt-get autoremove --purge mysql-apt-config
至此已经没有了MySQL的依赖项,彻底删除!
c、ubuntu安装与配置MySQL
* Ubuntu换源
备份原来的sorce文件:
$ cd /etc/apt
$ sudo cp sources.list sources.list.old
清空并编辑sources.list内容:
$ echo "" > sources.list
$ vim sources.list
写入一个这里选择清华镜像源:
# 清华镜像源
deb https://mirrors.tuna.tsinghua.edu.cn/ubuntu/ xenial main restricted universe multiverse
* 更新镜像源与软件
# 更新镜像源
sudo apt-get update
# 更新软件
sudo apt-get upgrade
d、ubuntu安装mysql
# 安装mysql5.7服务端,安装时会提示输入密码,暂时设置为123456
$ sudo apt-get install mysql-server-5.7
出现下图选Y:
# 继续安装mysql5.7客户端
$ sudo apt-get install mysql-client-5.7
接下来查看mysql版本:
# 查看mysql版本
$ mysql -V
# 查看mysql服务
$ netstat -tap | grep mysql
会看到下图代表完全安装成功:
e、忘记密码方案【备用】
# 停止mysql服务
$ sudo service mysql stop
# 修改MySQL的登录设置,暂时不校验登陆密码
$ sudo vim /etc/mysql/mysql.conf.d/mysqld.cnf
# 将[mysqld]下的“skip-external-locking”注释掉
# 添加 “skip-grant-tables” 然后保存退出
例如:
================================================
[mysqld]
user = mysql
pid-file = /var/run/mysqld/mysqld.pid
socket = /var/run/mysqld/mysqld.sock
port = 3306
basedir = /usr
datadir = /var/lib/mysql
tmpdir = /tmp
lc-messages-dir = /usr/share/mysql
#skip-external-locking
skip-grant-tables
=================================================
# 重启mysql数据库
$ sudo service mysql restart
# 免密登陆mysql数据库
$ mysql -u root mysql
# 修改root密码
$ update mysql.user set authentication_string=password('123456') where user='root';
# 刷新生效
flush privileges;
# 还原MySQL的登录设置
# 将[mysqld]下添加的“skip-grant-tables” 删除
# 将“skip-external-locking”的注释放开然后保存退出
sudo vim /etc/mysql/mysql.conf.d/mysqld.cnf
例如:
================================================
[mysqld]
user = mysql
pid-file = /var/run/mysqld/mysqld.pid
socket = /var/run/mysqld/mysqld.sock
port = 3306
basedir = /usr
datadir = /var/lib/mysql
tmpdir = /tmp
lc-messages-dir = /usr/share/mysql
skip-external-locking
=================================================
# 重启mysql数据库
sudo service mysql restart
# 使用新密码登陆mysql
mysql -u用户名 -p密码
# 例如:
mysql -uroot -p123456
f、mysql启动停止命令【备用】
查看mysql运行状态:sudo service mysql status
运行mysql: sudo service mysql start
结束mysql: sudo service mysql stop
取消开机启动: sudo update-rc.d -f mysql remove
2、pm2部署
先解释一下什么是pm2:
简单点说就是让你不需要像执行 node app.js
一样,必须一直保持终端开启,而是可以在你退出命令行界面时,依然将你的项目运行着。
a、pm2安装
# 全局安装pm2
$ npm install pm2 -g
# 查看pm2列表
$ pm2 ls
# 运行项目
$ cd /usr/local/html/cms-server
$ pm2 start app.js --name cms-server --watch
# 保存pm2列表
$ pm2 save
# 设置pm2开机自启动
$ pm2 startup # 禁止的话是pm2 unstartup
pm2运行出来的列表如图:
停止或开启该服务可以:
b、配置安全组
例如你项目名为cms-server,端口为6688,那么就需要到实例的安全组中:
c、访问IP+端口
例如:我的IP为8.130.20.212,端口号为6688,那么我的访问方式应为:8.130.20.212:6688,这也是我整个后端项目的根路径。
3、MySQL线上配置
a、连接本地数据库
目前我们只能访问根路径,因为其他路径基本都需要请求并访问数据库读取数据。因此我们需要把电脑本机的数据库搬运到服务器上。打开navicat,连接本地数据库:
b、连接远程数据库
我们采用ssh连接:
c、创建远程数据库
右键并新建数据库:
新建后就会出现:
d、数据传输
点击顶部工具栏,工具 - 数据传输
:
点击 下一步
:
选择 开始
,传输完成后就会看到:
这时候点击 关闭
,再打开远程数据库的表,就会发现所有数据已经迁移:
此时,我们完成了将本机数据库迁移至服务器的数据库,大功告成!
此时假设你的后端路由:8.130.20.212:6688/web/home/banner
可以返回首页banner数据,那么你将立刻看到:
那么,至此,服务端部署全部完成!
4、持续化部署【扩展】
然而,如果项目需要频繁修改,并且实时查看线上环境,那可能就需要频繁打包并上传,这一点非常麻烦。有没有什么更好的解决方案?答案是有的:
二、 Nuxt项目线上部署
1、本地运行项目
a、先给 package.json
中添加:
"config": {
"nuxt": {
"host": "localhost",
"port": "8765"
}
}
b、命令行执行
2、项目打包
所有图片的引入改为require的形式。
a、nuxt.config.js
中:
server: {
port: 8765, // default: 3000
host: '私网IP', // default: localhost (推荐)
},
router: {
// base: "/"
},
b、package.json
中:
{
"script": {
"serve": "pm2 start npm --name cms-web -- run start"
}
}
c、命令行执行客户端打包:
d、上传项目到服务器
把除了以下文件(夹)的所有内容都放到服务器任意指定的目录:
.git / dist / .gitignore / package-lock.json / yarn.lock
e、安装依赖并打包
服务器进入该目录,再次安装依赖并打包
$ npm install
$ npm run build
如果安装过程中总是自动出现 package-lock.json
,可以先做这一步设置:
$ npm config set package-lock false
f、pm2运行项目
首先确定pm2已经安装,未安装请参考nginx教程。
# 项目目录中:
$ npm run serve
3、Nginx配置
a、修改配置
vim你的 nginx.conf
:
http {
upstream nuxt {
server localhost:8765; # 项目中nuxt.config.js怎么写,这里就怎么写
keepalive 64;
}
server {
listen 80;
server_name codesohigh.com;
location /cms-web {
proxy_pass http://nuxt;
}
}
}
b、配置安全组
c、访问
浏览器访问 http://codesohigh.com/cms-web
即可。