techno_memo

個人用の技術メモ。python・ROS・AI系のソフトウェア・ツールなどの情報を記載

VS codeでRemote SSH/SFTPを利用した開発環境の構築

この記事の目的

Visual studio codeを用いて他PCのプログラムを変更しやすいRemote SSH開発環境構築をする方法について記述する

1. Visual studio code へのRemote SSH

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

marketplace.visualstudio.com

リモート先のLinux PCには事前にopenssh-serverをインストールしておく。

導入後にsshの設定を行う。拡張機能の『リモートエクスプローラ』の『SSH Targets』を選択し、設定画面を表示する。

f:id:sd08419ttic:20210911150739p:plain

最小構成の設定内容は下記に従う。下記以外に公開鍵認証を設定してパスワードを毎回入力せずに利用することもできる。

設定内容 説明
Host Remote SSHの接続先ホストの名称(ユーザが識別しやすい任意の名前)
HostName 接続先のIPアドレス、もしくは解決可能なホスト名
User 接続先へのログインで使用するユーザー名
Port 接続に使用するポート名 (通常は22)

上記の設定を完了後、リモートエクスプローラで開きたいホストの右にある"Connect to Host in New Window"で接続する。

OSの種別とパスワードを入力するとリモート先のPCに接続できる。

f:id:sd08419ttic:20210911153811p:plain

接続後はホスト上の任意のフォルダ・ファイルを開いて通常のVS codeと同じようにファイルの編集等を行うことができるようになる。

f:id:sd08419ttic:20210911155533p:plain

ただし、拡張機能の一部はリモート先へのインストールが必要となるものがあるため必要なものを指定してインストールする必要がある。

f:id:sd08419ttic:20210911155815p:plain

2. リモート先PCでのgit操作

上記手順でリモート先PCへSSH接続すると、VS code上からgithubコマンドを実行することが可能となる。 VS Codeでのgit操作は下記記事に記載している。 sd08419ttic.hatenablog.com

ただし、git操作はリモート先から実行された扱いになるのでローカルネットワーク内のPC (社内LAN内のみで運用しているLinux PC等)にSSHで接続し、githubからのpush/pullするなどといった操作はできない。

3. SFTPを利用したリモートPCとのファイル同期

ローカルネットワーク内のリモートPCにあるソースコードを同期したい場合、拡張機能SFTPを利用することができる。

marketplace.visualstudio.com

SFTPをインストール後、任意のフォルダを開いた状態でコマンドパレットから”SFTP:Config”を選択し、SFTPの接続設定を行う。 主要な項目は下記となる。

設定内容 説明
name 接続先ホストの名称(ユーザが識別しやすい任意の名前)
host 接続先のIPアドレス、もしくは解決可能なホスト名
protocol 接続用プロトコル :sftp
username 接続先へのログインで使用するユーザー名
remotePath 接続先のファイルパス(ソースコードのあるフォルダを設定しておくと管理しやすい)
uploadOnSave ファイル更新時の自動保存

上記を設定後にコマンドパレットから"Sync Remote -> Local"でリモートからローカルへのダウンロード、"Sync Local -> Remote"でアップロードを行う。

この方法をRemote SSHと組み合わせて使うとgit管理しているソースコードをリモートへ容易に同期できる。

  • githubからローカルPCの任意フォルダにリポジトリをclone
  • ②SFTPでリポジトリをリモートPCへアップロード
  • ③Remote SSHでログインしソフトの実行、デバッグ、編集等を行う (必要に応じてgit commit)
  • ④リモートPCでの作業完了時にSFTPで作業後のソースコード等をローカルPCにダウンロード
  • ⑤変更内容をgit push