如何将本身的网站部署到阿里云的服务器

时间 2019-11-17

原文原文链接

购买阿里云服务器（安装ubuntu16.04系统）

登录阿里云官网阿里云官网购买服务器，普通的预装ubuntu16.04系统便可，通常1核1GB带宽1Mbps的QPS可达1~3万,足够平常使用。在购买前须要填服务器的开机密码，用户名默认为root.固然也能够选择不填密码，买好以后修改。 javascript

购买域名并填写域名模板解析域名

首先至万维网选购域名
购买域名解析
阿里云控制台填写域名模板并解析购买的域名，具体操做见云解析帮助文档
好比说咱们购买的域名是eljin.xyz,解析到你购买的服务器的ip地址，若是你的网站访问地址为www.eljin.xyz, 则须要在域名解析页面添加一条A记录，具体如图

接下来进入备案流程，详情见备案系统（阿里云备案比较繁琐，可是速度比较快，通常10天左右就能够收到审核经过的结果）
最后备案经过审核后便可经过域名访问咱们的网站了，固然，你得先把本身的项目跑在本身的服务器上的某个端口而且监听该端口

配置购买服务器的环境(ubuntu16.04)

经过服务器的默认帐号root和购买服务器填写的密码登录服务器，这里我推荐windows系统下使用xshell或者git bash，mac或者linux使用自带的终端登录工具便可,ssh初始默认登录端口为22html

ssh root@ip 输入密码便可登录前端

添加我的经常使用帐户fizz

adduser fizzjava

接下来会提示输入你的一些信息，这时候已经添加了我的普通帐户，由于咱们在部署项目时候常常会遇到一些权限问题，因此咱们须要一个拥有sudo权限的帐户，须要给该用户升级权限node

sudo gpasswd -a fizz sudo // 将用户添加到sudo权限组linux

接下来打开/etc/sudoers文件，gedit或者vim都行，这里直接用vim打开，在# Use privilege specification添加fizz ALL=(ALL:ALL) ALL，意思是fizz的全部权限为超级管理员全部的命令对于fizz用户都适用；webpack

sudo visudo 或者 sudo vim /etc/sudoersnginx

注：vim打开的按esc，wq!强制保存， sudo visudo的crtl+X、shift+Y、Enter 依次按下便可保存生效；退出服务器，使用你建立的帐号登录就能够啦，试试 sudo mkdir fizz

本地配置无密码登录服务器

配置无密码登录，无非就是在服务器与本地创建一个相互信任的机制，即本地的公钥须要被服务器承认，所以须要把本地的ssh公钥放到服务器的.ssh文件夹的authorized_keys文件中便可；本身电脑本地通常建立了公钥（若是你使用过github的话），所以须要在新买的服务器上而且是你本身刚建立的帐户上建立.ssh文件并生成公钥和私钥；git

ssh fizz@ipgithub

ls -a看看有没有.ssh文件夹，没有的话sudo mkdir .ssh建立.ssh文件夹；而后生成公钥和私钥；

sudo ssh-keygen -t rsa

注意，通常此时会出现Enter file in which to save the key (/root/.ssh/id_rsa):问你公钥和私钥保存在哪里，你须要填的路径为你刚建立的用户下面，默认是在root帐户下，此时你须要在后面打你帐户的路径：Enter file in which to save the key (/root/.ssh/id_rsa):/home/fizz/.ssh/id_rsa，即建立好了密钥对。继续建立本地公钥保存在服务器上.ssh文件夹中的文件authorized_keys;

sudo vim authorized_keys

复制本地的公钥至服务器的authorized_keys文件中便可，而且给authorized_keys添加可读可写权限(至少是600)sudo chmod +rw authorized_keys退出服务器从新输入ssh fizz@ip不须要输入密码便可登录。

本地修改ssh登录服务器端口

ssh默认的登录端口为22，为了稍微增长那么点安全性，能够修改下ssh登录端口成本身定义的端口，范围在0~65535(2^16-1)以内，最好在1000以上的，所以1000之内的不少端口都是某些服务的运行端口，这里定义为10086:

sudo vim /etc/ssh/sshd_config

改为 Port 10086便可
注意：修改端口保存以后，重启ssh服务 sudo service restart ssh;切记不要直接退出本窗口，再新开一个终端窗口试试能不能登录：

ssh -p 10086 fizz@ip

若是能够，说明端口修改为功，不然若是修改错误直接退出了，那么服务器就登不上了！！！

本地添加快捷登录服务器脚本

