前端部署服務器小結

在平時工做中對後臺有不少的疑惑，雖然先後端分離，可是也不能徹底不懂後端的知識，因此在很早以前就像寫一個全棧的項目，本身跑一跑，這樣會對整個網站的研發過程有一個新的理解。

我的博客呢，是一個功能明瞭，邏輯不是很複雜的小項目，很是適合用來練手。因而歷經三個月，從

node,到數據庫，到前端，邊學邊作，終因而搞出來了。

之因此作的這麼慢是怕所學的知識不紮實，因此看完node，看koa,看完koa看egg,由於egg是最新的庫，並且最近很火，因此就用egg.js了。

而後惡補linux的命令，發現數據庫的sql語句很是看不懂，因而就惡補mysql，又看了mongodb，最後決定用mongodb,由於語法簡直和js同樣。

前端使用的react,想法很簡單，由於工做中用的就是vue，已經很熟了，想再學學react,redux，學完redux之後對狀態管用有了新的認識，感受以前用的vuex簡直就是模棱兩可，

部署服務器讓我對linux命令的系統神祕感淡化了不少，其實只是入門的話，簡單的部署，安裝個nginx，git什麼的沒有那麼難，對於我這個非專業運維，徹底夠用了。

後臺用的

egg.js

數據庫用的

mongodb+mongoose

前端用的

react+react-router-dom+redux

服務器是用的 阿里雲的，同時也用了阿里雲的 oss對象存儲，以及域名，備案一套全都是阿里雲的，由於大品牌，值得信賴，並且備案反饋很是及時，兩天時間連拍照帶提交資料就已經提交通訊管理局了

系統選的 Ubuntu系統，配置固然是最便宜的，若是新註冊阿里雲的童鞋能夠領取新手上路里的無償使用6個月的服務器： free.aliyun.com/?spm=5176.8…

是一個很好的學習機會

用cmd連接服務器的方法

ssh root@你的IP地址複製代碼

部署前端代碼我用的Xshell5，用法很簡單。

後端代碼用的git push 再在服務器上拉取。

而後建立用戶，這些其實均可以省略，可是再真實項目中通常都不會用

root帳號進行操做，總會給各我的員相應的帳號

建立帳號

adduser username複製代碼

添加用戶到組

gpasswd -a username sudo複製代碼

用

cat查看文件

cat /etc/sudoers(這個文件是權限的配置文件)複製代碼

cd到這個文件夾，打開文件

vi sudoers複製代碼

而後將你的權限添加進來

# User privilege specification
root ALL=(ALL:ALL) ALL
username ALL=(ALL:ALL) ALL (在這裏添加)
複製代碼

接下來就能夠用這個帳號來登錄了

ssh username@39.106.133.41複製代碼

固然還有不少加強安全等級的方法

好比本地生成公鑰私鑰，把默認

22端口改成別的

本地生成公鑰和私鑰

ssh-keygen --help
cd ~/.ssh
ssh-keygen -t rsa -b 4096複製代碼

把本地的公鑰上傳到服務器受權文件中

vi ~/.ssh/authorized_keys
chmod 600 ~/.ssh/authorized_keys
sudo service ssh restart複製代碼

修改默認端口

vi /etc/ssh/sshd_configPort 2222        (在這裏修改端口)
AllowUsers usernamePermitRootLogin yes    (容許root帳號登錄，能夠改成no)
PasswordAuthentication yes  (容許帳號密碼登錄，能夠改成no)複製代碼

下次登錄就要指定端口了

ssh -p 2222 username@你的IP複製代碼

當你設置了公鑰之後，關閉了帳號密碼登錄以及 root帳號登錄，再把端口好改了，這樣安全上基本上已是目前爲止能作到的極限了。

配置完了接下來就是安裝軟件的時候了

更新軟件列表

sudo apt-get update複製代碼

安裝

wget curl git

sudo apt-get install wget curl git
複製代碼

安裝nvm(node的包管理工具，能夠下載多個node版本)

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh | bash複製代碼

裝好之後會提示應用腳本，運行它才能徹底的安裝完

source /root/.bashrc複製代碼

