自己作为一个前端程序员，感觉单研究前端技术在能力提升上有很大局限，应该扩充武器库，学习一些其他领域的技术，得到思维的扩展，然后回头降维打击自己的本职领域，会有不一样的视角。所以前段时间研究了一下nodeJS，算是get了一点后端开发技能，也顺便捡回一点大学的网络和数据库知识。
那段时间用vue+express+MySQL撸了一套完整的个人博客系统（前台+后台）。前几天把它部署到了阿里云服务器，也算是再扩展一点部署相关技能，这里记录一下部署过程和遇到的坑。

个人博客项目技术栈

前端前台：vue全家桶（没用组件库，纯手撸）
前端后台：vue-element-admin
后端：EggJS
数据库：MongoDB ps：后端部分我是拿到某个EggJS+MongoDB的现成工程，然后自己用express+MySQL重构了一版，毕竟照猫画虎比自己0-1轻松一些（手动狗头）。原版总共31个接口，自己大概写了三分之二的主要功能后，就没往下写了，确实有些繁琐，这次部署的是EggJS+MongoDB的完整版。

一点部署常识-两种部署方式

后端部署

静态资源、服务器代码全部放在后端服务器上

前后端分离部署

静态资源和后端代码分开部署在不同的服务器上，客户端向静态资源服务器（Nginx）请求静态资源渲染页面。为避免跨域问题，需要获得数据库数据时，也向Nginx发请求，此时Nginx内部会做一个请求代理，将请求转发至后端服务器，获取到数据后再将数据返回客户端，此时Nginx就充当了一个“中间商”的作用。

购买阿里云服务

阿里云有多服务，先选择云服务器ECS，进去后购买最便宜的套餐即可。

进入控制台，选择云服务器

创建实例，系统选择centos，千万记住版本选择# CentOS 7，# CentOS 8已经停止维护。这里我用的是7.8。进去按照提示一步一步操作就可以了。

完成后，控制台里就有一个属于自己的服务器啦，点击远程连接就可以操作了

安装Node.js

详情参见阿里云官方文档 help.aliyun.com/document_de…
当时我在这一步踩了个坑，当时我使用的是CentOS 8yum install git -y安装git工具时，一直报错，在这一步卡了很久，其实就是CentOS 8停止维护，阿里云也停止了对其相关资源的维护，git资源失效。这个多数前端童靴都不知道吧，手动狗头。换成7就完美解决。

安装MongoDB

安装数据库对于没接触过的前端童靴，可能稍微有点难度，运气好一次性成功，运气不好就会有各种莫名其妙的错误。

安装依赖库

yum -y install pcre*
yum -y install openssl*

安装MongoDB

下载：curl -O https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-amazon-4.2.18.tgz
也可以使用wget命令
解压：wget mongodb-linux-x86_64-amazon-4.2.18.tgz

注意这里最好去MongoDB的官网找下载链接，百度搜出来的一些链接可能出现莫名其妙的错误。我当用百度的野链接怎么都安装不上，要么无法解压，要么版本太低，更换版本号又无法下载。

移动：mv mongodb-linux-x86_64-amazon-4.2.18 /usr/local/mongodb
// 创建数据文件夹、日志文件和mongo配置文件:
mkdir -p  /usr/local/mongodb/data/db
touch /usr/local/mongodb/mongod.log
touch /usr/local/mongodb/mongodb.conf

ps：centos的基本命令和文件目录可自行百度一下，我们一般把后来的文件放在/usr/local文件夹下，附上一张centos7的文件结构图，在阿里云服务器终端的文件树里可以看到，双击还能编辑，挺方便的。

启动MongoDB（这一步有很多坑） 先说最终版本
在配置文件mongodb.conf中加入如下代码：

systemLog:
  destination: file #日志输出方式。file/syslog,如果是file，需指定path，默认是输出到标准输出流中
  path: /usr/local/mongodb/mongod.log  #日志路径
  logAppend: true #启动时，日志追加在已有日志文件内还是备份旧日志后

net:
  port: 27017 #监听端口27017
  bindIp: 0.0.0.0 #绑定监听的ip，设置为0.0.0.0时，接受所有ip的访问
  maxIncomingConnections: 65536 #最大连接数
  wireObjectCheck: true #校验客户端的请求，防止错误的或无效BSON插入,多层文档嵌套的对象会有轻微性能影响,默认true
 
processManagement:
  fork: true  # 开启一个子进程，后台运行

security:
  authorization: enabled  # enabled/disabled #开启客户端认证

storage:
  dbPath: /usr/local/mongodb/data/db  # 数据库地址
  journal: 
    enabled: true #启动journal,64位系统默认开启，32位默认关闭

按照指定的配置文件，启动MongoDB：

// 注意命令必须在MongoDB的bin目录下执行
./mongod --config /usr/local/mongodb/mongodb.conf

MongoDB设置密码：基本思路：创建数据库用户，给用户分配数据库权限。注意这里的“用户”指的是MongoDB的用户，而非客户端的用户。MongoDB的用法可自行百度。同理在egg写的后端代码中，链接数据库也需要使用用户名和密码去连接。

按照以上步骤操作，应该不会有大问题，下面说一下我的踩坑步骤，不想看的可以跳过

