演習 - Code CLI で Remote - Tunnels を有効化する (CLI)

  • 6 分

この演習では、次の方法を学習します。

  • コード CLI を使用してトンネルを作成して使用します。
  • 開発に使用するリモート マシンに Code CLI をインストールします。
  • Code CLI を使用して、Visual Studio Code クライアントとリモート マシンの間にトンネルを確立します。

Code CLI は、Visual Studio Code の [ダウンロード] ペインまたはコマンド プロンプトから取得できます。

Visual Studio Code の [ダウンロード] ペインから Code CLI を取得する

  1. Visual Studio Code のダウンロード ウィンドウに移動します。

    ダウンロード ウィンドウのスクリーンショット。

  2. オペレーティング システムのコード CLI をダウンロードして TestCLI ディレクトリに展開します。

    1. ダウンロードしたファイルは圧縮形式になっています。

    圧縮ファイルのスクリーンショット。

    1. ファイルをダブルクリックして TestCLI ディレクトリに抽出すると、コード ファイルが表示されます。

    抽出されたコード ファイルのスクリーンショット。

  3. ターミナルから TestCLI ディレクトリに移動します。

ターミナルで Code CLI をインストールし、解凍する

ユーザー インターフェイスまたは Visual Studio Code の [ダウンロード] ペインにアクセスできない場合は、ターミナルを使用して Code CLI をインストールできます。 TestCLI フォルダーを作成した後、次のコマンドを使用して、ターミナルの TestCLI ディレクトリ内からコード CLI をインストールします。

 curl -Lk 'https://code.visualstudio.com/sha/download?build=stable&os=cli-alpine-x64' --output vscode_cli.tar.gz

tar -xf vscode_cli.tar.gz

セキュアなトンネルを作成する

  1. 以下のコマンドを実行することで、このマシンに Visual Studio Code Server をダウンロードして起動し、Server へのトンネルを作成します。

    code tunnel --accept-server-license-terms

  2. 提供されたリンクとコードをコピーして保存します。

    コードを使用してクライアントにサインインするためのリンクのスクリーンショット。

  3. 事前に保存しておいたリンクをクライアント上の Web ブラウザーで開き、ターミナル上に提供されたコードを入力します。 [ 続行] を選択してアクティブ化します。

    [デバイスのアクティブ化] ウィンドウのスクリーンショット。

  4. [ 続行] を選択して認証します。

    [シングル サインオン] ウィンドウのスクリーンショット。

  5. [ 承認] を選択します。

    認証ウィンドウのスクリーンショット。

  6. 処理の成功を伝えるメッセージが表示されます。

    確認のスクリーンショット。

    Code CLI から、このリモート マシンに固有の vscode.dev URL (例: https://vscode.dev/tunnel/<machine_name>/<folder_name>) が出力されます。 クライアントのトンネル リンクのスクリーンショット。

    このプロセスを実行すると、トンネリング サービスに対する認証が行われ、指定のリモート マシンにアクセスできる状態が確立されます。

  7. お使いのクライアントで URL にアクセスします。

  8. [ 許可] を選択して、サインインするためのリモート - トンネル拡張機能のアクセス許可を付与します。

    サインインするためのリモート - トンネル拡張機能のアクセス許可のスクリーンショット。

  9. 「はい、作成者を信頼します」を選択して フォルダーへのアクセス権を付与します。

    [はい、作成者を信頼しています] というプロンプトのスクリーンショット。

  10. コーディングを始めましょう!

    コードのスクリーンショット。