作为一名服务器小白，我是如何在服务器上成功部署node+mongodb项目并优化其性能的呢？一步一步，node+mongodb项目部署在阿里云centos7.3的服务器上，性能优化，1秒内可以看到loading页面，3秒内可以看到首屏内容秒。构建的项目采用了前后端分离的主流思想。这里只谈服务器环境搭建和性能优化。效果请看http://biaochenxuying.cn/main.html1.过程开发好前后端程序。购买服务器，在域名服务器上安装需要的环境（本项目为node和mongodb）。在服务器上开放端口并设置规则使用nginx、apache或tomcat提供HTTP服务或设置代理上传项目代码或使用码云或gihub拉取你的代码到服务器上并启动expressserver来优化页面加载2.内容细则2.1开发前后端程序开发前后端程序。发展！发展！重新开发！2.2购买服务器和域名我一直认为程序员应该有自己的个人网站，有自己的域名和服务器。可以在学习知识或测试项目时用于测试。阿里云有学生专属的云翼计划。阿里云学生套餐，入门级云服务器原价1400多，学生认证后一年只需114，非常划算。如果你还是学生，可以直接购买；如果你不是学生，你可以用他们的大学生身份购买。很便宜很实用（我买了学生优惠套餐）。当然阿里云服务器每年双11都有很大的优惠，而且也很便宜。您选择的配置和价格取决于您的用途。服务器预装环境可以选择CentOS或者windowsserver。为了体验和学习linux系统，我选择了CentOS。三是购买域名阿里域名购买，我也是在阿里云上购买的。域名分为国际域名和国内域名。国际域名不需要备案，国内域名必须在阿里云ICP备案管理系统备案，否则不能使用。如果是国内域名，如何备案域名，请上网找教程。当然，如果你的网站只是供自己使用，则不需要购买域名，因为你可以通过服务器的公网IP访问网站内容。如果购买了域名，还必须设置域名映射到对应的公网ip，否则无法使用。3.在服务器上安装需要的环境（本项目为node和mongodb）3.1登录服务器由于我使用的是MacBookPro，所以直接打开mac终端，通过以下命令行连接服务器。root是阿里云服务器的默认账户名。连接时将要求您输入密码。输入您在购买时或稍后设置的密码。sshroot@47.106.20.666//你服务器的公网ip，如图47.106.20.666：window系统请使用Putty或者Xshell登录，可以参考这篇文章部署Node。js项目到阿里云服务器（CentOs）一般新建一个服务器后，建议先升级CentOS：yum-yupdateLinux常用命令cd进入目录cd..回到上一级目录ls-a查看当前目录mkdirabc创建abc文件夹mv移动或重置名称rm删除文件或目录3.2安装node升级常用库文件，安装node.js需要用g++编译。yum-yinstallgccgcc-c++autoconf跳转到目录：/usr/local/src，这个文件夹一般用来存放软件源码：cd/usr/local/src下载node.js源码，也可以使用scp命令直接上传，因为下载太慢：下载地址：下载请下载对应版本的最新源码进行下载，我下载的是v10.13.0版本。https://nodejs.org/dist/v10.13.0/node-v10.13.0.tar.gz下载后解压：tar-xzvfnode-v10.13.0.tar.gz进入解压后的文件夹：cdnode-v10。13.0执行预编译处理的配置脚本：./configure编译源码，这一步时间比较长，大概5到10分钟：make编译完成后，执行安装命令，使其在系统范围内可用：makeinstallinstallexpress推荐globalinstallnpm-ginstallexpress创建超链接，否则sudonodesudoln-s/usr/local/bin/node/usr/bin/nodesudoln-s时会报"commandnotfound"/usr/local/lib/node/usr/lib/nodesudoln-s/usr/local/bin/npm/usr/bin/npmsudoln-s/usr/local/bin/node-waf/usr/bin/node-waf通过命令查看node和npm的版本：node-vnpm-vnode.js到这里基本安装完成。3.2安装mongodb下载地址：下载mongodb时请选择对应的环境和版本，因为我的服务器是CentOS，本质上是linux系统，所以选择环境和最新版本如下图。mongodb:软件安装位置：/usr/local/mongodb数据存放位置：/home/mongodb/data数据备份位置：/home/mongodb/bak日志存放位置：/home/mongodb/logs下载安装包>cd/usr/local>wgethttps://fastdl.mongodb.org/linux/mongodb-linux-x86_64-4.0.4.tgz解压安装包，将文件夹重命名为mongodbtarzxvfmongodb-linux-x86_64-4.0.4.tgzmvmongodb-linux-x86_64-4.0.4mongodb在var文件夹下创建mongodb文件夹，分别创建文件夹data存放数据，logs存放日志mkdir/var/mongodbmkdir/var/mongodb/datamkdir/var/mongodb/logs打开rc.local文件，添加CentOS启动项：vim/etc/rc.d/rc.local//不会vim操作的请自行查看相应文档教程，例如：Invimmode,需要按i插入内容后，按shift和:wq保存退出。将mongodb启动命令添加到此文件以使mongodb自动启动：/usr/local/mongodb/bin/mongod--dbpath=/var/mongodb/data--logpath/var/mongodb/logs/log.log-Forkstartsmongodb/usr/local/mongodb/bin/mongod--dbpath=/var/mongodb/data--logpath/var/mongodb/logs/log.log-fork看到如下信息，说明已经安装完成并开始successful:forkedprocess:18394alloutputgoingto:/var/mongodb/logs/log.logmongodb默认的端口号是27017，如果你的数据库连接需要账号和密码，必须创建数据库管理员，否则无法连接直接地。在mongoshell中创建管理员和数据库。切换到admin数据库，创建超级管理员账号useadmindb.createUser({user:"username",pwd:"loginpassword",roles:[{role:"userAdminAnyDatabase",db:"admin"}]})switch进入要使用的数据库，比如taodb数据库，为这个数据库创建一个管理员账号usetaodbdb.createUser({user:"用户名",pwd:"登录密码",roles:[{role:"readWrite",db:"taodb"}]//读写权限})按两次control+c退出mongoshell。至此，mongodb就基本安装好了。备份和恢复可以参考这篇文章：MongoDB备份（mongodump）和恢复（mongorestore）安装node和mongodb也可以参考这篇文章：CentOs搭建NodeJs服务器——Mongodb安装3.3开启服务器端口并设置安全组规则如果你只是针对静态网页，可以参考这篇文章通过云虚拟主机控制台设置默认主页，但是我们要部署后台程序，所以需要阅读以下内容：什么是安全组规则？安全组关联的ECS实例的公网和内网的出入口访问。阿里云安全集团应用案例文档80端口开放HTTP（HyperTextTransportProtocol），即超文本传输??协议。当浏览器HTTP访问IP或域名的80端口时，80端口可以省略。如果我们没有开启相应的端口，比如我们的服务需要使用3000，就必须开启3000的端口，否则无法访问；其他端口也是如此。端口都配置对了，你觉得可以用公网IP访问吗？小弟你太天真了。。。还有防火墙。如果防火墙没有关闭或者相关端口没有打开，则无法使用公网IP访问网站内容。与安全组端口相同。比如我们的服务需要使用3000端口，那么3000端口就必须打开，否则无法访问；其他端口也是如此。为了安全起见，最好打开防火墙，只打开相应的端口。如何打开相应的端口？看下面两篇就够了，这里就不展开了。1.将nodejs项目部署到阿里云ESC服务器上，在linux系统配置80端口，实现公网IP访问2.centos出现“FirewallD未运行”怎么办3.4使用nginx、apache或tomcat来提供HTTP服务或者设置代理，都是用到nginx的，所以这里只介绍nginx。安装nginx请看这两篇文章：1.在Centos7上安装Nginx实战2.在阿里云Centos7上安装Nginx服务器实现反向代理开启ngnx代理，进入目录位置cd/usr/local/nginx有个sbinnginx目录下的目录，sbin目录下有一个nginx的可执行程序。./nginx关闭nginx./nginx-sstop重启./nginx-sreload基本使用是这样的。我的nginx代理的设置如下：我的两个项目放在/home/blog/blog-react/build/下；和/home/blog/blog-react-admin/dist/；路径不是这个，请修改成你的路径。#usernobody;worker_processes1;#error_loglogs/error.log;#error_loglogs/error.lognotice;#error_loglogs/error.loginfo;#pidlogs/nginx.pid;events{worker_connections1024;}http{includemime.types;default_type应用程序/八位字节流；#log_formatmain'$remote_addr-$remote_user[$time_local]"$request"'#'$status$body_bytes_sent"$http_referer"'#'"$http_user_agent""$http_x_forwarded_for"';#access_log日志/access.logmain;发送文件；#tcp_nopush上；#keepalive_timeout0;keepalive_timeout65；#gzip上；#如果port_in_redirect关闭，则始终遵循默认端口80；如果这条指令被打开，那么会返回当前监听的端口。port_in_redirect关闭；#前台显示打开的服务代理server{listen80;服务器名称本地主机；#charsetkoi8-r;#access_log日志/host.access.logmain;#root/主页/博客；位置/{root/home/blog/blog-react/build/;索引index.html；try_files$uri$uri/@router;自动索引；}location@router{最后重写^.*$/index.html;}location/api/{proxy_set_headerX-Real-IP$remote_addr;proxy_passhttp://47.106.136.114:3000/;}gzip上;gzip_buffers324k；gzip_comp_level6；gzip_min_length200;gzip_types文本/css文本/xml应用程序/javascript；gzip_vary开启；#error_page404/404.html;#将服务器错误页面重定向到静态页面/50x.html#error_page500502503504/50x.html;位置=/50x.html{根html;}}#HTTPSserver#管理后台打开的服务代理server{listen4444;服务器名称本地主机；#字符集koi8-r;#ssl_certificatecert.pem;#ssl_certificate_keycert.key;#ssl_session_cache共享：SSL：1m；#ssl_session_timeout5m;#ssl_ciphersHIGH:!aNULL:!MD5;#ssl_prefer_server_ciphers开启；位置/{root/home/blog/blog-react-admin/dist/;indexindex.htmlindex.htm;try_files$uri$uri/@router;自动索引；}location@router{最后重写^.*$/index.html;}location/api/{proxy_set_headerX-Real-IP$remote_addr;proxy_passhttp://47.106.136.114:3000/;}gzip上;gzip_buffers324k；gzip_comp_level6；gzip_min_length200;gzip_types文本/CSS文本/xml应用程序/javascript；gzip_vary开启；error_page500502503504/50x.html;}}我开了两个代理：前台开的服务代理和管理后台开的服务代理。本项目单独端口例如：我的公网ip是47.106.20.666，那么通过http://47.106.20.666可以访问前显，通过http://可以访问管理后台的登录界面47.106.20.666:4444。至于为什么要写这样的配置：try_files$uri$uri/@router;location@router{rewrite^.*$/index.htmllast;}因为进入文章详情或者前端路由发生变化，再次刷新浏览器，发现浏览器有404。刷新页面时访问的资源在服务器端找不到，因为react设置的路径-router不是真正的路径。所以设置是为了让你可以刷新并打到相应的路径。刷新时出现404问题。你可以阅读这篇文章。在部署react、vue等单页项目时，访问刷新时出现404问题。3.5上传项目代码，或者使用码云或者gihub拉取你的代码到我创建的服务器上码云账号是用来管理项目代码的，因为码云上可以创建免费的私有仓库，我把代码上传到本地到Gitee.com，然后进入服务器用git把代码拉下来，很方便。详细请参考：Gitee.com帮助文档V1.2git安装请参考：CentOS7.4系统安装git如果不想使用git进行代码管理，请使用其他可以连接服务器的软件上传文件，例如FileZilla。3.6启动快递服务启动快递服务，我使用的是pm2，可以永久运行在服务器上，快递服务不会一报错就挂掉，运行中可以进行其他操作。安装：npminstall-gpm2将当前工作目录切换到express应用文件夹，执行pm2命令启动express服务：pm2start./bin/www比如我操作项目时的基本操作：cd/home/blog/blog-nodepm2start./bin/www//开启pm2stop./bin/www//关闭pm2list//查看使用的已启动项目：3.7页面加载优化看一下刚才nginx的一些配置:服务器{gzip上;gzip_buffers324k;gzip_comp_level6；gzip_min_length200;gzip_types文本/css文本/xml应用程序/javascript；gzip_vary开启；}这是使用ngonx打开gzip。亲测开启后，压缩了将近2/3的文件大小，原本需要1M以上的文件，开启压缩后变成了300k左右。其他的优化可以看这篇React16LoadingPerformanceOptimizationGuide，写的很好。我的一些优化参考了这篇文章。经过一系列的优化处理，在网络正常的情况下，页面首屏渲染从将近5秒缩短到3秒以内，1秒内可见首屏渲染前的loading。4.项目地址我的个人博客项目地址：前端展示：https://github.com/biaochenxuying/blog-react后台：https://github.com/biaochenxuying/blog-react-admin后端：https://github.com/biaochenxuying/blog-nodeblog:https://github.com/biaochenxuying/blog本博客系统的一系列文章：react+node+express+ant+mongodb简洁时尚的博客站点react+AntDesign+支持markdown的blog-react项目文档详解基于node+express+mongodb的blog-node项目文档详解我这个服务器小白如何在服务器部署node+mongodb项目并优化性能。对堆修感兴趣的朋友可以扫描下方二维码关注我公众号我会不定期更新有价值的内容，长期运营。关注公众号，回复福利领取免费学习资料。详细福利请点击：Python,Java,Linux,Go,node,vue,react,javaScript
