跳至主要內容

網頁上的 Claude Code

今日已更新

網頁上的 Claude Code 可遠端執行 Claude Code 任務,與您的 GitHub 儲存庫中的程式碼協作。本文說明其運作方式、何時應使用它而不是在終端機或 IDE 中執行 Claude Code,以及它能啟用的工作流程。

網頁上的 Claude Code 提供的功能

網頁上的 Claude Code 可讓您將任務委派給 Claude,這些任務可在無需您主動監督的情況下執行。在您的瀏覽器中,您選擇一個 GitHub 儲存庫、描述您想要完成的工作,Claude 會在遠端環境中處理該任務。Claude Code 開始處理任務後,您可以完全離開該頁面;Claude 將繼續其工作。完成後,Claude 會自動建立一個包含變更的拉取請求供您審查。

此功能適用於您本機上可能沒有的儲存庫。您可以在任何有權存取的 GitHub 儲存庫上啟動任務,無需在本機複製或設定開發環境。這對於您偶爾貢獻的專案或您仍在學習的程式碼庫很有用。

網頁版 Claude Code 啟用非同步開發工作流程。使用終端機或編輯器中的 Claude Code,您通常會同步工作:您提出請求、等待 Claude 回應、審查變更,然後提出另一個請求。這種同步工作方式可讓您進行細粒度控制,但需要您在整個過程中投入注意力。網頁上的 Claude Code 的處理方式不同:您可以指派一個較大的任務,讓 Claude 獨立工作,稍後再回來審查完成的工作。

您也可以並行執行多個任務。由於每個任務都在自己的隔離環境中執行,您可以讓 Claude 同時處理多個不同的問題或儲存庫。每個任務獨立進行,完成時會建立自己的拉取請求。多個任務可以同時在同一個儲存庫上工作。

運作方式

當您啟動任務時,網頁上的 Claude Code 會為您的工作建立一個隔離的虛擬機器。您的 GitHub 儲存庫會被複製到此環境中,該環境預先配置了常見的開發工具和語言生態系統。

Claude 透過執行您在儲存庫配置中定義的任何設定命令來準備環境。這包括安裝相依性、設定資料庫或執行您的專案需要的其他初始化步驟。如果您的任務需要網路存取(可能是為了安裝套件或擷取資料),您可以配置環境具有的網際網路存取層級。

環境準備就緒後,Claude 開始處理您的任務。Claude 讀取您的程式碼、進行變更、編寫測試,並執行命令來驗證工作。如果需要,您可以透過網頁介面監控進度並提供指導。

Claude 完成任務後,會將變更推送到您 GitHub 儲存庫中的新分支。您會收到通知,可以審查變更,然後直接從介面建立拉取請求。拉取請求包含 Claude 的所有工作,準備好供您審查和進行任何您想要的額外變更。

每個任務都在完全隔離的環境中執行。虛擬機器僅針對該特定任務存在,並包含安全控制,例如受限的網路存取和受保護的認證處理。您的 GitHub 認證透過安全代理進行管理,因此認證永遠不會直接存在於 Claude 工作的環境中。

何時使用網頁上的 Claude Code 與終端機

網頁上的 Claude Code 是與 Claude Code 協作的新方式。某些任務非常適合在網頁上非同步執行,而其他任務仍然最好透過終端機或 IDE 中的 Claude Code 執行。

使用網頁上的 Claude Code 進行:

  • 具有明確要求的定義明確的任務:當您可以準確描述需要完成的工作,且不期望需要在任務中途引導 Claude 時,網頁介面可讓您啟動工作並在完成時返回。

  • 待辦事項積壓的背景工作:您可以從待辦事項中指派 Claude 多個問題,並讓它們並行執行。每個任務獨立進行,讓您可以同時處理多個修復,無需逐個監控。

  • 您本機上沒有的儲存庫:如果您需要對未複製或不想在您的機器上設定的儲存庫進行變更,網頁上的 Claude Code 會為您處理環境設定。

  • 您想要排隊的任務:當您有一份要進行的變更清單,但現在不想處理它們時,您可以在網頁上啟動任務,稍後審查結果。這可讓您批次處理類似的工作或在您專注於其他事項時委派任務。

