0x00 前言
要架設一個服務通常需要幾個條件
- Public IP: 如果是固定 IP 會更好,如果是動態 IP 就會更麻煩一
- Domain Name: 除非希望 client 直接用 IP access,否則都會註冊一個 domain 綁 IP 後,提供給 client 使用
- DNS: 要讓 Domain 綁 IP 還需要一個 DNS 服務,通常可以用免費的 Cloudflare,或是域名提供商提供的 DNS 服務
- Port Forward: 不一定需要,但如果電腦在 router 後面的話,就會需要設定 port forward 才能將封包轉發到我們預期的電腦上
0x01 建立一個 http server
我們先用 nodejs 來建立一個簡單的 http server
接著啟動它
node server.js
如果想要直接測試可以直接用我建立的 gist 來啟動玩玩
curl -s https://gist.githubusercontent.com/neokn/32b2f49505111069c73ed8d41b5d09e4/raw/745e106a20699d087896c4e5460564d5a719f22a/server.js| node
這時候我們可以用瀏覽器開啟
http://localhost:8080

0x02 向世界說 Hello, World
這時候我們的 Hello, World! 只有我們自己看得到
My World is Your World 全家就是你家的概念
如果我們所在的位置網路不是我們可以控制的
例如:公司、旅館、租屋處 …
那我們想要讓這個世界上能連上網路的人
都能看到 Hello, World!
我們該怎麼做呢?
首先先安裝 ngrok
brew install ngrok
非 macOS 可以參考文件 https://ngrok.com/download
接著可以啟動 ngrok 並且指定 port
以上方我們啟動的 server 是 8080 port 為例
ngrok http 8080

接著會看到這個畫面
其中 Forwarding 的 URL 就是可以 share 給其他人
他們就能看到我們的 Hello, World! 囉!
https://2e8a-114-137-19-95.jp.ngrok.io
而且 ngrok 提供的是有 https 的 URL 非常的不錯
可以減少在一些開發上會遇到的一些安全性問題
0x03 ngrok 原理及使用限制
ngrok 用起來簡單
原理上其實也很容易理解
當我們將 ngrok 服務啟動之後
會在 ngrok 和 server 之間建立一條 tunnel
當 client 連到 ngrok 之後就會用 tunnel 向 server 取得內容
client -> ngrok <- tunnel -> server
如果這是一個會通過 ngrok 的 server 而居然不用錢?
天下當然沒有白吃的午餐
所以未付費的狀況下有一些限制
- tunnel 建立起來之後有 2 hrs 的限制
- 每次啟動的時候 URL 都是新的所以要不斷的更新 URL
- 無法自訂 domain
- 如果 server 是 HTML 的話會需要註冊 ngrok 帳號

0xFF 總結
ngrok 是一個非常方便的工具
在自己的電腦就可以把 server 讓其他人可以 access
例如:
在公司工作可能要看網頁修改結果
直接坐到旁邊就可以看
但 work from home 期間
除了發佈到測試環境
或者就要用 share screen 的方式看
而有了 ngrok 的話
就可以讓對方直接連接到自己的電腦測試
非常的快速
以過去經驗來說免費版本的限制
不會是太大的問題
但如果有其他需求可能就要考慮付費版本解鎖功能
或是其他替代方案了