服务端入坑——从建立自己的线上网站开始-白红宇

做前端两年了，对服务端所知甚少，一直想学习一些服务端的知识。学习了一些服务端语言后，我打算从自己建立一个线上网站开始自己的服务端实践之路。

思路

学习一门服务端语言和他的 Web 框架，我是做前端的，JavaScript 用的比较多，所以选择了 Node.js，框架选用了 Express。能在本地跑一个 “Hello World” 的页面就行。

买一个域名。我是在上买的，第一年 3.5 美刀。

购买一个云计算服务。通俗点说就是买一个云服务器，用来运行我们的代码。我选了 aws EC2，它有一个免费套餐，第一年基本不用花钱。

有了云计算服务我们就可以配置自己的虚拟主机了，通俗点讲就是装机。选择操作系统，安装基本的软件。

把我们的代码部署到我们的虚拟主机上，启动服务。

让我们可以使用域名来访问我们的虚拟主机。

让我们的网站可以用 https 来访问。

大家可能使用的 Web 框架，域名服务商和云计算服务商不一样，但上面的思路是通用的。

启动 EC2 实例

首先注册并登录 aws 账号，之后进到 EC2 服务的主页。像下面这样，点击红色区域的「Launch Instance」,开始建立实例。

点击后会进到选择主机模板的页面，我选的是 Ubuntu, 如下图。

点击后选择主机配置，默认选择免费的那一款，然后点击「Review and Launch」，如下。

点击「Lunch」。

点击后会弹窗提示让我们创建一对秘钥，后期当我们用 ssh 远程登录我们的主机时，我们需要这样一对秘钥作为登录凭证。选择「Create a new key pair」，对它进行命名，然后下载到本地保存好。做完这些后，在页面中点击「Lunch Instance」

设置安全策略和静态IP

现在我们的主机安全策略默认只接受 ssh 访问，我们需要开启 http 访问。另外，我们还需要给主机分配一个公网可以访问的静态IP。

首先进入到 EC2 的控制台，可以看到我们正在运行的实例。

注意左边侧栏的「Security Groups」和「Elastic IPs」。这两个选项分别对应「安全策略设置」和「静态 IP 设置」。上图中被选中的那个实例是我们刚刚创建的，向右滑动，可以查看到它正在使用的「Security Group」，点击进入到该「Security Group」的设置项。

点击上方「Action」按钮，选择「Edit Inbound Rules」,弹出图示弹框，点击「Add Rule」, Type 选择「All Traffic」，Source 选择「Anywhere」(这样做并不安全，但可以保证我们用各种方式都能访问到我们的主机，后期可以针对性的优化)。点击「Save」按钮保存。

进入「Elastic IPs」页面，点击「Allocate new address」，申请一个新的静态IP地址。

如图，申请成功后，我们需要将这个 IP 和我们的主机关联起来。选中我们创建的 IP, 点击上方「Actions」，点击「Associate address」。进入下面的页面。

按照提示选择我们要关联的主机，然后点击「Associate」。没意外的话我们的主机就有了它的公网静态IP。

使用 ssh 连接远程主机

ssh -i ~/.ssh/ubuntu_key_pair.pem ubuntu@3.16.85.11

注意，上面的命令中，-i 后面跟的是你的主机秘钥的路径。最后的中，3.16.856.11 是我们主机的静态 IP，ubuntu 是主机中的用户名。选择 ubuntu 系统作为主机模板的，默认是这个用户名。连接成功后如下图示

没有意外的话，你现在可以操作自己的主机了！?

安装 Nginx

ssh 连接到远程主机后，执行下列命令安装 Nginx。

sudo wget http://nginx.org/keys/nginx_signing.key

sudo apt-key add nginx_signing.key

wget 是 Linux 系统中下载文件的软件工具。apt 是 Linux 系统中的软件管理包。这一步大概是将 Nginx 的签名添加到 apt 的签名库中。防止安装时没有权限。

sudo nano /etc/apt/sources.list

将下面两行添加到文件底部。

deb http://nginx.org/packages/ubuntu xenial nginx

deb-src http://nginx.org/packages/ubuntu xenial nginx

source.list 文件记录了 apt 安装与更新软件的地址。这一步相当于告诉 apt 从哪里安装 Nginx。保存 source.list 文件，然后执行下面的命令

sudo apt-get update

sudo apt-get install nginx

这一步是安装 Nginx。

sudo service nginx start

这一步是启动 Nginx

关于在 Linux 下安装 Nginx 的更多内容可以参考

完成上面的操作后，在浏览器中访问我们的静态 IP，可以看到下面的页面。

使用域名访问网页

