VS CodeのRemote Developmentを設定してみた ─SSH編

引き続いてVS CodeでVPSにあるCentOS 7に接続してみることにした。

前回はこちら。

SSH接続の手順はこちら。

 何も設定せずに接続してみる

 ダメもとで上記設定記事を見ずに接続してみる。左下の_＞^＜をクリックをして、

メニュー表示されるRemote-SSH:Connect to Host…をクリック。こんなダイアログが出る。

 素直にsshコマンドを入れてみた。

 右下にこの表示。やっぱりダメだった。接続先はVPSにあるCentOS 7.3の64bit環境だし、上ではreachableだった上にLinux x86_64なので、何か問題があるようだ。

設定手順通りにやってみる

Developing on Remote Machines using SSH and Visual Studio Code

Connect to a remote host

Visual Studio Code uses SSH configuration files and requires SSH key based authentication to connect to your host. If you do not have a host yet, you can create a Linux VM on Azure or setup an SSH host on an existing machine.

このVPSのCentOSにはキーを設定していなかった。

ということで、公開鍵認証の設定。手順はこちらを参照。

WSLで作成。

id_rsa.pubをアップロード。

以下、SSH用のユーザを作り、~/.ssh/authorized_keysを追記し、所有者設定を行った。

VS Code側の設定

このPCではWindowsからSSH接続をしたことが無いので、下から2番目のRemote Developmentをクリックすると、

SSHホスト無いぞ、SSH ホストを設定しろよ　と出る。

 ということでC:/Users/shigeo-t/.ssh/configファイルを作成する。 

 こんな風に作成。

設定が済んだので接続してみる 

VS Codeを再起動し、左の Remote Developmentアイコンをクリックすると、接続先が現れた。早速クリック。

 上部中央に選択ダイアログが出る。追加したホストをクリックする。

今度はパスフレーズを聞いてくる。

新しいVS Codeのウィンドウが開く。

 しかし、下記のダイアログが出る。上にも書いたようにこのPCではWindowsからSSH接続をしたことが無い。いっつもWSLからSSH接続するんだもん。

[Configure SSH Agent]をクリックすると、下記のページを開く。

該当部分を読むと管理者モードPowerShellを起動し、下記のコマンドを入れろとある。

Windows:

To enable SSH Agent automatically on Windows, start PowerShell as an Administrator and run the following commands:

# Make sure you're running as an Administrator
Set-Service ssh-agent -StartupType Automatic
Start-Service ssh-agent
Get-Service ssh-agent

Now the agent will be started automatically on login.

 実行してみた。

今度は右下にこれが出て、

左下はこの状態に変化し、接続できた。

フォルダを開く

404.phpを開いてみる。VPSにあるPHPのソースをそのままVS Code上で表示できる。

以降は左下の_＞^＜をクリックをして選択ダイアログを出す方法でも、左のバーにあるRemote Developmentのアイコンをクリックして接続先から接続先ホストアイコンをクリックして接続する方法でも問題なく接続できる。

ということで今回はここまで。リモート接続している時に、編集以外のことはまだやっていないので、それはまた別途。

ふだん使いするWindows PowerShell

Visual Studio Code Distilled: Evolved Code Editing for Windows, macOS, and Linux