前端项目线上环境搭建(Nginx)和线上部署(推荐)

---

远程连接

1. 阿里云等服务器网页自带的 ， 输入远程连接密码

2.通过ssh客户端连接(推荐)

由于我用的Mac，所以我就用Termius演示吧，windows的话推荐putty等ssh工具，搜索关键词windows常用ssh

如图上只需要address(公网ip)和**port(**ssh端口号)，这里有必要声明一下：

1. 云服务器回默认22为ssh端口号

2. 共享云主机分配给你ip一般就是ssh端口号

连接成功后如下：

安装node

如何从EPEL库安装Node.js

另一个有效且简单的方法来安装Node.js就是从官方库。这同样确保您可以访问到EPEL库，

你可以通过运行以下命令。

sudo yum install epel-release

现在可以使用yum命令安装Node.js了。

sudo yum install nodejs

因为在开发过程中我需要管理节点包，我还要安装新公共管理的软件包管理器，

使用以下命令。

sudo yum install npm

whereis node

三条安装命令， 中间有提示yes/no的一律按y,带宽小的耐心等待安装

安装成功后执行where is node 如下，表明已经安装成功

---

配置安全组

云服务器的话可以配置，云主机的话一般不给配置，这个根据需求来配置，一般我都是配置

1. 端口范围 1/60000

2. 授权对象： 0.0.0.0/0

我不建议大家这样配置 ，安全组顾名思义为了安全，所以端口应该开放的越少越好，例如你要用8080端口那么给个8080就好了

当然也有的是给你配置防火墙的，如果你的端口不能用，请查看安全组或者防火墙有没有打开你要用的端口

这里的演示暂且跳过，上图大家想必能看懂，就是配置了几个端口。

---

测试是否可用

我们测试上传一个server.js看看，先做如下准备工作：

文件上传的话我们推荐xftp或者xshell等ftp工具

我用FileZilla演示，界面都差不多的，首先我们连接到服务器：

这个就是协议不对了，我们修改下连接协议

修改成sftp协议后点击连接

如上连接成功！

既然连接成功那我们写个简单的接口：

// 导入http模块:

var http = require(‘http’);

// 创建http server，并传入回调函数:

