ラズパイ(Raspberry Pi 4B)をVisual Studio Codeでリモート操作する設定(備忘録)

ラズパイ4BとVSCodeをSSHリモートで接続する Raspberry Pi (ラズパイ)

    【目次】

    なぜVisual Studio Codeを使うことになったのか

  1. Visual Studio Code (VSCode)をダウンロードしてインストールする
  2. Visual Studio Codeを日本語化する(ラズパイ側は後の節で説明)
  3. ラズパイ側でviコマンドを使ってSSH設定する(sshd_config編集)
  4. VSCodeとラズパイをSSH接続し、リモート制御できるようにする
  5. SSHリモート上でラズパイ側のコマンドラインメッセージを日本語対応にする
  6. 最低限のセキュリティ設定
  7. ちょっとしたSSHトラブルシューティング
  8. VSCodeを完全削除(アンインストール)する方法
  9. まとめ

03.ラズパイ側でviコマンドを使ってSSH設定する(sshd_config編集)

ラズパイ側の設定はデフォルトでも問題無くSSH接続できるのですが、ここではよりセキュリティを高めるための設定をしていきます。

まず、ラズパイ(Raspberry Pi 4B)にモニターディスプレイ、USBキーボード、LANケーブルを接続し、電源を入れて起動し、ログインまで済ませておきます。

そうしたら、ls -a というコマンドを打ちます。
これは、カレントディレクトリ、つまりhomeディレクトリ内のファイルやフォルダ一覧を表示させるコマンドです。
下図の様に表示され、.ssh フォルダがあるのを確認します。青文字で表示されています。
その次に、cd .ssh と打って、.sshフォルダに移動し、再度ls -a と打ち、authorized_keys ファイルがあるのを確認します。これは、Raspberry Pi Imagerのインストールで入力したSSH用公開鍵が入っているファイルです。

(図03-01)

「ls -a」コマンドで確認

「ls -a」コマンドで確認

次に、以下のコマンドを打ちます。

sudo vi /etc/ssh/sshd_config

これは、ルートフォルダ内の/etc/ssh/sshd_config ファイルをviというテキストエディタで編集するというコマンドです。

(余談)
後で気付いたんですが、ラズパイ側でviテキストエディタを使わなくても、先にVSCodeと22番ポートで接続して、VSCode側でsshd_configファイルを編集した方が早いと思いました。

ルート内フォルダで管理者権限が必要なのでsudoコマンドを使います。
すると、下図の様に表示されます。先頭に#があって水色の文字はコメント行で、黄色い文字は有効なパラメータです。

(図03-02)

/etc/ssh/sshd_config ファイルをviエディタで編集

/etc/ssh/sshd_config ファイルをviエディタで編集

viエディタの使い方は以下です。

  • iキー:入力編集モード
  • 矢印キー:入力編集モード上でカーソル移動
  • Escキー:入力編集モードを抜ける
  • :wq:保存して編集終了
  • :q!:保存しないで編集終了

パラメータの先頭に#が付いているものは、必要に応じて#を消去してパラメータを有効にしていきます。

では、キーボードのi キーを押して編集モードに入り、矢印キーでPort という文字を探します。
すると、デフォルトで22 となっていると思います。
SSH接続はデフォルトのポート番号は22ですが、22は外部からの攻撃のターゲットになりやすいので、セキュリティを高めるために22は避けます。
ユーザーが自由に設定できるポート番号は、49152~65535番なので、そのうちの好きな番号にします。例えば、55555番と変更します(下図では77777となっていますがこれは誤りです。)。

(図03-03)

/etc/ssh/sshd_config ファイルをviエディタでポート番号を書き換え

/etc/ssh/sshd_config ファイルをviエディタでポート番号を書き換え

次に、今回は公開鍵認証を使うので、下図の様にパスワード接続はnoとします。
PasswordAuthentication no
そして、セキュリティ強化の為、空白のパスワードは不可としておきます。
PermitEmptyPasswords no

(図03-04)

次に、セキュリティ強化のため、ルートユーザーでのログインは禁止とします。
PermitRootLogin no

(図03-05)

次に、公開鍵認証を有効にします。
PubkeyAuthentication yes

(図03-06)

次に、SSH公開鍵ファイルのパスを指定します。
これは先ほど確認した authorized_keys ファイルのパスを指定しますが、authorized_keys2も念のため指定しておきます。
AuthorizedKeyFile      .ssh/authorized_keys .ssh/authorized_keys2

(図03-07)

とりあえず、以上で:wq と入力してエンターを押し、保存して終了します。

(図03-08)

「:wq」キーを打って、保存して終了後、viエディタを抜ける

「:wq」キーを打って、保存して終了後、viエディタを抜ける

すると、下図の様に表示されます。

(図03-09)

viエディタを抜けた様子

