2024.03.24 2024.04.16

SFTPを使用してローカルで保存したソースコードをリモートサーバへ反映させる方法

hebishima.shogo

はい、hebiです。

Visual Studio Codeで修正したソースコードをCtrl +Sで保存した際に、瞬時にサーバに適用させる方法を記事にしたいと思います。

修正したソースコードをWinSCP等で適用するのはとてもめんどくさいので、この仕組みはとても便利です。

サーバ上のソースコードはバックアップされずに上書きされるので、ご注意ください。

環境はAmazon Linux 2023とします。

Contents

サーバー側環境作成
Visual Studio Codeの設定
ソースコード転送確認
最後に

サーバー側環境作成

ファイル転送を実現するために環境を構築します。

OpenSSHのインストール

ファイル転送を実現するためにOpenSSHをインストールします。

sudo yum install openssh-server

ポイント

私の場合、上記のコマンドを実行すると「already installed」と表示されました。Amazon Linux 2023にはデフォでインストールされているのかもしれません。

サービス起動

サービスを起動します。

sudo service sshd start

サービス自動起動設定

サーバーが再起動した際に自動的に立ち上がるように設定します。

sudo chkconfig sshd on

以上でサーバ側のインストールは完了です。

Visual Studio Codeの設定

Visual Studio Codeで保存した場合にソースコードを瞬時にアップするための設定を行います。

SFTP拡張機能のインストール

Visual Studio Codeの拡張機能「SFTP」をインストールします。

この拡張機能を使用すると、ローカルマシンとリモートサーバー間でファイルを同期することができます。

拡張機能に複数の「SFTP」がありました。この記事ではインストール数が多い方をインストールしています。

sftp.jsonファイル作成

Visual Studio Code上で「Ctrl + Shift + p」を押します。(Macの場合はCmd+Shift+P)
検索窓にsftp:configと入力して候補に出てくる「SFTP:Config」を選択すると、sftp.jsonが作成されます。

sftp.json修正

sftp.jsonを以下のように修正します。

{
    "name": "My Server",
    "host": "192.168.1.1",
    "protocol": "sftp",
    "port": 22,
    "username": "ec2-user",
    "remotePath": "/var/www/html/my_codeigniter_project",
    "privateKeyPath": "C:\\key\\codeigniter\\test.pem",
    "uploadOnSave": true,
    "ignore" : [
        "**/.vscode/**",
        "**/.git/**"
    ]
}