手把手教你使用 netlify 實現前端的 自動部署 + HTTPS
隨著開源工具越來越多，特別是nodejs構建微服務器之快，實現前端自動化部署越來越簡單了，有可能【10行js代碼+10行sh腳本+設置github的webhook】就能實現，但是如果你和我一樣，就是“懶”（此處為褒義??），連這些都不想自己做，那該怎麽辦呢？這個時候我發現了這款好工具—netlify，下面我就來講講它究竟有多好用吧^_^
一、使用github或者gitlab登陸netlify
首先，打開netlify網站(https://app.netlify.com/)
然後使用github或者gitlab賬號登錄。
二、根據github/gitlab倉庫創建網站
點擊New site from Git按鈕：
根據你的倉庫所在平臺選擇，以下三選一：
選擇你需要部署的倉庫：
設置部署選項，包括三點：
-
部署分支（對應下圖中 Branch to deploy）:
顧名思義就是你的git倉庫的分支，默認選擇為master分支
-
打包命令（對應下圖中 Build command）：
就是你的打包命令，諸如 npm run build，gulp build 之類；如果本身已是靜態文件，不需打包編譯，這一欄則不填
-
打包後目錄（對應下圖中 Publish directory）：
即執行完打包命令之後靜態文件所在目錄，諸如 dist，_site 之類；如果本身已是靜態文件，這一欄則不填
完成之後點擊途中 deploy site 按鈕
三、設置域名，綁定域名
進行完第二步，我們可以看到自動化部署已經開始運行了，而且過不多久，我們的網站就已經可以利用netlify域名就行訪問了，如下圖：
可以看到netlify為我們隨機生成了一個netlify下的域名，這裏我們可以更改其前綴，並綁定到我們自己的域名下：
>> 更改netlify域名前綴：
首先，點擊上圖中 Site settings 按鈕，然後在下方點擊 Change site name 按鈕，然後在彈出框中輸入自己需要更改的前綴名，點擊保存即可，如下圖所示：
>> 綁定到自己的域名下：
首先，點擊上上圖中 Domain settings 按鈕，然後在下方點擊 Add custom domain 按鈕，然後在彈出框中輸入自己需要綁定的完整域名，點擊保存，如下圖所示：
這個時候會顯示 ！Check DNS configuration，因為我們還沒有設置域名解析到netlify服務器，所以這個時候需要到你自己域名的相應服務商網站登錄之後在需要綁定的域名下添加一條CNAME解析，解析的主機記錄即對應的netlify域名值（這裏即 codernie.netlify.com）
ok，過一會兒就可以使用自己的域名訪問自己的網站啦
四、生成HTTPS證書，實現HTTPS訪問
第四部中的Domain settings 中往下拉，可以看到 HTTPS 幾個大字母：
點擊 Verify DNS configuration 按鈕，待它變成下方綠色按鈕之後，再點擊：
然後在彈出框中點擊確認，過一會兒之後就可以使用https訪問你的小站啦：
看到自己的小站前面可以有綠色的安全字樣，是不是很酷炫，而且很放心，再也不用擔心運營商在自己的網站上掛廣告啦，哈哈哈。。。等等，是不是還差了點什麽：
對啊，還沒有強制跳轉https，OK，繼續
五、強制HTTP跳轉HTTPS訪問
在第四步 Domain settings 再往下翻一點，可以看到 Force HTTPS，只需點擊 Force HTTPS 即可實現，是不是很方便，如下圖：
到這裏，你的網站即使用戶使用http訪問，也將強制跳轉至https訪問啦，這下可以徹底不用擔下運營商給你的用戶“發紅包”啦！
六、設置redirect
利用netlify實現自動化部署和HTTPS就寫到這裏了，喜歡就點個贊啦。
手把手教你使用 netlify 實現前端的 自動部署 + HTTPS