这里针的是对使用Mac系统或者Linux系统的操做:

Mac系统(没装zsh)

sudo vim .bash_profile

Mac系统(安装了zsh)

sudo vim .zshrc

Linux系统

sudo vim .bashrc

在下面添加: alias fizz="ssh -p 10086 fizz@ip"，在终端只需输入别名： fizz 便可登陆服务器。

服务器主动开启防火墙ufw和主动防护fail2ban

这一章节主要为了增长服务器的安全性，涉及到运维方面的东西，通常能够作到拦截屡次频繁的恶意请求攻击，形成服务器堵塞；只开放某些端口；过滤某些信息等，主要是配置防火墙的规则文件iptables.up.rules，这一节对于初学者部署本身的项目不是必须的，所以能够跳过。固然，我本身也是菜鸟哈哈哈哈😁

防火墙具体配置见；防火墙配置规则
fail2ban安装与使用配置见如何在Ubuntu 14.04上使用Fail2Ban保护Nginx服务器

服务器安装代理服务器nginx

Nginx官方介绍

Nginx是一款轻量级的HTTP服务器，采用事件驱动的异步非阻塞处理方式框架，这让其具备极好的IO性能，时经常使用于服务端的反向代理和负载均衡

安装过程

sudo apt-get update && sudo apt-get upgrade // 更升级新ubuntu软件安装源
sudo apt-get install nginx // 安装nginx
sudo service nginx start // 启动nginx服务

此时，nginx已经在你的服务器上跑起来了,关于nginx具体的使用操做和配置参数的意义，这里推荐一个教程写得很好，想了解的猛戳一个前端必会的 Nginx免费教程， nginx安装了解完以后，能够开始把你的项目部署到服务器上了！！！

在Nginx上部署静态网站项目

部署一个静态项目很简单，只须要配置相关配置文件载入重启nginx服务器便可

首先登录服务器ssh -p 10086 fizz@ip
进入nginx的代理配置文件中，cd /etc/nginx/conf.d；
建立本身的配置文件，命名本身定义，本人习惯是 网站域名_运行端口.conf，好比个人网站域名为 fizz.com，而且运行在80端口 => fizz_80.conf；配置详情以下：

这样配置不管是输入域名仍是ip地址，均可以直接访问到 ~/www/static下面的 index.html文件了,注意配置完成了须要检查配置是否正确并从新载入启动nginx服务

sudo nginx -t // 检查配置文件是否符合规则
sudo nginx -s reload // 从新载入配置文件
sudo service nginx restart // 重启nginx服务

固然，你得在你本身的目录下有/www/static/index.html这个文件

cd ~
mkdir www
mkdir static
touch index.html

echo "<!doctype html><head><meta http-equiv="Content-Type"content="text/html; charset=utf-8" /></head><body><p>恭喜你，部署静态项目成功啦~~~</p></body></html>" > index.html => 将内容写入至index.html文件中

在你的浏览器输入你的服务器ip或域名试试，大功告成！！！

在Nginx上布置webpack打包后的前端项目

这个部署流程跟部署静态项目同样，webpack打包编译好线上环境的项目www以后，压缩成tar包，经过scp命令上传至服务器，解压，在conf.d文件夹中配置相应的webfront_fizz_80.conf文件便可，例如：

tar -czvf www.tar.gz www/ // 打包压缩前端项目www
scp -P 10086 www.tar.gz fizz@ip:~/webfront/static // 上传至服务器
ssh -p 10086 fizz@ip // 登陆服务器
cd ~/webfront/static // 进入存放的文件夹
tar -xzvf www.tar.gz // 解压缩
sudo chmod +r www // 给项目目录增长访问权限

{
    listen 80;
    server_name webfront.fizz.com;
    location / {
        root /home/fizz/webfront/static/www;
        index index.html index.htm
    }
}
复制代码

大功告成！！！

在Nginx上布置nodejs后台项目

首先得配置nodejs环境

安装必要的软件

sudo apt-get install wget curl git

因为nodejs版本不一样，其功能支持方面也不同，不一样项目可能使用的是不一样的nodejs版本，这时候须要使用nvm去管理nodejs的版本，方便在不一样版本之间切换，须要安装nvm,安装见 Github地址
安装nvm

wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh | bash

安装完成以后记得重开一个terminal窗口，登陆服务器,能够查看nvm版本了

nvm --version

安装node

