如何将node+mongodb项目部署在阿里云服务器，并进行性能优化的-阿里云开发者社区

1. 流程

开发好前端与后端程序。
购买服务器与域名
服务器上安装所需环境（本项目是 node 和 mongodb ）
服务器上开放端口与设置规则
用 nginx、apache 或者tomcat 来提供HTTP服务或者设置代理
上传项目代码或者用码云或者 gihub 来拉取你的代码到服务器上
启动 express 服务器
优化页面加载

2. 内容细节

2.1 开发好前端与后端程序

开发好前端与后端程序，这个没什么好说的，就是开发！开发！开发！再开发！

2.2 购买服务器与域名

本人一直觉得程序员应该有一个自己的个人网站，拥有自己的域名与服务器。学知识或者测试项目的时候可以用来测试。

国内最大的云服务器就是阿里云，所以推荐使用阿里云的服务器。阿里云有个最新活动专题页：https://www.aliyun.com/activity，里面有阿里云服务器的最新活动，都是一些活动服务器，可以关注一下，非常划算。

可以ping一下阿里云哪个节点比较好：https://ping.gaomeluo.com/aliyun/

服务器预装环境可以选择 CentOS 或者 windows server，，为了体验和学习 linux 系统，我选择了CentOS。

再次是购买域名阿里域名购买，本人也是在阿里云购买的。如果你买的服务器是海外的，则不需要备案，如果是国内主机则必须得备案才能使用。但是我还是建议你用国内主机，然后备案，要不然很多东西用不了，如何备案域名，请自己上网查找教程。

当然如果你的网站只用来自己用的话，可以不用买域名，因为可以通过服务器的公网 ip 来访问网站内容的。

域名解析，就不一一讲解，自行百度。

3. 服务器上安装所需环境（本项目是 node 和 mongodb ）

3.1 登录服务器

因本人用的是 MacBook Pro ，所以直接打开 mac 终端，通过下面的命令行连接到服务器。root 是阿里云服务器默认的账号名，连接时候会叫你输入密码，输入你购买时设置的或者后来设置的密码。

ssh root@47.106.20.666 //你的服务器公网 ip，比如 47.106.20.666

如图：
101

window 系统的，请用 Putty 或 Xshell 来登录。

一般在新服务器创建后，建议先升级一下 CentOS：

yum -y update

常用的 Linux 命令

cd 进入目录
cd .. 返回上一个目录
ls -a 查看当前目录
mkdir abc 创建abc文件夹
mv 移动或重命名
rm 删除一个文件或者目录

3.2 安装 node

升级常用库文件, 安装 node.js 需要通过 g++ 进行编译。

yum -y install gcc gcc-c++ autoconf

跳转到目录：/usr/local/src，这个文件夹通常用来存放软件源代码：

cd /usr/local/src

下载 node.js 源码，也可以使用 scp 命令直接上传，因为下载实在太慢了：
下载地址：https://nodejs.org/en/download/ ，请下载最新的相应版本的源码进行下载，本人下载了 v10.13.0 版本的。

102

https://nodejs.org/dist/v10.13.0/node-v10.13.0.tar.gz

下载完成后解压：

tar -xzvf node-v10.13.0.tar.gz

进入解压后的文件夹：

cd node-v10.13.0

执行配置脚本来进行预编译处理：

./configure

编译源代码，这个步骤花的时间会很长，大概需要 5 到 10 分钟：

make

编译完成后，执行安装命令，使之在系统范围内可用：

make install

安装 express 推荐 global 安装

npm -g install express

建立超级链接, 不然 sudo node 时会报 "command not found"

sudo ln -s /usr/local/bin/node /usr/bin/node
sudo ln -s /usr/local/lib/node /usr/lib/node
sudo ln -s /usr/local/bin/npm /usr/bin/npm
sudo ln -s /usr/local/bin/node-waf /usr/bin/node-waf

通过指令查看 node 及 npm 版本：

node -v
npm -v

node.js 到这里就基本安装完成了。

3.2 安装 mongodb

下载地址：https://www.mongodb.com/download-center/community
下载时，请选对相应的环境与版本，因为本人的服务器是 CentOS ，其实本质就是 linux 系统，所以选择了如下图环境与目前最新的版本。
103

mongodb :

软件安装位置：/usr/local/mongodb
数据存放位置：/home/mongodb/data
数据备份位置：/home/mongodb/bak
日志存放位置：/home/mongodb/logs

下载安装包

> cd /usr/local
> wget https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-4.0.4.tgz

解压安装包，重命名文件夹为 mongodb

tar zxvf mongodb-linux-x86_64-4.0.4.tgz
mv mongodb-linux-x86_64-4.0.4 mongodb