到这一步我们可以使用静态 IP 访问我们的网页了。但是在浏览器中输入 IP 地址来访问我们的网页一点都不酷。下面我们要让之前购买的域名派上用场。

进入到 aws Route 53 控制台。选择「Hosted zones」选项页

点击「Create Hosted Zone」

输入你的域名，点击「Create」。

点击「Create Record Set」。Name 栏不填，Value 填上 IP 地址。点击「Create」。然后会创建出入上图左边第一条，即主域名对应的 IP 地址。仔细看第二条，即 Type 为 NS 的那一条，里面 Value 中的4个地址就是我们主域名的DNS服务器地址。当我们在浏览器中输入主域名时，DNS服务就会去里面4个服务器去查询域名对应的 IP 地址。

另外，我用 Godaddy 购买域名时，域名服务商已经给这个域名指定了DNS服务器地址，需要到 DNS服务器地址改为图中对应的四个地址。如下图。

现在在浏览器中输入域名即可看到 Nginx 的欢迎页面。将Godaddy购买的域名与 aws EC2 主机关联，主要在于 DNS 服务器地址的关联。感兴趣的朋友可以看一下。

启用 HTTPS

如果你在 Chrome 浏览器中访问你的域名，他有可能会提示“此网站无法提供安全连接”，原因是 Chrome 强制用 HTTPS 访问所有的域名。现在市面上所有的网站都是 HTTPS 的，没有进行安全加密的已经很少了。我们可以通过下面简单的几步操作为自己的网站启用 HTTPS。 ssh 连接到远程主机后，执行下面一系列命令。

sudo apt-get update

sudo apt-get install software-properties-common

sudo add-apt-repository ppa:certbot/certbot

sudo apt-get update

sudo apt-get install python-certbot-nginx

上面这堆命令看起来很复杂，我也不是很明白。我简单的理解为安装 Cerbot 软件。

下面我们需要修改一下我们的 Nginx 配置。

sudo nano /etc/nginx/conf.d/default.conf

将「server_name」中的「localhost」替换成你的域名。像下面这样。

保存文件，然后执行下面的代码，域名换成你自己的域名：

sudo certbot --nginx -d zangjiabin.me

成功后，你就可以用 HTTPS 访问你的域名了

启动 Node.js 服务

最后，我们需要开始建立我们的 web 服务。

首先修改 Nginx 配置，像下面这样，将其中的4个域名换成你的域名。

server {

listen 80;

listen [::]:80;

server_name ;

return 301 https://$server_name$request_uri;

}

server {

listen 443 ssl http2 default_server;

listen [::]:443 ssl http2 default_server;

server_name ;

location / {

proxy_pass ;

}

ssl_certificate /etc/letsencrypt/live/zangjiabin.me/fullchain.pem;

ssl_certificate_key /etc/letsencrypt/live/zangjiabin.me/privkey.pem;

ssl_protocols TLSv1 TLSv1.1 TLSv1.2;

ssl_prefer_server_ciphers on;

ssl_ciphers EECDH+CHACHA20:EECDH+AES128:RSA+AES128:EECDH+AES256:RSA+AES256:EECDH+3DES:RSA+3DES:!MD5;

ssl_session_cache shared:SSL:5m;

ssl_session_timeout 1h;

add_header Strict-Transport-Security "max-age=15768000" always;

}

如图：

保存文件，然后重新启动 Nginx

sudo nginx -s reload

上面的配置文件，主要的意思是将所有的 HTTP 请求转为 HTTPS 请求，然后所有的请求最后都会被转发到本地的 localhost:3000 服务上。也就是说我们的 Web 服务最终将运行在 localhost:3000 上。

下面我们将在 loalhost:3000 上建立我们的 Web 服务。

执行下面两个操作建立我们的工作目录。

mkdir /home/ubuntu/app

cd /home/ubuntu/app

安装 Node.js 版本管理工具 nvm。

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.32.0/install.sh | bash

. ~/.nvm/nvm.sh

安装成功后，执行

nvm ls-remote --lts

查看最近的长期支持版本。然后安装该版本 Node.js

nvm install v8.12.0

执行下面的代码安装 express-generator 用来生成 express 应用。

npm install express-generator -g

Express 是基于 Node.js 开发的一款 Web 框架。执行下面的代码生成 Express 应用。

express myapp

cd myapp

npm install

npm run start

这样启动的服务有一个问题就是不能关闭当前的界面，一旦关闭服务就终止了，我们应该设法让 Node 服务在后台运行。

npm install forever -g

forever start bin/www

此时访问你的域名，会看到 Express 的默认页面

至此。你的网站就成功问世了！?

下一章我打算讲一下如何用 Express + MongoDB 写一个个人博客，如果有下一章的话。