viエディタを抜けた様子

次にめちゃめちゃ忘れがちなのですが、SSHを再起動してSSH設定を反映させなければなりません。
下図の様に以下のコマンドを打ちます。

sudo /etc/init.d/ssh restart

(図03-10)

SSHの再起動

SSHの再起動

以上でひとまずのラズパイ側のSSH設定は終了です。
一応これでsudo reboot して、ラズパイを再起動しておいた方が良いと思います。

04.VSCodeとラズパイをSSH接続し、リモート制御できるようにする

では、いよいよラズパイとVSCodeをSSH接続して、リモート制御できるようにしていきます。

まず、ラズパイ(Raspberry Pi 4B)にLANケーブルを挿して、電源を入れて起動しておきます。
この時、ログインしなくてもOKです。
ディスプレイモニターやキーボードはここからは不要ですが、心配なら接続していてもOKです。
SSDドライブのLEDインジケーターが点滅から点灯に変わっていれば起動完了済みという状態だと思います。
そうしたら、パソコン側のVSCodeを起動します。

04-01.拡張機能のRemote Developmentを使ってラズパイとVSCodeをSSH接続する

次に、下図の様な左側の拡張機能アイコンをクリックします。

(図04-01)

VSCode 拡張機能アイコンをクリック

VSCode 拡張機能アイコンをクリック

次に、下図の様に「remote development」と入力すると、Microsoft公式の「Remote Development」が表示されるので、「インストール」をクリックします。

(図04-02)

VSCode拡張機能Remote Developmentをインストール

VSCode拡張機能Remote Developmentをインストール

すると、下図の様にインストール開始します。

(図04-03)

インストール中

インストール中

インストールは直ぐに終わり、下図の様にリモートエクスプローラーアイコンが追加され、4つの拡張機能がインストールされます。

Remote Development
Remote – SSH
Remote Explorer
Remote -SSH: Editing Configuration Files

(図04-04)

VSCode拡張機能Remote Development関連が4つインストールされた

VSCode拡張機能Remote Development関連が4つインストールされた

次に、下図の様に、左側のリモートエクスプローラーアイコンをクリックし、「Containers」の右横のプルダウンマークをクリックし、「リモート」をクリックします。

(図04-05)

リモートエクスプローラーのリモートをクリック

リモートエクスプローラーのリモートをクリック

すると、下図の様に「SSH」という項目が表示されるので、そこにマウスを当てると歯車アイコンが表示されるので、それをクリックします。(下図では鍵アイコンと書いてありますが間違いです。スミマセン)

(図04-06)

歯車アイコンをクリック

歯車アイコンをクリック

すると、下図の様に表示されるので、
C:\Users\ユーザー名\.ssh\config
をクリックします。

(図04-07)

C:\Users\ユーザー名\.ssh\config をクリック

C:\Users\ユーザー名\.ssh\config をクリック

すると、下図の様に自分のWindowsパソコンのC:\Users\ユーザー名\.ssh フォルダに拡張子無しのconfigファイルが作成され、その編集画面になります。
下図の様に白い点はまだ保存されていないことを示しています。

(図04-08)

configファイルを開いた様子

configファイルを開いた様子

このconfigファイルのパラメータの書き方はコメントにあるように以下のサイト
https://linux.die.net/man/5/ssh_config
を開けば解説してあります。

ここでは仮に下図の様に入力します。

Host xxxxxx
HostName xxxxxxxxxx.local
User xxxxxxxx
IdentityFile ~/.ssh/raspi_key
Port 55555
IdentitiesOnly yes
PasswordAuthentication no
TCPKeepAlive yes

(図04-09)

configファイルの編集例

configファイルの編集例

  • Host:前回記事のRaspberry Pi Imagerインストール時に入力したHost名
  • HostName:Host名に.local を加えたもの
  • User:前回記事のRaspberry Pi Imagerインストール時に入力したユーザー名
  • IdentityFile:前回記事で作成したSSH秘密鍵の保存してある場所。
    チルダとスラッシュを使ってパスを入力する。~/.ssh/raspi_key
  • Port:前節で指定したラズパイ側のポート番号と同じにする。
  • IdentitiesOnly:公開鍵認証のみにするかどうか。yes
  • PasswordAuthentication:パスワードの接続をするかどうか。no
  • TCPKeepAlive:TCP keep alive メッセージを送るかどうか。yes

そうしたら、上書き保存して閉じます。

次に、下図の様に右側のリモートエクスプローラーのSSHのところをクリックします。

(図04-10)

リモートエクスプローラーのSSHのラズパイユーザー名をクリック

リモートエクスプローラーのSSHのラズパイユーザー名をクリック

すると、下図の様になるので、下図の様な矢印マークをクリックすると、ウィンドウのままラズパイ側とリモート接続します。

(図04-11)

