練習 - 透過 Visual Studio Code 使用 SSH 進行連線

已完成

現在您已設定遠端主機,您需要從 Visual Studio Code 連線到它。 若要連線到遠端電腦,您需要 Remote – SSH 延伸模組。

在此練習中,您將安裝 Visual Studio Code Remote – SSH 擴充功能 ,並連線到 SSH 主機。

安裝支援的 SSH 用戶端

您的本機電腦必須具有支援的 SSH 用戶端才能啟用與遠端電腦的 SSH 連線。

安裝 Remote - SSH 延伸模組

必須安裝 Visual Studio Code Remote – SSH 擴充功能,才能從 Visual Studio Code 內連線到您的 SSH 伺服器。

  1. 開啟 Visual Studio Code。

  2. 選取活動列中的 [ 延伸模組 ] 圖示,以開啟 [延伸模組] 檢視。

    此螢幕擷取畫面醒目提示 Visual Studio Code 活動列中的 [延伸模組] 檢視。

  3. Marketplace 的搜尋延伸模組列中輸入remote ssh

  4. 找出 [遠端 – SSH 擴充功能],然後選取 [ 安裝] 按鈕。

    醒目提示如何搜尋安裝 Visual Studio Code Remote - SSH 擴充功能的螢幕快照。

  5. 遠端 - SSH 擴充功能安裝之後,您將能夠存取它新增至 Visual Studio Code 的命令。

設定新的 SSH 主機

現在,您可以使用 Visual Studio Code 中的 Remote - SSH 命令來設定 SSH 主機設定。

  1. 在 [命令面板](檢視>命令面板)中,輸入並選取 Remote-SSH:連線到主機

    顯示命令選擇區中的「連線到主機」命令的螢幕擷取畫面。

  2. 選取 [新增 SSH 主機]。 系統將提示您輸入虛擬機器的連線資訊。 您需要指定使用包含虛擬機器私密金鑰的.pem 檔案。 命令採用下列格式:

    ssh user@hostname -i filepath
    
    • user 是您在將 SSH 公開金鑰新增至虛擬機器時所設定的使用者名稱。 如果您保留預設值,則此值應為 azureuser。
    • hostname 是您在上一個練習的最後一步所複製的虛擬機器的公用 IP 位址。
    • filepath 是上一個練習中下載的 .pem 檔案的檔案路徑。

    顯示用於連線到主機的 SSH 連線命令的螢幕擷取畫面。

  3. Enter 以更新預設 SSH 組態檔。 此動作將主機新增至設定檔。

連線到 VM

現在已經設定主機,您可以連線到遠端電腦。

  1. 再次執行 Remote-SSH:連線到主機 命令。 您現在可以看到按 IP 位址所列出新增的主機。 選取主機。

  2. 選取主機之後,Visual Studio Code 現在會開啟新的視窗。 您會看到「Visual Studio Code Server」正在 SSH 主機上初始化的通知。

    顯示連線至 SSH 主機時初始化 Visual Studio Code Server 通知的螢幕快照。

  3. 系統可能會提示您選取主機的平臺。 選取 [Linux]

  4. 如果系統提示您信任連線,請選取 [是 ] 或 [ 繼續]。

  5. 完成後,您可以藉由檢視編輯器中狀態列左下角的遠端指示器來知道您已連線。

    顯示 Visual Studio Code 中遠端指標的螢幕快照。

    • 您也可以選取遠端指標作為最上層命令的快速輸入。 顯示您可以藉由按一下遠端指示器存取的主要命令的螢幕擷取畫面。
  6. 連線到 SSH 主機後,您可以與遠端電腦上的檔案互動並開啟資料夾。 如果您開啟整合終端機,您會看到您在Bash shell內運行,即使您的本機電腦可能不是以Linux為基礎。

    顯示遠端電腦上的 bash 殼層的螢幕擷取畫面。

您已成功連線到虛擬機器! 除了提供主機和連線資訊之外,Visual Studio Code 會負責連線程式的其餘部分,因此您不需要記住任何命令或擔心其他設定。

在下一節中,您將瞭解如何在 Visual Studio Code 中使用 SSH 連線時執行和偵錯程式代碼。