Visual Studio CodeからAzureの仮想マシンへSSH接続する方法

松本一将
Opening Line
Published in
6 min readAug 31, 2022

注意点

株式会社Opening Lineの松本です。本記事は「ゴーストライター制度」を用いた技術記事になります。質問等ございましたら一度私までご連絡いただけますと幸いです。記事作成担当者に確認いたします。

連絡先

https://twitter.com/kazumasamatsumo

はじめに

本記事ではAzure上で作成した仮想マシンにVisual Studio CodeからSSH接続をする方法をご紹介します。

Azureでの仮想マシン作成についてはこちらの記事を参考にしてください。

目次

  1. Visual Studio Code インストール
  2. 拡張機能のインストール
  3. SSH接続用のコンフィグ作成
  4. SSH接続で接続
  5. サーバー上でファイルの編集
  6. 参考文献

1.Visual Studio Code インストール

  • 公式ページよりご自身のマシンに合ったインストーラーをダウンロードしてください
  • インストーラーを実行してインストール(特に迷うことはないと思います。全て次へでインストールして大丈夫です)

2.拡張機能のインストール

日本語化パッケージの導入

初回起動時は英語でメニュー等が表示されていますので、日本語化を行います。英語のままで良い方は次の「Remote — SSHの導入」まで飛ばしてください。
拡張機能のインストールを行います。拡張機能は左パネルから選択します。(添付図の赤マルをクリック)

検索窓に「Japanese」と入れて「Japanese Language Pack…」となっている拡張機能の「install」をクリックします。

インストールが完了すると、再起動を促すメッセージが表示されますので、Visual Studio Codeを再起動します。

再起動するとメニューが日本語化されています。

Remote — SSHの導入

続いてRemote — SSH拡張機能をインストールしていきます。
この拡張機能は、SSH 接続越しにサーバー上のファイルを編集できるようにするものです。
日本語化と同じ様に検索窓に「Remote-SSH」と入力して、「Remote — SSH」をインストールします。
インストール後は再起動等は特に必要ありません。

3.SSH接続用のコンフィグ作成

インストールが完了すると左パネルに「リモートエクスプローラー」というメニューが追加されていると思います。
そちらをクリックして、表示される「SSH ターゲット」 の右側にある歯車アイコンを選択し、 SSH 接続用の config ファイルを作成します。

作成される(開かれる) configファイルに以下の内容を書き込みましょう。
(設定名として example を設定していますが、ここは任意の直で大丈夫です。

  • 公開鍵認証の場合
Host example
HostName [サーバーのIPアドレス]
User [ログインユーザー名]
Port 22
IdentityFile [秘密鍵のパス](例:C:\Users\userfolder\.ssh\privateKey.pem)
UserKnownHostsFile /dev/null
  • パスワード認証の場合
Host example
HostName [サーバーのIPアドレス]
User [ログインユーザー名]
Port 22
UserKnownHostsFile /dev/null

設定を入力したらCtrl+S等で保存します。
保存ができたら設定フィアルは閉じて構いません。

※他にも設定を追加したい場合は続けて書くことができます。

Host example01
HostName [サーバーのIPアドレス]
User [ログインユーザー名]
Port 22
UserKnownHostsFile /dev/null
Host example02
HostName [サーバーのIPアドレス]
User [ログインユーザー名]
Port 22
UserKnownHostsFile /dev/null

4.SSH接続で接続

設定ができたらSSHでサーバーへ接続していきます。
SSHターゲットに表示されているサーバーのうち、アクセスしたいサーバーの名前(ここでは先程作成したexampleを使用)の右側に表示されるウィンドウマークを押しましょう。

新しいウィンドウが立ち上がり、自動的に SSH 接続してくれます。
初回はプラットフォームとフィンガープリントを聞いてくると思いますので、プラットフォームを選び、続行を押してください。

ウィンドウ左下にサーバー名が表示されていれば接続完了です。

6.サーバー上のファイルの編集

通常の Visual Studio Code と同じように、フォルダを開いて編集を行なっていきます。
左側メニューから [エクスプローラー] を選び、「フォルダーを開く」 ボタンを押します。

ディレクトリを選択するメニューが表示されますので、編集を行いたいディレクトリを選択しましょう。

あとはそのディレクトリでファイルの編集を行っていくことができます。

また、Ctrl+Shift+@(windowsの場合)でターミナルを立ち上げる事ができます。

Dockderなどの開発サーバーを立ち上げながらファイルの編集ができたりするので便利です。

参考文献

--

--