王者荣耀全栈项目部署到阿里云服务器笔记
原创Charles_GX 最后发布于2020-03-27 01:27:00 阅读数 177 收藏
展开
王者荣耀全栈项目部署到阿里云服务器笔记
学习的项目来自b站的良心up主全栈之巅
第一次写博客 这里主要总结一下 这两天部署项目遇到的一些问题(踩得一些坑)
项目简介
主要有三部分 (admin后台管理端,web前端展示,以及server服务端)
进行生产环境的编译
1.手动分别在admin和web文件夹下添加添加环境变量文件 .env.development,添加 VUE_APP_API_URL = http://localhost:3000/admin/api**
2.对axios默认的baseURL进行更改
3.在server的main.js,中添加
app.use('/admin', express.static(__dirname + '/admin')) //静态文件
1
4.在admin和web中,分别创建vue.config.js配置文件,进行配置
因为默认访问 /直接跳转到web前端页 所以设置路径会有所不同 web端的vue.config.js如下
5.在admin和web文件夹下运行指令npm run build此时会在server文件夹下生成一个admin和web文件夹
此时server文件夹下的admin和web都是打包好以后的文件
6.在server文件夹下运行指令npm run serve 页面效果如下
去阿里云购买服务器和域名
1.这里选择的是便宜的域名 .xyz结尾
阿里云官网
域名的话 境内需要备案境外不用备案相对方便(因为后面需要对http进行https的加密)
2.购买ecs服务器 选择的是ubantu18.04的操作系统
ecs服务器地址
这里购买好ecs服务器以后需要把公网ip记录一下 后面会用的到
3.对域名进行解析
一定要选择记录类型为A的
通过 gitbash here 执行一下 ssh root@{你的主机名}
也可以在阿里云ecs服务器选择远程连接
nginx的安装与配置
在ubantu上安装nginx
- apt update
- apt install nginx -y
1
2
nginx安装好以后可以通过cd var/www里面查看到nginx的一些配置文件
这个如果没有显示默认配置页面 需要去阿里云的安全组规则里添加 80端口
主要需要用到nginx的反向代理 nginx配置文件推荐去一个网站 链接
选择 nodejs 然后输入自己的域名或者是ip地址
5. MongoDB数据库的安装和配置
apt install mongodb-server -y
这里一定要选择ubantu18的版本 之前因为16版本后面mongorestore恢复数据库的时候报错
下载nodejs apt install nodejs 这里刚下载下来的node是八点几的版本
可以再下载一个npm工具apt install npm下载了npm以后 输入 npm -v可以查看npm的版本
npm config set registry https://registry.npm.taobao.org
1
将npm的镜像设置为淘宝镜像
git 安装、配置ssh-key
pt install -y git
ssh-keygen
cat /root/.ssh/id_rsa.pub,获取到的ssh-key,要保存下来
后面需要在github或则码云等网站上 部署公钥 用于服务器clone项目
Node.js 安装、配置淘宝镜像
apt install -y nodejs
apt install -y npm
npm config set registry https://registry.npm.taobao.org
npm i -g nrm
npm i -g n
n use latest
退出重新连接exit,ssh root@{主机名}
拉取代码,安装pm2并启动项目
向github或者gitee提交代码
把ssh-keygen,添加到仓库的公钥,拉取克隆代码
在根目录下创建一个data文件夹
通过git clone从远程git仓库中拉取代码 前面已经上传到了远程仓库
git clone https://gitee.com/orange199853/node-vue-moba
1
进入到 node-vue-moba文件夹下 通过 npm i安装项目所需要的配置文件
安装PM2
npm i -g pm2
通过PM2启动服务
pm2 start index.js
如果修改过一些数据之类的需要手动reload一下 不像nodemon可以自动监听变化
pm2 reload
pm2 start index.js -f可以强制加载服务
配置 Nginx 的反向代理
在vscode中搜索remote-ssh插件并安装
下载下来以后需要进行配置 点击小窗口进入
Hostname 输入ip地址或者域名
点击链接后会提示输入密码
tips:这里可能会遇到的一个报错
提示连接错误的话 可能是 服务器的公钥进行过更改
ssh连接提示“REMOTE HOST IDENTIFICATION HAS CHANGED! ”解决办法:
ssh会把你每个你访问过计算机的公钥(public key)都记录在~/.ssh/known_hosts。当下次访问相同计算机时,OpenSSH会核对公钥。如果公钥不同,OpenSSH会发出警告,避免你受到DNS Hijack之类的***。
既然找到原因了,那就好解决了,直接编辑~/.ssh/known_hosts,将需要连接的那个IP相关rsa信息删除即可。,再次成功的话,它会将内容继续写入到 ~/.ssh/known_hosts中。
输入密码,连接
进入==/etc/nginx/==
去nginx配置网站
选择nodejs,进入server,填入自己域名,https不启用,最后下载。
把nginxconfig.io文件夹复制过去,把available里面的文件复制过去,把enabled里面的文件复制过去
重载nginx的配置文件,service nginx reload
重启服务器pm2 start server/index.js
迁移本地数据到服务器 (mongodump)
导出数据库,mongodump -d node-vue-moba
把dump文件夹整个复制过去
进入到root文件夹下
mongorestore,恢复数据库 这里需要注意 如果是用的16.04版本的ubantu可能会出现报错
把操作系统更新到18版本即可解决
恢复成功
此时将PM2重启一下
-
后台就有数据了
后台的图片链接还是localhost:3000,需要修改上传图片的接口
然后将代码重新提交 push到git码云上
然后在服务器上重新拉区
重启服务器,pm2 reload index
通过ssh登录数据库,修改图片链接
添加https证书
申请免费的ssl证书
https://letsencrypt.org/
选择cerbot
这里选择 Nginx 和ubantu 18.04版本
安装方式
sudo apt-get update
sudo apt-get install software-properties-common
sudo add-apt-repository universe
sudo add-apt-repository ppa:certbot/certbot
sudo apt-get update
1
2
3
4
5
sudo apt-get install certbot python-certbot-nginx
1
sudo certbot --nginx
1
sudo certbot certonly --nginx
1
通过cerbot添加了ssl证书后
此时的网址 前面已经有了https 更加安全
阿里云oss文件存储
去阿里云申请一个oss云存储
同时创建一个bucket
同时下载一个 Multer Storage for AliYun OSS
npm install --save multer-aliyun-oss
1
const MAO = require('multer-aliyun-oss');
const upload = multer({
storage: MAO({
config: {
region: '<region>', // 地域名字
accessKeyId: '<accessKeyId>', //key
accessKeySecret: '<accessKeySecret>', // 密码
bucket: '<bucket>' // bucket名称
}
})
});
1
2
3
4
5
6
7
8
9
10
11
12
创建一个bucket
创建一个accessKey
选择子用户
填写对应的即可
最后输入一张图片测试oss是否设置成功
注意每次进行代码的更改后都需要先push到远程的git仓库然后服务器再去pull拉代码
————————————————
版权声明:本文为CSDN博主「Charles_GX」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/Charles_GX/article/details/105132719