nvm install v7.8.0 // 安装7.8.0版本的nodejs
nvm alias default 7.8.0 // 将7.8.0版本nodejs做为默认nodejs版本
nvm use 7.8.0 // 使用7.8.0版本nodejs做为当前nodejs版本

到这里，nodejs环境安装好了

配置nginx的conf文件

这里为了方便，咱们将如下的nodejs后台程序部署至服务器

// app.js
const http = require('http');
http.createServer(function(req, res){
    res.writeHead(200, {"Content-Type":"text/html;charset=utf-8"});
    res.end("欢迎访问个人第一个nodejs项目😀")
}).listen(8100, () => console.log("服务已经在8100端口启动")
复制代码

接下来有两种方式来维护nodejs项目
- 上传nodesj项目至github/码云托管，保持服务器上的项目与github该项目同步，实现一键更新部署
- 本身利用scp命令把项目上传至服务器覆盖更新原项目
二者都须要守护nodejs项目跑在8100端口的进程,这里咱们借助PM2来守护nodejs进程。
一键部署更新
在须要部署的项目中配置ecosystem.json文件，具体配置教程见PM2项目配置教程，具体同步上传教程见PM2项目发布教程；发布成功以后，每次须要与github项目同步更新的话，能够到服务器项目的文件夹中运行：
```
git pull
pm2 restart app.js || pm2 restart AppID /*node项目的启动ID*/
复制代码
```
scp命令上传项目覆盖掉原项目，pm2 start app.js便可

Nginx配置文件

Nginx须要监听客户端的网络请求（通常为80端口），而后将请求转发到服务器（本地）的项目所占用的端口，最后项目接收到请求从而进行响应。基本配置文件以下：

server {
      listen 80;
      server_name 你的域名;  #客户端访问的域名，若是有多个，用逗号分开
  
      location / {
          proxy_pass http://127.0.0.1：8100;  #映射到代理服务器（本地)ip和端口
          proxy_set_header Host $http_host;
          proxy_set_header X-Real-IP $remote_addr;
          proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
          Proxy_redirect off;
     }
  }
复制代码

从新载入nginx配置文件生效，重启nginx服务便可。最后，整个部署过程结束，这时候访问已经备案好的域名，便可访问到本身部署的nodejs项目了！！！

如何将本身的网站部署到阿里云的服务器

购买阿里云服务器（安装ubuntu16.04系统）

购买域名并填写域名模板解析域名

配置购买服务器的环境(ubuntu16.04)

添加我的经常使用帐户fizz

本地配置无密码登录服务器

本地修改ssh登录服务器端口

本地添加快捷登录服务器脚本

服务器主动开启防火墙ufw和主动防护fail2ban

服务器安装代理服务器nginx

Nginx官方介绍

安装过程

在Nginx上部署静态网站项目

在Nginx上布置webpack打包后的前端项目

在Nginx上布置nodejs后台项目

首先得配置nodejs环境

配置nginx的conf文件

接下来有两种方式来维护nodejs项目

上传nodesj项目至`github/码云`托管，保持服务器上的项目与github该项目同步，实现一键更新部署

本身利用`scp`命令把项目上传至服务器覆盖更新原项目

一键部署更新

`scp`命令上传项目覆盖掉原项目，`pm2 start app.js`便可

Nginx配置文件

如何将本身的网站部署到阿里云的服务器

购买阿里云服务器（安装ubuntu16.04系统）

购买域名并填写域名模板解析域名

配置购买服务器的环境(ubuntu16.04)

添加我的经常使用帐户fizz

本地配置无密码登录服务器

本地修改ssh登录服务器端口

本地添加快捷登录服务器脚本

服务器主动开启防火墙ufw和主动防护fail2ban

服务器安装代理服务器nginx

Nginx官方介绍

安装过程

在Nginx上部署静态网站项目

在Nginx上布置webpack打包后的前端项目

在Nginx上布置nodejs后台项目

首先得配置nodejs环境

配置nginx的conf文件

接下来有两种方式来维护nodejs项目

上传nodesj项目至github/码云托管，保持服务器上的项目与github该项目同步，实现一键更新部署

本身利用scp命令把项目上传至服务器覆盖更新原项目

一键部署更新

scp命令上传项目覆盖掉原项目，pm2 start app.js便可

Nginx配置文件

上传nodesj项目至`github/码云`托管，保持服务器上的项目与github该项目同步，实现一键更新部署

本身利用`scp`命令把项目上传至服务器覆盖更新原项目

`scp`命令上传项目覆盖掉原项目，`pm2 start app.js`便可