「→」アイコンをクリック

「→」アイコンをクリック

すると、下図の様になるので、「Linux」をクリックします。

(図04-12)

linuxをクリック

linuxをクリック

次に「続行」をクリックします。

(図04-13)

続行をクリック

続行をクリック

次にSSHの秘密鍵のパスフレーズを求められるので、前回記事で決めた秘密鍵のパスフレーズを入力します。
ここで要注意ですが、入力するのはログインパスワードではありません。私は何度も同じ間違いをしてハマった覚えがあります。しばらく使っていないと秘密鍵のパスフレーズの存在を忘れてログインパスワードを入力してしまうんですね。気を付けたいところです。

(図04-14)

※SSH秘密鍵のパスフレーズを入力(ラズパイのログインパスワードではないことに注意)

※SSH秘密鍵のパスフレーズを入力(ラズパイのログインパスワードではないことに注意)

SSH接続成功すると、下図のようになります。
左下端のようにSSH: xxxxxx となっていればOKです。
接続成功しても、画面があまり変わらないので、ちょっと拍子抜けです。

(図04-15)

ラズパイとSSHリモート接続完了した様子

ラズパイとSSHリモート接続完了した様子

因みに、上図のように右下のメッセージはこんなメッセージでした。

You selected “linux” as the remote platform – this will be stored in the setting “remote.SSH.remotePlatform” and can be changed there if needed.

翻訳すると、

リモート プラットフォームとして「linux」を選択しました。これは設定「remote.SSH.remotePlatform」に保存され、必要に応じてそこで変更できます。

ま、今の所あまり関係無いメッセージですね。放置しておきます。

次に、本当に接続できてLinuxコマンドが入力できるか確認してみます。

下図の様にメニューの「ターミナル」をクリックし、「新しいターミナル」をクリックします。

(図04-16)

「ターミナル」→「新しいターミナル」をクリック

「ターミナル」→「新しいターミナル」をクリック

すると、下図の様になって、ラズパイにログイン出来て、Linuxコマンドプロンプト状態になりました。

(図04-17)

VSCodeのターミナルでSSH接続のラズパイ側のコマンドラインが表示された様子

VSCodeのターミナルでSSH接続のラズパイ側のコマンドラインが表示された様子

これ、ちょっと不思議な感じしませんか?
ラズパイにログインしていないのに、SSHの秘密鍵パスフレーズでログインまでできてしまったんですよ。
これが、公開鍵認証のみ有効にしたSSH接続というやつです。
すばらし!!!

では、VSCode側からラズパイをシャットダウンできるのか試してみます。
以下のコードを打ちます。

sudo shutdown -h now

(図04-18)

sudo shutdown -h nowでラズパイがシャットダウンできるか試す

sudo shutdown -h nowでラズパイがシャットダウンできるか試す

前回記事では、ラズパイ側のコマンド入力では、sudoを使うとパスワードを求められましたが、SSH接続では不要みたいですね。

しばらく経つと、ラズパイ側のSSDドライブLEDインジケーターが消えて、VSCode側に以下のメッセージが表示されます。

(図04-19)

この画面が出れば、SSH接続が遮断されたことになる

この画面が出れば、SSH接続が遮断されたことになる

こうなれば、「キャンセル」をクリックしてVSCodeを閉じればOKです。
やったぜ~!!!

これでラズパイとVSCodeとのSSH接続完了です。

これからは、ラズパイには下図の様にSSDドライブとLANケーブルを接続するだけで、あとは全てパソコン側で操作することになります。
便利だぜぃ!!!

(図04-19-2)

ラズパイに挿したSSDドライブのLEDインジケーターが消灯した様子

ラズパイに挿したSSDドライブのLEDインジケーターが消灯した様子

04-02. VSCode側でフォルダやファイル操作できるようにする

ラズパイとSSH接続できるようになったら、次はVSCode側でフォルダやファイル操作できるようにします。

まず、下図の様に左上のエクスプローラーアイコンをクリックし、「フォルダ―を開く」をクリックします。

(図04-20)

リモートエクスプローラーのフォルダ―を開くをクリック

リモートエクスプローラーのフォルダ―を開くをクリック

すると、下図の様な画面になるので、ラズパイの/home/ログイン名/ のところで「OK」をクリックします。

(図04-21)

/home/ログイン名/ を選択し、「OK」をクリック

/home/ログイン名/ を選択し、「OK」をクリック

すると、下図の様にSSH秘密鍵のパスフレーズを求められるので入力します。(※ログインパスワードではないことに注意!)

(図04-22)

※SSH秘密鍵のパスフレーズを入力

※SSH秘密鍵のパスフレーズを入力

すると、下図の様に「このフォルダ内のファイルの作成者を信頼しますか?」という画面が出るので、「親フォルダ―’home’内のすべてのファイルの作成者を信頼します」にチェックを入れて、「はい、作成者を信頼します」をクリックします。

