大家好，我是布萊克。今天要來跟大家分享的內容比較技術一點點，布萊克會用簡單好懂的例子讓大家理解的。以前學習網頁知識要提交作業時，常常會需要將網頁檔案給助教，然後助教在將所有學生的網頁發佈上網頁伺服器檢查並評分。現在時代不一樣了，只需要一個簡單的指令就可以辦到並取得公開連結。即使不提交檔案，也可以透過一個叫「ngrok」的服務，讓本機的網頁發佈到整個網際網路中，意思是你的同學或同事都可以造訪你做的網站，而且完全免費。以下布萊克就來詳細介紹 ngrok 服務與相關限制，不想錯過的趕快來看看吧！
什麼是 ngrok？
布萊克用一句話簡單述說：
如果正在閱讀文章的你不具備資訊背景，很可能難以想像過去是如何讓全世界的人看到你的網站的。這邊布萊克簡單說明一下，一般來說開發網站的時候都會在自己電腦上開發，並使用 Chrome 等瀏覽器連到 http://localhost 觀看效果。現在人手一機，每個網站都會製作手機版，要在手機上觀看效果的話，大概也就讓手機連上家裡 Wi-Fi 在同個網路內才能看到效果。
圖片出自freepik.com
網站功能逐漸強大之後，工程師就會想著要整合多個功能，像是在網站內嵌入 FaceBook 留言的功能、加入線上金流支付，或是需要展示功能給老師或客戶看，總之做完的網站或服務一定會有需要對外公開的時候，不然花費時間做完也不會有人看得到。
在網路世界中要怎麼對外公開呢？打個簡單的比方，郵差要送一封信件給你，他一定要事先知道你的住址才可以送信吧！這道理套用在網路世界中，即需要跟網路服務供應商 (ISP) 申請一個對外的 IP，這樣全世界的人才能看到你的網站。
圖片出自freepik.com
不過 IP 都是一串數字，對電腦來說這個不算什麼，但對人類來說要記憶數字是一件困難的事情，因此你可能還需要網域名稱，就像 aidaidme.com這個網域名稱就好記很多了吧！
以上就是過去要怎麼公開自己做的網站要經過的流程，布萊克只是簡單帶過而已，實際做起來是耗時的事情，於是就出現 ngrok 這種服務了。只需要一個簡單的指令，剛才說的申請 IP 或是網域名稱的，通通免了！雖然 ngrok 已經變成收費服務了，但仍然有提供免費服務，對布萊克來說已經夠用了。以下將為各位介紹 ngrok 的設定教學。
ngrok 下載安裝及設定教學
步驟 1 註冊 ngrok 帳號
步驟 2 下載 ngrok 執行檔
依據電腦環境選擇適合的版本進行下載即可。
步驟 3 解壓縮檔案
步驟 4 於資料夾列輸入 cmd 開啟命令提示字元功能
步驟 5 輸入指令與帳號連結
格式：ngrok.exe authtoken << 授權金鑰 >>
完成 出現下列訊息表示連結完成了
依照上面步驟進行操作並不困難，ngrok 設定就那麼簡單而已。下面布萊克舉幾個常用的情境帶大家看看強大的 ngrok 服務。
ngrok 常用與進階指令展示範例
使用情境 1 期末網站作業展示 (對外公開網站)
格式：ngrok http << 埠號 >>
例如：ngrok http 8000
畫面右邊是模擬學生要提交期末架設網站的作業，左邊則是助教收到連結後的使用方式。
使用情境 2 在圖書館遠端家裡的電腦 (跨地區遠端桌面連線)
格式：ngrok tcp << 埠號 >>
例如：ngrok tcp 3389
出門去圖書館先將 ngrok 服務啟動，隨後就能在圖書館遠端辦公了喔！
常見的公認埠號如下：
| # | 埠號 (Port) | 服務 | 說明 |
|---|---|---|---|
| 1 | 21 |
FTP | 全名為 File Transfer Protocol，適用於簡易傳輸，任何人只要持有帳號與密碼都可以隨意增刪檔案，所以在安全性、傳輸速度、連線品質上並沒有受到特別的技術加強 |
| 2 | 22 |
SSH | 全名為 Secure Shell，一種加密的網路傳輸協定，可在不安全的網路中為網路服務提供安全的傳輸環境。 |
| 3 | 80 |
HTTP | 全名為 HyperText Transfer Protocol，這是上網瀏覽使用最多的協定。 |
| 4 | 443 |
HTTPS | 全名為 HyperText Transfer Protocol Secure，這是以HTTP為基底定義了相對安全的資料傳輸方法，現今多數網站已經套用這種加密方式。 |
| 5 | 1433 |
Microsoft SQL Server | 由美國微軟公司所推出的關聯式資料庫。 |
| 6 | 3306 |
MySQL | 原為開放原始碼的關聯式資料庫，2009年被美國甲骨文公司 (Oracle) 收購成為旗下產品。 |
| 7 | 3389 |
遠端桌面 | 遠端桌面連線的協定。 |
使用情境 3 提供客戶專屬帳號及密碼連線觀看網站功能 (限制網站存取)
格式：ngrok http -auth="<< 帳號 >>:<< 密碼 >>" << 埠號 >>
例如：ngrok http -auth="admin:password" 8000
如果覺得 ngrok 服務不太安全，各位也可以多建立一組帳號密碼，多一道防範密碼也較為安心。
使用情境 4 不知道怎麼架設網站，但又要提供客戶觀看網站外觀 (無網頁伺服器)
格式：ngrok http "file:///<< 網站根目錄路徑 >>"
例如：ngrok http "file:///C:\website"
格式：ngrok http -auth="<< 帳號 >>:<< 密碼 >>" file:///<< 網站根目錄路徑 >> (限制網站存取)
例如：ngrok http -auth="admin:password" file:///C:\website
如果是一個架站新手，不知道怎麼安裝網頁伺服器，可以透過這個方法將網站發佈出去。
圖片出自freepik.com
使用情境 5 使用自己申請的網域名稱 (固定網域) 付費會員
格式：ngrok http -subdomain=<< 網域名稱 >> << 埠號 >>
例如：ngrok http -subdomain=aidaidme 80
看過以上幾個範例，應該不難發現 ngrok 會隨機產生英文+數字的子網域名稱給大家使用。如果要產生一組專屬於你的網域，那就會需要用到這個功能，執行後將相關連結轉換成 https://aidaidme.ngrok.io。此功能僅開放給付費會員使用，敬請留意。
針對以上的幾個使用情境，各位是否 ngrok 服務覺得相當方便使用呢？如果需要參考更多的進階功能，請參考官方網站的說明文件。
結語
布萊克覺得 ngrok 是一個相當方便的服務，雖然現在已經轉型為付費服務了，但免費的功能已經足夠使用在多數的場景了。網路上還有自己架設的教學，可以參考這篇文章，自己架設限制也不會那麼多，有興趣的話也可以參考一下。
以上就是這次布萊克要分享的內容，如果覺得布萊克分享的內容相當實用，敬請分享給更多需要的人，或是有任何回饋意見也都歡迎留言。
留言