踩坑历程启动MongoDB时，使用mongod --dbpath /usr/local/mongodb/db命令
为了让三方图形化工具robo3t可以远程连接上我阿里云服务器上的MongoDB，需要指定可访问ipmongod -dbpath /usr/local/mongodb/db --bind_ip 0.0.0.0，注意，坑来了
坑1： centos报错说无法找到mongod命令，我配置了环境变量，并且是在MongoDB的bin目录下执行的，还是找不到命令。需要在最开头加上“./”,具体是啥原因我也不清楚。./mongod -dbpath /usr/local/mongodb/db --bind_ip 0.0.0.0
坑2： MongoDB启动时，一直卡在“waiting for connections ..,”，百度后得知，重新开一个终端，运行./mongod命令即可解决。bug具体原因不得而知。
坑3： 数据库启动后，一退出终端，数据库就关闭了，无法访问。使用进程守护：nohup command &例：nohup ./mongod -dbpath /usr/local/mongodb/db --bind_ip 0.0.0.0 &
坑4： 设置0.0.0.0为可访问ip的话，意味着所有人可以读写数据库，安全性如何保证？于是百度一下，找到了上文最终版启动方式和MongoDB加密方法
坑5： 用上文最终版启动步骤时，报错：

ERROR: child process failed, exited with error code 100
To see additional information in this output, start without the "--fork"

百度了一下“To see additional information in this output, start without the "--fork"”错误可能性很多，error code 100也查不到有用的信息。读一下英文，大体是说fork配置项没对。但是我fork确实是配置了并且没错的。最后检查半天发现是配置文件mongodb.conf中，我数据存储路径写错了，被自己蠢死。我写的是“dbPath: /usr/local/mongodb/data/db”，但实际我mongodb目录下只有db目录，没有data这一层，所以应该是“/usr/local/mongodb/db”。这里储存数据的目录可以随便设置，只要注意运行命令和配置时，写自己正确的路径就行。
坑6： robo3t依然无法远程连接云服务器上的MongoDB（后面详细说）

MongoDB数据备份和数据恢复数据导出：
mongoexport -d dbname -c collectionname -o file --type json/csv -f field
数据恢复：
mongoimport -d dbname -c collectionname --file filename --headerline --type json/csv -f field 详细查百度不多叙述

如何把备份得到的数据文件上传自己的云服务器？
我是用远程工具FinalShell连接云服务器，然后把文件上传的。

连接后也可以直接使用FinalShell的终端进行操作

安装Nginx

下载依赖

yum -y install pcre*
yum -y install openssl*

下载 wget（下载工具）

yum install wget

下载 nginx

wget http://nginx.org/download/nginx-1.21.1.tar.gz

解压

tar zxvf nginx-1.21.1.tar.gz

./configure

安装

make install

完成后会多出一个nginx目录：

html目录下就是可访问的html资源啦

当这时，你信心满满去访问自己的页面时，可能发现根本找不到此网址
但使用curl测试网确实又能连接上所以目前问题是，Nginx确实在工作了，但是外部客户端无法访问静态资源，分析了之后有两种可能：

防火墙没开放80端口，但云服务器的防火墙默认是关闭的，排除
阿里云服务器本生拦截了请求（事实就是这个原因）。 解决方法： 阿里云后台控制台，找到安全组设置，将服务器加入安全组，并开放80端口和MongoDB的27017端口（上文的robo3t连接MongoDB问题至此也解决了）

上传代码文件

当然还是使用FinalShell

前端部分，需要将打包好的工程上传。注意，打包好的文件，上传服务器后，可能会出现css和js文件路径出错的问题，这是因为IDE和服务器指定的根目录不同，可修改一下vue.config.js文件中的publicPath字段试一下

前端部分，将文件放到nginx目录的html目录下
配置nginx

这一步是做个请求代理，静态资源通过80端口访问，所以同源请求直接返回html静态资源。访问后端接口就转发请求至egg监听的7001端口。我们使用的是前后端分离部署，本来nginx和后端代码应该部署在两台不同的服务器上，nginx仅仅处理静态资源和接口请求的转发。但现在条件有限，就弄到了一台服务器上

后端部分，上传代码注意，后端代码不要上传node_modules文件夹，要上传到服务器后重新安装依赖和各种库，因为服务端和客户端使用的库有所区别。
把代码跑起来进入后端代码根目录，安装依赖，运行

nvm use v16.13.0 //使用你安装的nodejs版本
npm i
npm start

至此，博客项目部署完毕，可以访问自己的博客网站啦

总结

自己做一个“真”完整的web应用，前端制作、接口设计、数据库设计、后端代码书写、项目调试、部署上线全部自己亲力亲为完成，最后的成就感不言而喻。
项目中，作为一个前端，在数据库设计、后端代码书写、部署阶段确实遇到了不少难题，但最后完成后收获也是同样丰富。具体的，在网络、数据库、服务器等方面的知识有非常明显的增长，对于多数前端来说，这种知识的扩充非常重要，可能决定你将来的上限。宏观的，对于一个web应用的“前世今生”有了更深刻的认识，跟后端同事关系也更好了（手动滑稽）。
最后，建议广大的前端童鞋，尝试学习一下nodejs或者其他后端语言。特别是入行2年左右的前端，这时正处在一个“青少年”阶段，不是“菜鸟”了，但技术实力依然难当大任，这是第一个小瓶颈期，这时扩充一点后端技术能力，或许有意想不到的惊喜。
补充： 域名可以直接在阿里云注册，需要实名认证，与自己云服务器的ip地址绑定就能映射啦，切记不用去买DNS服务。

记个人博客项目的部署