通訊協定監控:查看及傳送 CDP 要求

Dale St. Marthe
Dale St. Marthe

您可以使用通訊協定監控器查看開發人員工具提出的所有 CDP 要求和回應,並直接傳送 CDP 指令。

總覽

Chrome 開發人員工具會使用 Chrome 開發人員工具通訊協定 (CDP) 檢測 Chrome 瀏覽器,並進行檢查、偵錯和剖析。開發人員可以使用通訊協定監控器,透過程式輔助方式與 CDP 合作。

「通訊協定監視器」可讓您執行以下操作:

  • 記錄 CDP 要求和回應
  • 檢查 CDP 訊息
  • 儲存 CDP 訊息
  • 傳送 CDP 指令

開啟通訊協定監視器

如要開啟「通訊協定監視器」,請按照下列步驟操作:

  1. 確認實驗已啟用。在「設定」 >「實驗」下方,勾選「通訊協定監控」核取方塊。

  2. 按下以下指令開啟「Command」選單

    • macOS:Command + Shift + P
    • Windows、Linux、ChromeOS:Control + Shift + P 含有
  3. 開始輸入 Protocol monitor,選取「顯示通訊協定監視器」,然後按下 Enter 鍵。開發人員工具會在開發人員工具視窗底部顯示「ProtocolMonitor」面板。

或者,依序選取右上角的 more_vert 更多選項 >「更多工具」 >「通訊協定監控器」

記錄 CDP 要求和回應

開啟通訊協定監控器後,系統就會自動開始記錄目前頁面的 CDP 訊息。即使您重新整理頁面或關閉開發人員工具,通訊協定監控仍會繼續記錄。

在面板頂端,按一下動作列左側的記錄按鈕,即可停止或開始錄製。

「通訊協定監視器」面板中的記錄按鈕。

檢查 CDP 訊息

做為通訊協定監控記錄,CDP 訊息會記錄在面板左側的表格中。

按一下「Method」、「Request」或「Response」儲存格,在面板右側開啟其 RequestResponse 資料的詳細檢視畫面。

「通訊協定監控」面板中醒目顯示的方法。

按一下對應的標頭分頁標籤,即可在「要求」或「回應」資料之間切換。

在「Method」欄的值上按一下滑鼠右鍵,可提供依據情境的選項。

清除及下載 CDP 訊息

如要清除所有已記錄的 CDP 訊息,請按一下動作列中的「清除」按鈕。

如要將錄製的訊息下載為 JSON 檔案,請點選下載 「download」(下載)

傳送原始 CDP 指令

透過通訊協定監控器傳送 CDP 指令的方式主要有兩種:

  • 如果指令不需要任何參數,請在「通訊協定監控器」底部的輸入欄位中輸入指令,然後按下 Enter 鍵,例如 Page.captureScreenshot

    如果指令需要參數,請以 JSON 格式提供參數,例如 {"cmd":"Page.captureScreenshot","args":{"format": "jpeg"}}

    輸入欄位右側的下拉式選單會指定目標。

通訊協定監控器中,以方框特別標出「目標」下拉式選單。

  • 您也可以使用 CDP 編輯器編輯及發出指令:

    1. 在指令輸入欄位旁邊,按一下 left_panel_open 顯示 CDP 指令編輯器按鈕,開啟指令編輯器。
    2. 從下拉式清單中選取目標,然後在命令提示字元旁開始輸入 CDP 指令。自動完成功能會提供相關選項。選取要使用的指令。 通訊協定監控器中的指令輸入內容。
    3. 輸入 CDP 指令後,編輯器會根據通訊協定定義建立結構化參數。填寫這些參數後,您就能透過指令傳送這些參數。 參數輸入內容含有要填寫的 Service Worker 相關參數。
    4. 點選「傳送」按鈕,或按下 Ctrl + Enter 鍵來傳送指令。

你也可以從資料表編輯指令並重新傳送。在表格中的項目上按一下滑鼠右鍵,然後從下拉式選單中選取 [編輯並重新傳送]。這麼做會自動重新開啟 CDP 編輯器,並以您選取的指令預先填入。

如要進一步瞭解 CDP 編輯器,請參閱使用新的指令編輯器以高效率編寫 Chrome 開發人員工具通訊協定 (CDP) 指令