安裝node

nvm install node複製代碼

檢查是否安裝好了

node -v
npm -v
複製代碼

安裝

cnpm(用cnpm用慣了，感受npm下載太慢了)

npm i cnpm -g複製代碼

linux 遇到的坑

列出子文件

ls複製代碼

這裏加入-a能夠查看隱藏文件，好比vi的時候保存沒保存成功什麼的，能夠ls -a 查看到緩存文件，刪掉便可正常編輯

-l是查看時間的

ls  -al (查看隱藏問價以及列出最後編輯時間)複製代碼

vi編輯文件

首先要按一下i進入編輯模式

編輯完了按 esc退出編輯後:wq 保存

有時會碰見衝突，或者權限問題

權限問題在命令前面加上sudo就好

:q      //不保存文件退出
:q!     //不保存文件強制退出
:wq     //保存文件並退出
:wq!    //強制保存文件並退出
複製代碼

目錄下

ls -a能夠查看到未編輯完的文件，刪除 rm 文件名 rm -rf慎用（r遞歸f強制刪除）

mv移動文件或者重命名
複製代碼

若是你是普通node服務能夠下載pm2守護進程

開啓服務器

pm2 start app.js --name 'username'    //起個別名複製代碼

刪除服務

pm2 delete username複製代碼

最後部署完感受作的不是很順溜因而就重新的格式化了一下阿里雲

結果報錯

WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED!

是由於有公鑰執行

ssh-keygen -R 172.16.152.209複製代碼

Host 39.106.133.41 found: line 3複製代碼

證實刪了三個公鑰

從root啓動服務，再用nginx轉發nginx

Nginx是一個高性能的HTTP和反向代理服務器,也能夠新建端口

安裝

apt-get install nginx複製代碼

查看nginx狀態

service nginx configtest複製代碼

nginx配置文件全在/etc/nginx下

查看

cat nginx.conf複製代碼

配置服務代理

/etc/nginx/sites-enabled複製代碼

下新建文件

代理端口

upstream web{
    server 39.96.114.57:3000;
}
server {
    listen 80;
    server_name localhost;
    root /usr/share/nginx/html; // 文件存放位置
    index index.html index.htm; //文件優先級
    location / {
        proxy_pass http://web;
    }
}
複製代碼

nginx 新增端口

server {
        listen 8080;
        server_name 39.106.133.41;
        root /usr/share/nginx/blog;    (這裏是新建的文件夾)
        index index.html index.htm;
}複製代碼

配置服務器集羣

upstream webserver{
    server 39.106.133.41:8080;
    server 39.106.133.41:8090;
}
server {
    listen 80;
    server_name 39.106.133.41;
    location / {
        proxy_pass http://webserver;
    }
}複製代碼

nginx命令

名稱	命令
啓動nginx	nginx -c /etc/nginx/nginx.conf
關閉 nginx	nginx -s stop
重讀配置文件	nginx -s reload kill -HUP nginx
經常使用命令	service nginx {start|stop|status|restart|reload|configtest}

安裝

mongodb

wget http://.../mongodb.tgz複製代碼

這裏能夠去官網找相應的版本

我將mongodb安裝到了/user/local中，

data文件夾和log文件夾放在了var中

下載完之後解壓，再裏面找到bin/mongod這個就是啓動文件了

啓動mongodb

mongod --dbpath=/var/mongodb/data --logpath /var/mongodb/logs/log.log -fork複製代碼

若是是

react或者vue項目，打包上傳到相應的nginx裏面

一開始腦洞很大，總感受egg的部署摸不着頭腦，又不能像react同樣build打包。

egg的話能夠用git，就像平時上傳代碼同樣，再cnpm i安裝依賴

egg官方文檔寫的很明白，有自帶的進城守護。

開啓服務器

npm start複製代碼

關閉服務器

npm stop複製代碼

修改好egg的響應代理配置以及端口配置，整個服務器就搭建好了，搭建完的第一感受就是Linux的系統操做的也是文件和文件夾，並沒有其餘的神馬何方神聖，也沒有我本身認爲的那麼難了