在 var 文件夹里建立 mongodb 文件夹，并分别建立文件夹 data 用于存放数据，logs 用于存放日志

mkdir /var/mongodb
mkdir /var/mongodb/data
mkdir /var/mongodb/logs

打开 rc.local 文件，添加 CentOS 开机启动项：

vim /etc/rc.d/rc.local
// 不懂 vim 操作的请自行查看相应的文档教程，比如： vim 模式下，要 按了 i 才能插入内容，输入完之后，要按 shift 加 :wq 才能保存退出。

将 mongodb 启动命令追加到本文件中，让 mongodb 开机自启动：

/usr/local/mongodb/bin/mongod --dbpath=/var/mongodb/data --logpath /var/mongodb/logs/log.log -fork

启动 mongodb

/usr/local/mongodb/bin/mongod --dbpath=/var/mongodb/data --logpath /var/mongodb/logs/log.log -fork

看到如下信息说明已经安装完成并成功启动:

forked process: 18394
all output going to: /var/mongodb/logs/log.log

mongodb 默认的端口号是 27017。

如果你数据库的连接要账号和密码的，要创建数据库管理员，不然直接连接即可。
在 mongo shell 中创建管理员及数据库。

切换到 admin 数据库，创建超级管理员帐号

use admin
db.createUser({
    user: "用户名", pwd:"登陆密码", roles:[{
    role: "userAdminAnyDatabase", db: "admin" }] })

切换到要使用的数据库，如 taodb 数据库，创建这个数据库的管理员帐号