在終端機/IDE 中使用 Claude Code 進行:

  • 需要頻繁修正方向的任務:當您不確定正確的方法是什麼,或預期需要根據您看到的內容重新引導 Claude 時,在終端機中工作可讓您獲得即時回饋。您可以在 Claude 工作時調整方向,而不是等待完整結果。

  • 具有不明確要求的探索性工作:如果您正在思考如何解決問題或調查不同的方法,終端機可讓您在學習時精煉您的請求。來回互動有助於澄清一開始不明顯的要求。

  • 具有未提交變更的本機開發:當您正在積極開發並在本機儲存庫中有未提交的工作時,在終端機中使用 Claude Code 可將所有內容保持在一個地方。您可以快速反覆進行變更,無需提交或推送尚未準備好的工作。

  • 需要立即回饋的任務:如果您需要快速查看結果並想要快速反覆,終端機提供較低的延遲。您可以即時觀看 Claude 工作,如果過程早期出現問題,可以停止或重新引導。

使用案例範例

使用測試驅動開發的後端變更

讓 Claude 編寫定義預期行為的測試,然後實現程式碼以通過這些測試。這對於可以透過自動化測試驗證行為的後端變更特別有效。

範例提示:

為 /api/search 端點新增速率限制。

速率限制器應該:
- 每個 API 金鑰每分鐘允許 100 個請求
- 超過限制時傳回 429 狀態
- 在 60 秒後重設限制
- 獨立追蹤不同的 API 金鑰

使用 TDD 方法:先編寫全面的測試,然後實現速率限制邏輯以通過它們。

何時使用此方法:這在網頁上運作良好,因為測試為 Claude 提供了明確的驗證標準。您無需監控 Claude 的進度,因為測試會捕捉問題並引導反覆朝向工作解決方案。任務的自包含性質(Claude 編寫測試然後使其通過)不需要您在啟動後的輸入。

使其有效的原因:Claude 可以在無需您監督的情況下反覆實現,使用測試失敗來識別和修復問題。任務執行時間比簡單的程式碼變更更長,但您可以讓它在背景中完成。當您審查拉取請求時,測試和實現都已準備好,您對解決方案有信心,因為測試通過了。

文件更新

產生或更新技術文件,例如 README 檔案、API 文件、程式碼註解或使用者指南。

範例提示:

使用自 v2.3.0 版本發布以來的所有變更更新 CHANGELOG.md:
- 審查自該標籤以來主分支上的提交。
- 將變更分類為「新增」、「變更」、「修復」和「移除」部分。
- 為每個項目包含提交雜湊。

何時使用此方法:變更日誌更新非常適合網頁,因為 Claude 可以獨立審查提交歷史記錄並格式化項目而無需指導。該任務手動執行很繁瑣,但足夠簡單,Claude 可以完成而無需關於要包含哪些提交或如何分類它們的問題。

使其有效的原因:您可以委派整個變更日誌更新並在完成時審查結果。Claude 讀取提交、提取有意義的變更,並遵循您現有的變更日誌格式。

具有明確範圍的重構

當您可以為變更定義明確的邊界時,重新組織程式碼以改進組織或可讀性。這包括提取程式碼、分割大型檔案或組織模組結構。

範例提示:

/src/services/user.go 中的 UserService 類別有 800 行長。
將其分割為三個專注的服務:
- UserAuthService(登入/登出/工作階段)
- UserProfileService(設定檔 CRUD 操作)
- UserPreferencesService(設定/偏好設定)

確保所有測試仍然通過。

何時使用此方法:具有明確限制的重構在網頁上運作良好,因為您可以為 Claude 設定明確的邊界。測試套件可以提供驗證,讓 Claude 驗證重構沒有破壞任何現有功能。

使其有效的原因:該任務需要時間,但在定義結構後不需要您的主動輸入。您可以啟動重構並稍後審查組織的結果,而不是在 Claude 處理任務時監控它。明確的範圍意味著 Claude 不太可能需要在任務中途進行指導。

有效使用的提示

  • 考慮在您的儲存庫中新增測試套件,以便 Claude 更輕鬆地驗證它已成功完成任務

  • 指定成功標準,而不是「改進」或「修復」之類的模糊目標

  • 在您的提示中定義應該變更的內容和應該保持不變的內容

  • 使用明確的邊界來限定任務範圍,以便 Claude 不需要在任務中途進行指導

  • 如果您在想「我需要先看看這會如何進行」,請考慮改用終端機

  • 如果您在任務中途意識到需要提供指導,請使用「在 CLI 中開啟」

是否回答了您的問題?