从0到1:阿里云服务器部署web项目全过程


我们在本地编写完Node.js项目,需要将文件打包上传到云服务器,其他人才可以通过url地址来访问和浏览我们编写的程序,在申请、配置阿里云ECS服务器的时候也是踩坑无数,看了网上很多大神的文章,自己也尝试汇总整理了一下,文中涵盖的知识点比较多,大概包含如下几个方面:

  • 申请阿里云免费服务器
  • 安装node.js
  • 安装Nginx服务器
  • 安装mongoDB数据库
  • 安装pm2进程管理工具
  • 安装本地FTP
  • 上线移动端项目

之前还写过一篇《阿里云服务器崩溃自救指南》,如果在本地误删了某些文件导致服务器崩溃,可以参考我总结的步骤尝试恢复一下。

注:本人使用的是MacOS系统,如果是windows环境,文中的部分操作会有所不同。

申请阿里云免费服务器

注册阿里云账号

在首页选择你的登录方式,可以通过阿里旗下的第三方服务登录。

image

这里我使用支付宝登陆,扫码进入页面后点击授权即可。

image

如果没有阿里云账号的话,可以输入会员名和手机号码进行快速注册。

image

注册之后进入到ECS管理控制台页面

image

在最新活动中找到新手上路,我们可以申请阿里云免费套餐,试用时长为一个月。

image
image

个人实名认证

选择个人版,申请之前需要进行个人实名认证

image

点击个人实名认证链接进入实名认证页面,选择个人实名认证

image

推荐个人支付宝授权认证,跳转页面后输入家庭住址就可以完成认证了。

image

申请阿里云免费服务器

认证完成后点击立即抢购按钮申请免费云服务器

image

点击免费领取按钮,选择Centos/ 7.6 64位操作系统。

image
勾选同意协议,点击立即领取按钮,即可领取成功。

image

此时再进入管理控制台页面就可以看到有一台云服务器正在运行

image

重置实例密码

在更多中找到重置实例密码,点击设置密码。

image

该密码不是你的阿里云账号登录密码,而是你的云服务器访问密码,必须由大写字母、小写字母、数字、特殊符号中的三项构成。

image

重启实例

重置实例之后,点击右上角重启实例。

image

在弹出的页面中点击确定按钮

image

重启实例之后会显示停止中状态,大概需要等待30秒。

image

配置安全组

在侧边栏网络与安全中找到安全组,点击右边的配置规则

image

端口范围填入:1/60000,为了使用更多服务,如果这个端口范围填的太小了,像mongodb这种27017端口的数据库就无法安装。授权对象为0.0.0.0/0,为了让所有端口都可以访问。

image

点击确定保存,就可以在页面中看到我们配置好的安全组。

image

远程连接

可以使用它自带的远程连接,连接服务器。

image

点击远程连接,系统会给你提供一个密码用于远程连接你的云服务器,该密码只出现一次,出现的时候需要记录下来。

image

在远程连接中用户名为:root,点击回车输入之前重置过的实例访问密码(默认输入密码的时候是不显示的,输入完成后点击回车即可)。

image

但是我们一般不推荐在远程连接中访问服务器,原因是:如果超过一分钟没有操作就会自动断开连接,需要重新输入远程连接密码,比较繁琐。而且在它的控制台中无法复制粘贴指令,只能通过其窗口右上角的复制命令输入来操作,比较麻烦。

image

我们可以在本地终端cmd中通过ssh命令来访问云服务器

git ssh root@39.96.84.220(你的公网IP)

可以在实例的配置信息中找到公网IP

image

连接成功后运行查看文件命令:

cd /
ls
image

安装node.js

运行yum命令在云服务器上安装Node.js

sudo yum install nodejs

安装成功后显示完毕,运行node -v查看版本号:

image

安装Nginx服务器(静态服务器)

具体操作步骤出自这篇文章:

《CentOS 7 下安装 Nginx》

https://www.linuxidc.com/Linux/2016-09/134907.htm

Nginx是一款自由的、开源的、高性能的HTTP服务器和反向代理服务器;同时也是一个IMAP、POP3、SMTP代理服务器;Nginx可以作为一个HTTP服务器进行网站的发布处理,另外Nginx可以作为反向代理进行负载均衡的实现。

1. gcc 安装

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

yum install gcc-c++

安装成功:

image

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

安装成功:

image

3. zlib 安装

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

yum install -y zlib zlib-devel

安装成功:

image

**3. **OpenSSL 安装

OpenSSL 是一个强大的安全套接字层密码库,囊括主要的密码算法、常用的密钥和证书封装管理功能及 SSL 协议,并提供丰富的应用程序供测试或其它目的使用。
nginx 不仅支持 http 协议,还支持 https(即在ssl协议上传输http),所以需要在 Centos 安装 OpenSSL 库。

yum install -y openssl openssl-devel

安装成功:

image

4.下载nginx安装包

(1)第一种方式:直接下载.tar.gz安装包,nginx官网地址:https://nginx.org/en/download.html

image

(2)第二种方式(推荐):使用wget命令下载

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

我下载的是1.10.1版本,这个是目前的稳定版。

image

5. 解压

依然是直接命令:

tar -zxvf nginx-1.10.1.tar.gz
cd nginx-1.10.1

6. 配置

在 nginx-1.10.1 版本中你就不需要去配置相关东西,使用默认配置就可以了。

./configure