use taodb
db.createUser({
    user: "用户名", pwd:"登陆密码", roles:[ {
    role: "readWrite", db: "taodb" }] //读写权限 })

重复按两下 control+c ，退出 mongo shell。
到这里 mongodb 基本已经安装设置完成了。

3.3 服务器上开放端口与设置安全组规则

安全组规则是什么鬼

授权安全组规则可以允许或者禁止与安全组相关联的 ECS 实例的公网和内网的入方向和出方向的访问。
阿里云安全组应用案例文档

80 端口是为 HTTP(HyperText Transport Protocol) 即超文本传输协议开放的,浏览器 HTTP 访问 IP 或域名的 80 端口时,可以省略 80 端口号

如果我们没有开放相应的端口，

比如我们的服务要用到 3000 ，就要开放 3000 的端口，不然是访问不了的；其他端口同理。

105

106

107

端口都配置对了，以为能用公网 IP 进行访问了么 ?

还有防火墙这一关呢，如果防火墙没有关闭或者相关的端口没有开放，也是不能用公网 IP 进行访问网站内容的。

和安全组端口同理，比如我们的服务要用到的是 3000 端口，就要开放 3000 的端口，不然是访问不了的；其他端口同理。

3.4 用 nginx、apache 或者 tomcat 来提供 HTTP 服务或者设置代理

我是用了 nginx 的，所以这里只介绍 nginx 。

开启 ngnx 代理

cd /usr/local/nginx

在 nginx 目录下有一个 sbin 目录，sbin 目录下有一个 nginx 可执行程序。

./nginx

关闭 nginx

./nginx -s stop

重启

./nginx -s reload

基本的使用就是这样子了。

如下给出我的 nginx 代理的设置：

我的两个项目是放在 /home/blog/blog-react/build/; 和 /home/blog/blog-react-admin/dist/; 下的，如果你们的路径不是这个，请修改成你们的路径。

#user  nobody;
worker_processes  1;
#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;
#pid        logs/nginx.pid;

events {
   
    worker_connections  1024;
}

http {
   
    include       mime.types;
    default_type  application/octet-stream;

    #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
    #                  '$status $body_bytes_sent "$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';

    #access_log  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;

    #gzip  on;

    # 如果port_in_redirect为off时，那么始终按照默认的80端口；如果该指令打开，那么将会返回当前正在监听的端口。
    port_in_redirect off;

    # 前台展示打开的服务代理
    server {
   
        listen       80;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;
        #root /home/blog;

        location  / {
   
            root   /home/blog/blog-react/build/;
            index  index.html;
            try_files $uri $uri/ @router;
            autoindex on;
        }

        location @router{
   
            rewrite ^.*$ /index.html last;
        }

        location /api/ {
   
            proxy_set_header X-Real-IP $remote_addr;
            proxy_pass http://47.106.136.114:3000/ ;
        }
        gzip on;

        gzip_buffers 32 4k;

        gzip_comp_level 6;

        gzip_min_length 200;

        gzip_types text/css text/xml application/javascript;

        gzip_vary on;

        #error_page  404              /404.html;
        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
   
            root   html;
        }
    }


    # HTTPS server
    # 管理后台打开的服务代理
    server {
   
        listen       4444;
        server_name  localhost;
        #   charset koi8-r;
        #   ssl_certificate      cert.pem;
        #   ssl_certificate_key  cert.key;

        #   ssl_session_cache    shared:SSL:1m;
        #    ssl_session_timeout  5m;

        #    ssl_ciphers  HIGH:!aNULL:!MD5;
        #    ssl_prefer_server_ciphers  on;

        location / {
   
            root   /home/blog/blog-react-admin/dist/;
            index  index.html index.htm;
            try_files $uri $uri/ @router;
            autoindex on;
        }
        location @router{
   
            rewrite ^.*$ /index.html last;
        }

        location /api/ {
   
            proxy_set_header X-Real-IP $remote_addr;
            proxy_pass http://47.106.136.114:3000/ ;
        }
        gzip on;

        gzip_buffers 32 4k;

        gzip_comp_level 6;

        gzip_min_length 200;

        gzip_types text/css text/xml application/javascript;

        gzip_vary on;

        error_page   500 502 503 504  /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.html last;
    }

因为进入到文章详情时或者前端路由变化了，再刷新浏览器，发现浏览器出现 404 。刷新页面时访问的资源在服务端找不到，因为 react-router 设置的路径不是真实存在的路径。
所以那样设置是为了可以刷新还可以打到对应的路径的。

3.5 上传项目代码，或者用码云、 gihub 来拉取你的代码到服务器上

我是创建了码云的账号来管理项目代码的，因为码云上可以创建免费的私有仓库，我在本地把码上传到 Gitee.com 上，再进入服务器用 git 把代码拉取下来就可以了，非常方便。

具体请看：码云（Gitee.com）帮助文档 V1.2 http://git.mydoc.io/?t=180676

如果不想用 git 进行代码管理，请用其他可以连接服务器上传文件的软件，比如 FileZilla。

3.6 启动 express 服务

启动 express 服务，我用了 pm2，可以永久运行在服务器上，且不会一报错 express 服务就挂了，而且运行中还可以进行其他操作。

安装：

npm install -g pm2

切换当前工作目录到 express 应用文件夹下,执行 pm2 命令启动 express 服务：

pm2 start ./bin/www

比如我操作项目时的基本操作：

cd /home/blog/blog-node
pm2 start ./bin/www // 开启
pm2 stop ./bin/www // 关闭
pm2 list //查看所用已启动项目：

3.7 页面加载优化

再看刚刚的 nginx 的一些配置：

server {
   
        gzip on;
        gzip_buffers 32 4k;
        gzip_comp_level 6;
        gzip_min_length 200;
        gzip_types text/css text/xml application/javascript;
        gzip_vary on;
    }

这个就是利用 ngonx 开启 gzip，亲测开启之后,压缩了接近 2/3 的文件大小，本来要 1M 多的文件，开启压缩之后，变成了 300k 左右。

做完一系列的优化处理之后，在网络正常的情况下，页面首屏渲染由本来是接近 5 秒，变成了 3 秒内，首屏渲染之前的 loading 在 1 秒内可见了。

如何将node+mongodb项目部署在阿里云服务器，并进行性能优化的

1. 流程

2. 内容细节

2.1 开发好前端与后端程序

2.2 购买服务器与域名

3. 服务器上安装所需环境（本项目是 node 和 mongodb ）

3.1 登录服务器

3.2 安装 node

3.2 安装 mongodb

3.3 服务器上开放端口与设置安全组规则

3.4 用 nginx、apache 或者 tomcat 来提供 HTTP 服务或者设置代理

3.5 上传项目代码，或者用码云、 gihub 来拉取你的代码到服务器上

3.6 启动 express 服务

3.7 页面加载优化

热门文章

最新文章

相关课程

相关电子书

相关实验场景

推荐镜像

热门

活动广场

任务中心

开发者评测

高校计划

乘风者计划

训练营

阿里云MVP

话题

直播

下载

镜像站

技术资料

插件

如何将node+mongodb项目部署在阿里云服务器，并进行性能优化的

1. 流程

2. 内容细节

2.1 开发好前端与后端程序

2.2 购买服务器与域名

3. 服务器上安装所需环境（本项目是 node 和 mongodb ）

3.1 登录服务器

3.2 安装 node

3.2 安装 mongodb

3.3 服务器上开放端口与设置安全组规则

3.4 用 nginx、apache 或者 tomcat 来提供 HTTP 服务或者设置代理

3.5 上传项目代码，或者用码云、 gihub 来拉取你的代码到服务器上

3.6 启动 express 服务

3.7 页面加载优化

热门文章

最新文章

相关课程

相关电子书

相关实验场景

推荐镜像