ローカルの VS Code エディタを使用してコードを開発する

ローカルマシンからワークステーションへの SSH トンネルを開き、VS Code リモート開発サポートを使用して、ローカルの VS Code エディタから Cloud Workstations に接続する方法を学習します。

準備

開始する前に、次の作業を行ってください。

チームのメンバーがワークステーション構成を作成していることを確認します。
ワークステーションを作成して開始します。
Google Cloud コンソールで作業している間に、次の情報をコピーします。
1. プロジェクト名と ID: Google Cloud のメニューバーでプロジェクト名をクリックし、表示された [プロジェクト名と ID] ダイアログで ID をコピーします。
2. リージョン
3. クラスタ名
4. 構成名
ローカルマシンから gcloud CLI をインストールします。

gcloud を初めて実行する場合は、gcloud auth login を実行して認証情報を取得し、gcloud config set project PROJECT_ID を実行して前のプロジェクトをコピーしたプロジェクト ID に設定する必要があります。
ssh を初めて使用する場合は、リモート SSH 拡張機能をインストールして、拡張機能 Marketplace またはコマンドパレットを介して VS Code エディタからワークステーションに接続できるようにします。
拡張機能 Marketplace
1. ローカルの VS Code エディタアプリケーションを開いてから、
  アクティビティバーで [拡張機能] を選択して、拡張機能 Marketplace を開きます。
2. [インストール] をクリックして Remote - SSH 拡張機能をインストールします。
3. 検索欄に「remote ssh」と入力します。これにより、[Remote - SSH] の拡張機能ページが開きます。
コマンドパレット
1. コマンドパレットを開くには、Ctrl+Shift+P（または macOS の場合は Command+Shift+P）を押すか、[表示] > [コマンドパレット] をクリックします。
2. 「ext install ms-vscode-remote.remote-ssh」と入力して拡張機能をインストールします。

SSH トンネルを開く

gcloud workstations start-tcp-tunnel コマンドを使用して、ローカルマシンからワークステーションへの SSH トンネルを開きます。

Google Cloud コンソールで、[Cloud Workstations] > [ワークステーション] ページに移動します。
[ワークステーション] に移動
ワークステーション名をクリックして、[ワークステーションの詳細] ページを開きます。
次の例では、ワークステーション名、リージョン（ロケーション）、ワークステーションクラスタ名、ワークステーション構成名のプレースホルダを置き換えます。ワークステーションの詳細パネルの値を、[編集] アイコンでマークされたプレースホルダにコピーします。
```
gcloud workstations start-tcp-tunnel \
  --project=PROJECT_ID \
  --region=REGION \
  --cluster=CLUSTER_NAME \
  --config=CONFIG_NAME \
  --local-host-port=:LOCAL_PORT \
  WORKSTATION_NAME 22
```
プロジェクト ID を確認するには、始める前にセクションをご覧ください。

--local-host-port=:LOCAL_PORT フラグは省略可能です。ローカルポートを指定する場合は、LOCAL_PORT を使用するローカルポート番号に置き換えます。ローカルポートを指定しない場合は、システムで未使用の任意のローカルポートが自動的に選択され、ポート番号を含むメッセージが出力されるため、使用するローカルポートがわかります。
プレースホルダを入力したら、content_copy の [コードサンプルをコピー] をクリックして gcloud CLI コマンドをコピーします。
ローカルのターミナルウィンドウにコマンドを貼り付け、Enter キーを押してトンネルを作成します。

コマンドが成功すると、Listening on port メッセージの後にローカルポート番号が表示されます。

各構成フラグの詳細については、SSH トンネルまたは start-tcp-tunnel をご覧ください。

Cloud Workstations ホストに接続する

Cloud Workstations ホストに接続するには、次の手順に従います。

VS Code アプリケーションを開くか、それに戻ります。
Remote - SSH を起動するには、ステータスバーで [リモートウィンドウを開く] をクリックします。
コマンドパレットが開いたら、[ホストに接続する] オプションを選択します。
user@localhost:LOCAL_PORT を入力します。LOCAL_PORT はローカルポート番号に置き換えます。

次の例では、user@localhost:1025 を指定してローカルポート 1025 に接続します。

注: ワークステーションがエフェメラル VM で実行されるため、ワークステーションのホスト鍵はセッション間で変更されます。このため、ワークステーション構成でホスト鍵の検証が無効になっていることを確認してください。
[ホストの追加] という確認メッセージが表示されたら、[接続] をクリックします。

また、システムでハッシュを確認するプロンプトが表示される場合があります。プロンプトが表示されたら、[続行] をクリックします。
新しい VS Code エディタが開き、VS Code のステータスバーに SSH: localhost: とポート番号が表示されます。

これで、リモートワークステーション上のファイルと言語サーバーにアクセスできるようになり、ワークステーション内で実行されるプロセスのビルドおよび実行が可能になりました。

次の例は、 SSH: localhost: 1025 を介して Cloud Workstations に接続している VS Code エディタウィンドウを示しています。

拡張機能 Marketplace に戻って、Cloud Code とその他のローカル VS Code 拡張機能をインストールして、コードのビルド、実行、テストを行うこともできます。

ローカルの VS Code エディタを使用してコードを開発する

準備

拡張機能 Marketplace

コマンド パレット

SSH トンネルを開く

Cloud Workstations ホストに接続する

コマンドパレット