7. 编译安装

make
make install

查找安装路径:

whereis nginx
image

8. 启动、停止、重启nginx

cd /usr/local/nginx/sbin/
./nginx 

查询nginx进程:

ps aux|grep nginx
image

启动成功后,在浏览器可以看到这样的页面:

image

./nginx -s stop:此方式相当于先查出nginx进程id再使用kill命令强制杀掉进程。
./nginx -s quit:此方式停止步骤是待nginx进程处理任务完毕进行停止。

重启nginx

(1)第一种方式:先停止再启动(推荐):
对 nginx 进行重启相当于先停止再启动,即先执行停止命令再执行启动命令。如下:

./nginx -s quit
./nginx

(2)第二种方式:重新加载配置文件:
当 nginx的配置文件 nginx.conf 修改后,要想让配置生效需要重启 nginx,使用-s reload不用先停止 ngin x再启动 nginx 即可将配置信息在 nginx 中生效,如下:

./nginx -s reload

9. 开机自启动

即在rc.local增加启动代码就可以了。

vi /etc/rc.local

输入字母i出现—INSERT—,按键盘上下键控制光标

image

将如下代码复制粘贴

/usr/local/nginx/sbin/nginx

按esc键退出,输入强制保存退出命令:

:wq!

到这里,nginx就安装完毕了,启动、停止、重启、开机自启动操作也都完成了。

image

安装mongoDB数据库

具体操作步骤出自这篇文章:

《centos7安装MongoDB3.4》

https://www.cnblogs.com/web424/p/6928992.html

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

1. 创建yum源文件

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

2. 添加以下内容

[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 

字母i代表INSERT写入

image

复制上面内容粘贴后按esc,输入

:(冒号)wq!(感叹号)
image

强制保存并退出

image

3. 安装MongoDB

安装命令:

yum -y install mongodb-org

安装完成后显示:

image

4. 安装完成后,查看mongo安装位置

whereis mongod
image

查看修改配置文件 的命令是:vim /etc/mongod.conf

5. 启动mongodb

systemctl start mongod.service

顺便说一下停止mongodb的命令是 :systemctl stop mongod.service

6. 查看mongodb的状态

systemctl status mongod.service

显示active(running)说明已经成功开启。

image

7. 停止防火墙

CentOS 7.0默认使用的是firewall作为防火墙,这里改为iptables防火墙。

外网访问需要关闭firewall防火墙:

systemctl stop firewalld.service

8. 禁止防火墙开机启动

systemctl disable firewalld.service

9. 设置开机启动

systemctl enable mongod.service
img

10. 启动Mongo shell查看数据库

执行完以上操作步骤后输入命令:mongo,查看数据库show dbs

image

11. 设置mongodb远程访问

设置完之后可以在本地连接数据库

输入

vim /etc/mongod.conf

编辑mongod.conf配置文件,找到bindIP,在前面按i输入#注释掉这一行,输入:wq!保存退出。

image

12. 重启mongodb

systemctl restart mongod.service
image

安装pm2进程管理工具

PM2是node进程管理工具,可以利用它来简化很多node应用管理的繁琐任务,如性能监控、自动重启、负载均衡等。

当我们在服务器中启动node服务时如果直接通过npm start或者node index.js启动,则一旦退出ssh远程登录,或者在本地关闭终端则服务就会停止运行,所以我们要安装pm2这个node进程管理工具,通过pm2 start来开启进程就不会出现这个问题了。

全局安装命令:

npm install -g pm2
image

安装成功后运行pm2 list查看所有进程状态

image

安装本地FTP

这里推荐使用FileZilla,这是一款免费、开源、跨平台的FTP软件,mac系统windows系统的用户都可以放心食用。这里我们使用SFTP连接,端口号默认值是22.

image

连接成功后会列出root下的目录

image

上线移动端项目

1. 修改项目配置文件

找到项目的Vue-config.js配置文件,在module.exports中将publicPath: 改为:'/v-douban/'。

image

同时本地请求数据的路径也需要加上/v-douban

image

2. 打包文件

执行yarn build将项目打包成dist文件包

3. 连接FTP服务器,修改nginx

进入/usr/local/nginx/conf目录,传输nginx.config文件到本地。

image

修改nginx.config文件,配置数据接口代理。

location /api/db {
            proxy_pass http://47.96.0.211:9000/db;
        } 

        location /data/my {
            proxy_pass http://118.31.109.254:8088/my;
        } 

        location /douban/my {
            proxy_pass http://47.111.166.60:9000/my;
        } 

上传新的nginx.config文件到服务器,覆盖原文件。

image

在终端连接数据库,并且重启nginx服务器。

./nginx -s reload
image

进入/usr/local/nginx/html目录创建一个v-douban文件夹

image

将打包后的dist文件夹中的所有文件上传到服务器

image

传输完成后,即可在网页中访问上线项目http://39.96.84.220/v-douban

image

线上浏览效果:

image
image
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 157,198评论 4 359
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 66,663评论 1 290
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 106,985评论 0 237
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,673评论 0 202
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 51,994评论 3 285
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,399评论 1 211
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,717评论 2 310
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,407评论 0 194
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,112评论 1 239
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,371评论 2 241
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 31,891评论 1 256
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,255评论 2 250
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,881评论 3 233
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,010评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,764评论 0 192
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,412评论 2 269
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,299评论 2 260

推荐阅读更多精彩内容