在開發計算機網頁伺服器上裝載網站,然後從 Android 裝置存取內容。
埠轉送可讓您檢視 Android 裝置上開發電腦中執行之網頁伺服器所裝載的內容。
如果您的網頁伺服器使用自定義網域,請設定您的 Android 裝置,以使用自定義網域對應來存取該網域中的內容。
使用USB纜線和Microsoft Edge DevTools,從開發電腦執行網站,然後在Android裝置上檢視網站。
設定埠轉送
埠轉送可讓您的 Android 裝置存取裝載在開發電腦中執行之網頁伺服器上的內容。 埠轉送的運作方式是在您的 Android 裝置上建立接聽 TCP 連接埠,以對應至開發電腦上的 TCP 連接埠。
埠之間的流量會透過 Android 裝置與開發電腦之間的 USB 連線傳輸,因此連線不會取決於您的網路設定。
若要啟用埠轉送:
在您的開發電腦與Android裝置之間設定 遠端偵錯 。 當您完成時,您的 Android 裝置應該會顯示在 [ 檢查 裝置] 對話框的左側功能表和 [ 連線 狀態指示器] 中。
在 DevTools 的 [ 檢查裝置 ] 對話框中,啟用 埠轉送。
按兩下 [新增規則]。
在左側的 [ 裝置埠 ] 文本框中,輸入
localhost
您想要從中存取 Android 裝置上網站的埠號碼。 例如,如果您想要從localhost:5000
輸入5000
存取網站。在右側的 [ 本機位址 ] 文本框中,輸入您網站裝載在開發計算機中執行之網頁伺服器上的IP位址或主機名,後面接著埠號碼。 例如,如果您的網站在 上執行,
localhost:7331
請輸入localhost:7331
。按一下 [新增]。
現在已設定埠轉送。
您可以在頂端看到埠向前的狀態指示器,以及裝置名稱旁邊的狀態指示器。 埠轉送的指標位於裝置的 [ 檢查 裝置] 對話框內的索引標籤上。
若要檢視內容,請在 Android 裝置上開啟 Microsoft Edge,然後移至 localhost
您在 [ 裝置埠 ] 字段中指定的埠。 例如,如果您在欄位中輸入 5000
,請造訪 localhost:5000
。
對應至自定義本機網域
自定義網域對應可讓您從開發計算機上使用自定義網域的網頁伺服器,檢視Android裝置上的內容。
例如,假設您的網站使用僅適用於網域 的第三方 JavaScript 連結庫 microsoft-edge.devtools
。 因此,您可以在開發計算機上的檔案中 hosts
建立專案,以將此網域對應至 localhost
(例如, 127.0.0.1 microsoft-edge.devtools
) 。 設定自定義網域對應和埠轉送之後,請在URL microsoft-edge.devtools
檢視Android裝置上的網站。
設定埠轉送至 Proxy 伺服器
若要對應自定義網域,您必須在開發計算機上執行 Proxy 伺服器。 Proxy 伺服器的範例包括 Charles、 Squid 和 Fiddler。
若要設定埠轉送至 Proxy:
執行 Proxy 伺服器,並記錄正在使用的埠。
注意事項
Proxy 伺服器和您的網頁伺服器必須在不同的埠上執行。
設定 埠轉送 至您的 Android 裝置。 針對 [ 本機位址] 字 段,輸入
localhost:
,後面接著 Proxy 伺服器執行所在的埠。 例如,如果它是在埠8000
上執行,請移至localhost:8000
。 在 [ 裝置埠 ] 字段中,輸入您要讓 Android 裝置接聽的數位,例如3333
。
在裝置上設定 Proxy 設定
接下來,您必須設定 Android 裝置以與 Proxy 伺服器通訊。
在您的 Android 裝置上,流覽至 [設定>Wi-Fi]。
長按您目前連線的網路名稱。
注意事項
Proxy 設定適用於每個網路。
按兩下 [修改網络]。
按兩下 [進階選項]。 Proxy 設定會顯示。
單擊 [ Proxy] 功能表,然後選取 [ 手動]。
針對 [ Proxy 主機名稱] 字 段,輸入
localhost
。針對 [ Proxy 埠 ] 字段,輸入您在上一節中為 裝置埠 輸入的埠號碼。
按一下儲存。
透過這些設定,您的裝置會將其所有要求轉送至開發電腦上的 Proxy。 Proxy 會代表您的裝置提出要求,因此會正確解析對自定義本機網域的要求。
現在存取 Android 裝置上的自訂網域,就像在開發電腦上一樣。
如果您的網頁伺服器正在非標準埠中執行,請記得在向 Android 裝置要求內容時指定埠。 例如,如果您的網頁伺服器在埠 7331
上使用自訂網域microsoft-edge.devtools
,當您從 Android 裝置檢視網站時,應該使用 URL microsoft-edge.devtools:7331
。
提示
若要繼續正常流覽,請記得在中斷與開發計算機的連線之後,還原 Android 裝置上的 Proxy 設定。
注意事項
此頁面的部分是根據Google所建立和 共用的工作進行 修改,並根據 Creative Commons Attribution 4.0 國際授權中所述的條款使用。 原始頁面 可在這裡 找到,並由Kece Basques和Meggin Kearney 撰寫。
此工作是根據 Creative Commons Attribution 4.0 International License 授權。