var server = http.createServer(function (request, response) {

// 回调函数接收request和response对象,

// 获得HTTP请求的method和url:

console.log(request.method + ': ’ + request.url);

// 将HTTP响应200写入response, 同时设置Content-Type: text/html:

response.writeHead(200, {‘Content-Type’: ‘text/html’});

// 将HTTP响应的HTML内容写入response:

response.end(‘Hello world!’);

});

// 让服务器监听8080端口:

server.listen(8089);

console.log(‘Server is running at http://127.0.0.1:8089/’);

这条接口本地可以运行，那么我们再用ftp工具上传到服务器

再用ssh工具运行

运行后我们打开站点，ip:端口，发现无法访问

这时我们去检测下端口号(http://coolaf.com/tool/port)的开放情况，发现如下图，22是开放的，8089是关闭的，这也就是为什么我们ssh和ftp能通过22端口连接，8089不能访问站点的原因了，那么我们就得打开端口了，方式前面提到过，就是安全组和防火墙，开启就行当然也可以通过命令打开，下面我用命令打开端口

---

命令行控制防火墙

//打开8000-9000端口，成功返回success

firewall-cmd --zone=public --add-port=8000-9000/udp --permanen

//打开8089端口，成功返回success

firewall-cmd --zone=public --add-port=8089/tcp --permanent

//重启防火墙，成功返回success

firewall-cmd --reload

//检测是否打开端口，成功打开返回yes

firewall-cmd --zone=public --query-port=8089/tcp

执行了上述操作后，可以看到已经可以访问了

---

添加负载均衡（pm2）

你看我们是启动了这个测试案例，可是如果服务器重启，那么案例就直接结束了，这是相当不对的。所以我们需要负载均衡，即用就挂起服务。

npm i pm2 -g 全局安装pm2

pm2 start app.js 后台挂起服务

pm2 list 查看后台挂起所有服务

pm2 stop id 根据服务id 停止当前服务

pm2 delete id 根据服务 id 删除当前服务

pm2 restart id 重启服务

安装后报错，是node和npm的版本问题，解决方法就是升级版本，但实现的办法不止一种，下面为其一：

执行下面的 命令

sudo npm install -g n

最新版本

n lastest

稳定版本

n stable

安装指定版本

n 10.12.0

执行pm2 list，如下说明成功

pm2安装好了，我们再来通过pm2启动测试案例：

pm2 start后再执行两条命令

使用pm2 start （启动服务) — 上面我们执行了

执行pm2 save (保存当前已经启动了的服务)

执行pm2 startup (设置开机自启的配置)

设置开机自启成功！重启服务器看下，loading…启动成功！

pm2开机自启到此已经成功了！

---

安装MongoDB

MongoDB 是一个介于关系数据库和非关系数据库之间的产品，是非关系数据库当中功能最丰富，最像关系数据库的。他支持的数据结构非常松散，是类似json的bson格式，因此可以存储比较复杂的数据类型。Mongo最大的特点是他支持的查询语言非常强大，其语法有点类似于面向对象的查询语言，几乎可以实现类似关系数据库单表查询的绝大部分功能，而且还支持对数据建立索引。

Packages包说明

MongoDB官方源中包含以下几个依赖包：

mongodb-org: MongoDB元数据包，安装时自动安装下面四个组件包：

1.mongodb-org-server: 包含MongoDB守护进程和相关的配置和初始化脚本。

2.mongodb-org-mongos: 包含mongos的守护进程。

3.mongodb-org-shell: 包含mongo shell。

4.mongodb-org-tools: 包含MongoDB的工具： mongoimport, bsondump, mongodump, mongoexport, mongofiles, mongooplog, mongoperf, mongorestore, mongostat, and mongotop。

安装mongodb过程中注意以下几个知识点

1. vim命令基本使用

2. vim a.txt

3. 先按键盘的 i

4. 写入内容 （shift + ins）

5. 退出 先按 ESC 键

6. 再打 : wq 会出即可保存并退出

7. 注意点： 防火墙忽略

1.配置MongoDB的yum源

创建yum源文件：

vi /etc/yum.repos.d/mongodb-org-3.4.repo

添加以下内容：

[mongodb-org-3.4]

name=MongoDB Repository

baseurl=https://repo.mongodb.org/yum/redhat/$releasever/mongodb-org/3.4/x86_64/

gpgcheck=1

enabled=1

gpgkey=https://www.mongodb.org/static/pgp/server-3.4.asc

这里可以修改 gpgcheck=0, 省去gpg验证

安装之前先更新所有包 ：yum update （可选操作）

2.安装mongodb

安装命令

yum -y install mongodb-org

安装完成后

查看mongo安装位置 whereis mongod

查看修改配置文件 ： vim /etc/mongod.conf

3.启动MongoDB

启动mongodb ：systemctl start mongod.service

停止mongodb ：systemctl stop mongod.service

查到mongodb的状态：systemctl status mongod.service

4.设置开机启动

设置开机启动 ：systemctl enable mongod.service

5.启动mongodb

启动：mongo shell

6.设置mongodb远程访问

注意先打开27017端口，前面有讲怎么打开

重启mongodb：systemctl restart mongod.service

---

nginx安装 /配置

Nginx 是 C语言 开发，建议在 Linux 上运行，当然，也可以安装 Windows 版本，本篇则使用 [CentOS]( ) 7 作为安装环境。

1.gcc 安装

安装 nginx 需要先将官网下载的源码进行编译，编译依赖 gcc 环境，如果没有 gcc 环境，则需要安装：

yum install gcc-c++

2.PCRE pcre-devel 安装

PCRE(Perl Compatible Regular Expressions) 是一个Perl库，包括 perl 兼容的正则表达式库。nginx 的 http 模块使用 pcre 来解析正则表达式，所以需要在 linux 上安装 pcre 库，pcre-devel 是使用 pcre 开发的一个二次开发库。nginx也需要此库。命令：

yum install -y pcre pcre-devel

3.zlib 安装

zlib 库提供了很多种压缩和解压缩的方式， nginx 使用 zlib 对 http 包的内容进行 gzip ，所以需要在 Centos 上安装 zlib 库。

yum install -y zlib zlib-devel

4.OpenSSL 安装

OpenSSL 是一个强大的安全套接字层密码库，囊括主要的密码算法、常用的密钥和证书封装管理功能及 SSL 协议，并提供丰富的应用程序供测试或其它目的使用。

nginx 不仅支持 http 协议，还支持 https（即在ssl协议上传输http），所以需要在 Centos 安装 OpenSSL 库**。**

yum install -y openssl openssl-devel

5.下载nginx

官网下载https://nginx.org/en/download.html

使用`wget`命令下载：

wget -c https://nginx.org/download/nginx-1.10.1.tar.gz

两种方式下哪个版本看自己需求，尽量用稳定版。

6.解压：

tar -zxvf nginx-1.10.1.tar.gz

cd nginx-1.10.1

7.配置：

其实在 nginx-1.10.1 版本中你就不需要去配置相关东西，默认就可以了。当然，如果你要自己配置目录也是可以的。

1.使用默认配置

./configure

2.自定义配置（不推荐）

./configure \

–prefix=/usr/local/nginx \

–conf-path=/usr/local/nginx/conf/nginx.conf \

–pid-path=/usr/local/nginx/conf/nginx.pid \

–lock-path=/var/lock/nginx.lock \

–error-log-path=/var/log/nginx/error.log \

–http-log-path=/var/log/nginx/access.log \

–with-http_gzip_static_module \

–http-client-body-temp-path=/var/temp/nginx/client \

–http-proxy-temp-path=/var/temp/nginx/proxy \

–http-fastcgi-temp-path=/var/temp/nginx/fastcgi \

–http-uwsgi-temp-path=/var/temp/nginx/uwsgi \

–http-scgi-temp-path=/var/temp/nginx/scgi

注：将临时文件目录指定为/var/temp/nginx，需要在/var下创建temp及nginx目录

3.配置https支持的ssl模块

./configure --prefix=/usr/local/nginx --with-http_ssl_module

8.编译安装

make

make install

9.查找安装路径

whereis nginx

10.启动、停止nginx

cd /usr/local/nginx/sbin/

./nginx

./nginx -s stop

./nginx -s quit

./nginx -s reload

`./nginx -s quit`:此方式停止步骤是待nginx进程处理任务完毕进行停止。

`./nginx -s stop`:此方式相当于先查出nginx进程id再使用kill命令强制杀掉进程

查询nginx进程：

ps aux|grep nginx

11.重启 nginx

最后

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！不论你是刚入门Android开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！
nginx -s quit

./nginx -s reload

`./nginx -s quit`:此方式停止步骤是待nginx进程处理任务完毕进行停止。

`./nginx -s stop`:此方式相当于先查出nginx进程id再使用kill命令强制杀掉进程

查询nginx进程：

ps aux|grep nginx

11.重启 nginx

最后

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

[外链图片转存中…(img-Zi9tmHFL-1715135237680)]

[外链图片转存中…(img-r1TEEgBW-1715135237680)]

[外链图片转存中…(img-vV2sAVbH-1715135237681)]

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！不论你是刚入门Android开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！