(図04-23)

作成者を信頼しますにチェックする

作成者を信頼しますにチェックする

すると、下図の様にエクスプローラー欄にラズパイの/home/ユーザー名/ 以下のフォルダ一覧が表示されるようになり、VSCodeの一番下のバーが水色に変化します。
これでラズパイ内のファイル操作ができるようになりました。
やったぜぃ!

(図04-24)

SSHリモートフォルダを開くと、下のバーが水色に変わる

SSHリモートフォルダを開くと、下のバーが水色に変わる

因みに、本当にこのフォルダ一覧が正しいのか、ターミナルのコマンドで確かめてみます。
下図の様にメニューの「・・・」をクリックし、「ターミナル」→「新しいターミナル」をクリックします。

(図04-25)

新しいターミナルをクリック

新しいターミナルをクリック

すると、下図の様にLinuxコマンドラインになるので、フォルダ一覧を表示させる以下のコマンドを打ちます。

ls -a

すると、下図の様に表示されます。
エクスプローラーの表示と全く同じですね。

(図04-26)

「ls -a」コマンドの様子

「ls -a」コマンドの様子

 

因みに、下図の様に.profile をクリックすると、エディタ画面になり、ラズパイ側のviコマンドを使わずとも編集できるようになっていることが分かります。
スバラシイ!!!

(図04-27)

「.profile」ファイルの編集画面を開いた様子

「.profile」ファイルの編集画面を開いた様子

また、下図の様に.ssh フォルダをクリックして、authorized_keys ファイルをクリックすると、前回記事で紹介したように、Imagerによるインストールで入力した公開鍵が存在することが分かりますね。

(図04-28)

.ssh/authorized_keys ファイルを開いた様子

.ssh/authorized_keys ファイルを開いた様子

これで何でもできそうな気がしてきましたよ。

でも、先ほどラズパイ側のviコマンドで編集したルート配下にあったsshd_configファイルはどうやって編集するのでしょうか?
次で説明したいと思います。

04-03. ラズパイのルート配下のファイルをVSCodeで操作する方法

前節ではラズパイのhomeディレクトリ以下のファイル操作はできましたが、では、ルート配下のファイルはどう操作すれば良いのでしょうか?

まず、下図の様にエクスプローラー欄の下側の空白の部分を右クリックして、「ワークスペースにフォルダ―を追加」をクリックします。

(図04-31)

「ワークスペースにフォルダ―を追加」をクリック

「ワークスペースにフォルダ―を追加」をクリック

すると、下図のように表示されるので、.. をクリックします。

(図04-32)

「..」をクリック

「..」をクリック

すると、下図の様に/homeフォルダの上の階層に行き、ルート配下のフォルダが表示されるので、etc をクリックします。

(図04-33)

/etc をクリック

/etc をクリック

そうしたら下図の様になるので、ここで初めて「OK」をクリックします。

(図04-34)

すると、下図の様になるので、「はい」をクリックします。

(図04-35)

すると、下図の様にエクスプローラー欄にルート配下のetc フォルダ内一覧が表示されます。

(図04-36)

ルート配下の/etc フォルダのファイル一覧が表示された様子

ルート配下の/etc フォルダのファイル一覧が表示された様子

そうしたらスクロールして、ssh フォルダをクリックします。

(図04-37)

/etc/ssh フォルダをクリック

/etc/ssh フォルダをクリック

そうしたら、下図の様にsshd_config ファイルをクリックすると、エディタで編集できるようになります。

(図04-38)

/etc/ssh/sshd_config ファイルをクリック

/etc/ssh/sshd_config ファイルをクリック

これでお分かりの通り、先に紹介したラズパイ側のviエディタで編集するよりも、先にSSH接続を完成させてからsshd_configファイルをVSCodeで編集した方が手っ取り早かったのかも知れませんね。

ところで、一度sshd_configファイルを設定したら、ルート配下のファイルを誤って削除してしまうことを防ぐために、ワークスペースにルート配下のファイルはリモートエクスプローラーに表示させておかない方が良いです。その場合、VSCodeを閉じる時に「ワークスペースにフォルダを保存しますか」とメッセージが出るので「いいえ」をクリックしておけば、次にVSCodeを起動してもetcフォルダは表示されません。

では、次はラズパイ側のコマンドラインメッセージの日本語化と最低限のセキュリティ設定等を説明します。

コメント

  1. たそがれローディー より:

    大変参考になりました。ありがとうございます。

    • mgo-tec mgo-tec より:

      たそがれローディーさん

      記事をご覧いただき、ありがとうございます。

      去年の2月に投稿したものですけど、うれしいコメントありがとうございま~ス!!!
      (^^)

タイトルとURLをコピーしました