使用ngrok讓你的本地Web程式外網可訪問

greylihui發表於2018-09-27

注:本文隸屬於《Flask Web開發實戰》番外文章系列,文章列表見《Flask Web開發實戰番外文章索引》

在開發Web程式時,有時候會有這樣的需求:

  • 讓朋友可以訪問到你本地執行的程式
  • 在本地測試各類服務(比如Telegram機器人、微信公眾號等)
  • 有一臺廢棄的電腦,你想讓它作為一臺伺服器來執行你的部落格程式,或是執行其他簡單的程式

外網可見

要實現上面的需求,我們就需要程式能夠“外網可見”。在《Flask Web開發實戰》第一章介紹啟動程式時,我們提及了“外網可見”的內容。簡單來說,當你將Flask伺服器監聽的主機地址設定為0.0.0.0時,就可以讓伺服器外網可見。不過,這裡有一個前提,那就是你的伺服器需要執行在擁有公網IP的主機上,因為我們開發用的電腦通常不會有公網IP,所以這裡的外網只能是你的電腦所在的區域網,比如在客廳的電腦可以訪問你的筆記本上執行的程式(通過你的筆記本的內網IP)。

事實上,藉助內網穿透/對映工具,我們也可以讓外網上的朋友訪問到執行在你的筆記本上的程式。這些工具會為我們分配一個域名A,你只需要在本地執行程式,並建立對映,那麼當其他使用者(不僅是你客廳的電腦,還可能是北京的毛毛,或是美國的Peter)訪問A網址時,內網穿透工具就會把請求轉發到你的筆記本中,取回響應後再返回給使用者。具體流程如下所示:


在這篇文章,我們會了解如何使用ngrok來實現這個目的。本文將會以一個簡單的Flask程式作為示例,不過你也可以替換為任意的Web程式,比如使用Django、PHP或是JAVA等語言/框架編寫的Web程式。

執行本地伺服器

我們先來編寫一個簡單的Flask程式:

from flask import Flask

app = Flask(__name__)

@app.route('/')
def hello():
    return 'It works!'複製程式碼

將上面的程式碼儲存為app.py,然後開啟一個命令列視窗,使用下面的命令執行這個程式:

$ flask run複製程式碼

如果還沒有安裝Flask,可以執行pip install flask命令進行安裝(你也可以建立一個虛擬環境,推薦使用Pipenv)。

預設情況下,Flask內建的開發伺服器會監聽本地機的5000埠,你可以使用127.0.0.1:5000或localhost:5000訪問程式。

安裝和配置ngrok

ngrok支援三大主流作業系統,安裝流程比較簡單,如下所示:

  1. 訪問ngrok.com/download
  2. 根據作業系統下載對應的壓縮包
  3. 解壓到合適的目錄

壓縮包裡包含一個名為ngrok的二進位制檔案,我們開啟一個命令列視窗,切換到這個檔案所在的目錄。現在可以先執行help命令來測試一下。在Windows下,你可以使用下面的命令:

> .\ngrok help複製程式碼

或是直接執行:

> ngrok help複製程式碼

在Linux/macOS下,則可以使用下面的命令:

$ ./ngrok help複製程式碼

建立對映/HTTP隧道

因為我們的Flask程式已經執行在本地機的5000埠,我們只需要啟動ngrok服務,輸入對應的埠即可建立對映,或者說建立一條HTTP隧道:

$ ./ngrok http 5000複製程式碼

附註 在Windows下可以使用ngrok http 5000命令。

輸出的資訊中包含ngrok為你隨機分配的域名:

Session Status online
Account Grey Li (Plan: Free)
Version 2.2.8
Region United States (us)
Web Interface http://127.0.0.1:4040
Forwarding http://d15a56b1.ngrok.io -> localhost:5000
Forwarding https://d15a56b1.ngrok.io -> localhost:5000

Connections ttl opn rt1 rt5 p50 p90
0 0 0.00 0.00 0.00 0.00複製程式碼

其中的https://d15a56b1.ngrok.io就是為你分配的可以外部訪問的網址,所有發向這個網址的請求都會轉發到你的本地機5000埠,即localhost:5000或127.0.0.1:5000。這時訪問這個網站會看到我們上面程式中定義的輸出“It works!”。

當有請求進入後,你可以在這裡看到請求列表。另外,你也可以訪問http://127.0.0.1:4040訪問ngrok本地程式提供的Web監控頁面。

註冊賬戶與付費套餐

在上面的流程裡我們並沒有介紹註冊賬戶,因為這是可選的。未註冊時,你執行ngrok http命令的輸出會和上面稍微有些不同,你會看到下面兩行:

Session Status online
Session Expires 7 hours, 42 minutes複製程式碼

這是因為未註冊賬戶每個會話只會維持8小時,過期後你需要重新啟動。

註冊使用者沒有這個限制,註冊相當簡單,這裡不再贅述,註冊完成後需要執行下面的命令連線本地ngrok程式:

$ ./ngrok authtoken <令牌值>複製程式碼

附註 Windows系統可以使用ngrok authtoken <令牌值>命令。

命令中的令牌值可以在註冊後跳轉的控制皮膚頁面看到,如下圖所示:

你也可以訪問dashboard.ngrok.com/auth檢視。

每次建立對映,ngrok都會分配一個隨機子域的網址,如果你想擁有一個固定的域名,則要升級套餐。升級套餐的好處很多,但如果只是臨時測試用的話,免費賬戶或是不註冊使用就足夠了。

注:更多的功能介紹可以訪問ngrok.com/product檢視。文圖均來自ngrok.com


相關文章