SONICMOOV Googleページ

SublimeText2のSFTPを使って快適にサーバー上のプロジェクト修正をしよう

SublimeText2のSFTPを使って快適にサーバー上のプロジェクト修正をしよう

  • このエントリーをはてなブックマークに追加

こんにちは。 SublimeText2で普段仕事をしているジョニーです。 今回はそのSublimeText2のプラグインの一つである「SFTP」を一つ紹介したいと思います。紹介する内容とは以下の通りです。

目次

  1. SFTPとは
  2. SFTPの使い方
  3. SFTPのいろいろな設定方法

SublimeText2のプラグインSFTPとは

一言で言うと、ローカル環境で作成/修正したディレクトリやファイルを特定のサーバーにアップロードしたり、特定のサーバーにあるディレクトリ/ファイルなどをローカル環境にダウンロードするプラグインです。
上記の説明だけだと、直接サーバーにログインして修正、またはローカルにマウントしてそこで作業をすれば良いと思いますが、これらには以下のようなデメリットがあります。

  • 直接サーバーをいじってファイルを修正
    1. 毎回修正するたびにログインするのが手間
    2. コマンド操作に慣れている人でないと作業するのが難しい
  • ローカルにマウントして作業
    1. 使うエディタや、ネットワークの環境によってはカーソル移動でさえ重くなることがある
    2. 修正の保存や新しいファイルを作成するときも時間がかかることがある

上記に挙げたこともSFTPを使うとターミナル操作に慣れていない人でも、サーバーに置いてあるファイルを修正して即時反映させることも、マウントしたプロジェクトで起きるタイムロスを減らす事も出来るようになります。 SFTPを使うためにいくらかの下準備が必要になるので次の「SFTPの使い方」で実際に使うまでの方法を説明していきます。

SFTPの使い方

前提条件

以前のスタッフブログ記事(Sublime Text 2 を使ってみよう(コーダー編))の「Package を入れるための前準備」にも書かれてあるような手順を一通り終わらせていて、既にPackageをインストール出来る状態であることを前提に話を進めていきます。
まだPackageをインストール出来ない状態の場合は「Sublime Text 2 を使ってみよう(コーダー編)」を参考にPackageをインストール出来る状態にしておいてください。

また、私の作業環境がMacなこともありところどころMacの環境での説明になってしまうところもありますので、windowsユーザーの方は適宜それぞれの環境に合わせて読み進めていただけたらと思います。

SFTPを使えるようにするまでの流れ

  1. インストール
  2. 公開鍵の用意
  3. sshのconfig設定
  4. sftp-config.jsonの作成
  5. リモートサーバーの特定ディレクトリへの紐付け

1. インストール

「Tools > Command Palette」を選択し、表示されたパレットの「Package Control: install Package」を選択して「sftp」と検索して「SFTP」を選択してインストールしてください。

Sublime Text 2のSFTPのインストールその1

Sublime Text 2のSFTPのインストールその2

2. 公開鍵の用意

鍵の作成方法に関しては検索すると色々出てくるのでそちらを参考にしていただけたらと思います。
以下にいくつか参考になるページを挙げたのでそちらを確認していただければ作成出来ると思います。

3. sshのconfig設定

sshのconfigの設定も検索すると色々出てくるのでそちらを参考にしていただけたらと思います。
以下にいくつか参考になるページを挙げたのでそちらを確認していただければ作成出来ると思います。

4. sftp-config.jsonの作成

左のナビゲーションに表示されているディレクトリを右クリックして「SFTP/FTP > Map to Remote」をクリックするとsftp-config.jsonが作成され、右クリックしたディレクトリ直下に作成されます。

SFTP/FTP、Map to Remoteと選択

sftp-config.jsonの作成

5. リモートサーバーの特定ディレクトリへの紐付け

「sshのconfig設定」でセットした値を元に対応したプロパティにそれぞれ値を入れていく。

~/.ssh/config

Host sftp.server # ssh sftp.serverでログイン 
  HostName xxx.xxx.xxx.xxx # ログインするサーバーのipアドレス 
  User sftp_user # ログインする際のユーザー名 
  IdentityFile ~/.ssh/id_rsa # 秘密鍵

例として、~/.ssh/configに上記のような設定をされているサーバーの「/path/to/sftp_pfoject/」にあるプロジェクトと紐づけるとしたら以下の設定になる。

sftp-config.json

{
    // The tab key will cycle through the settings when first created
    // Visit http://wbond.net/sublime_packages/sftp/settings for help

    // sftp, ftp or ftps
    "type": "sftp",

    "save_before_upload": true,
    "upload_on_save": false,
    "sync_down_on_open": false,
    "sync_skip_deletes": false,
    "sync_same_age": true,
    "confirm_downloads": false,
    "confirm_sync": true,
    "confirm_overwrite_newer": false,

    "host": "sftp.server",    // ~/.ssh/configのHostプロパティの値をセット
    "user": "sftp_user",      // ~/.ssh/configのUserプロパティの値をセット
    //"password": "password",
    //"port": "22",

    "remote_path": "/path/to/sftp_pfoject/",  // 実際に作業するサーバー上のプロジェクトの絶対パスをセット
    "ignore_regexes": [
        "\\.sublime-(project|workspace)", "sftp-config(-alt\\d?)?\\.json",
        "sftp-settings\\.json", "/venv/", "\\.svn", "\\.hg", "\\.git",
        "\\.bzr", "_darcs", "CVS", "\\.DS_Store", "Thumbs\\.db", "desktop\\.ini"
    ],
    //"file_permissions": "664",
    //"dir_permissions": "775",

    //"extra_list_connections": 0,

    "connect_timeout": 30,
    //"keepalive": 120,
    //"ftp_passive_mode": true,
    "ssh_key_file": "~/.ssh/id_rsa",  // ~/.ssh/configのIdentityFileプロパティの値をセット
    //"sftp_flags": ["-F", "/path/to/ssh_config"],

    //"preserve_modification_times": false,
    //"remote_time_offset_in_hours": 0,
    //"remote_encoding": "utf-8",
    //"remote_locale": "C",
}

sftp-config.jsonの設定が完了した状態でsftp-config.jsonが入っているディレクトリを右クリックして「SFTP/FTP > Sync Remote -> Local 」をクリックすると「sftp.server」サーバー上の「/path/to/sftp_pfoject/」ディレクトリ内のファイル/ディレクトリをローカルに右クリックしたローカルディレクトリ内に差分だけダウンロードされます。

SFTP/FTP、Sync Remote、Localと選択

プロジェクト内のファイルを修正したり、ファイルを追加したりしてサーバーに変更分をアップロードしたくなった場合はダウンロード同じようなやり方で「SFTP/FTP > Sync Local -> Remote 」をクリックすれば差分だけアップロードされます。

差分ファイルのアップロード

SFTPの細かい設定方法

SFTPの使い方」で説明した以外にもsftp-config.jsonの各値のプロパティ値を修正するともっと細かく挙動を設定出来ます。

最後に現在の私の設定を紹介してSFTPの紹介を終わらせていただきます。

~/.ssh内のディレクトリ構成

.ssh/
  - config
  - id_rsa
  - id_rsa.pub
  - private_server.pem

~/.ssh/config

# private.serverにログインするための踏み台サーバー 
Host global.server 
  HostName xxx.xxx.xxx.xxx // グローバルIPアドレス 
  User global_jonny 
  IdentitiesOnly yes 
  IdentityFile ~/.ssh/id_rsa 

# global.serverからのみログイン出来る 
Host private.server 
  HostName xxx.xxx.xxx.xxx // プライベートIPアドレス 
  User private_jonny IdentityFile ~/.ssh/private_server.pem // global.serverからprivate_serverにログインする際に使用される秘密鍵をローカルに保持してprivate_server.pemにファイル名を変更 
  ProxyCommand ssh global.server nc %h %p

sftp-config.json

{
    // The tab key will cycle through the settings when first created
    // Visit http://wbond.net/sublime_packages/sftp/settings for help

    // sftp, ftp or ftps
    "type": "sftp",

    "save_before_upload": true,
    "upload_on_save": true,      // ファイルを保存するたびにアップロードするように変更
    "sync_down_on_open": false,
    "sync_skip_deletes": false,
    "confirm_downloads": false,
    "confirm_sync": true,
    "confirm_overwrite_newer": false,

    "host": "private.server",  // 踏み台サーバーを経由してログインするサーバーのHostをセット
    "user": "private_jonny",   // 踏み台サーバーを経由してログインするサーバーのUserをセット

    //"password": "password",
    //"port": "22",

    "remote_path": "/private.server/path/to/project/",
    "ignore_regexes": [
        "\\.sublime-(project|workspace)", "sftp-config(-alt\\d?)?\\.json",
        "sftp-settings\\.json", "/venv/", "\\.svn", "\\.hg", "\\.git",
        "\\.bzr", "_darcs", "CVS", "\\.DS_Store", "Thumbs\\.db", "desktop\\.ini"
    ],
    "file_permissions": "664",  // アップロードするファイルのパーミッションが664になるようにする
    "dir_permissions": "775",   // アップロードするディレクトリのパーミッションが775になるようにする

    //"extra_list_connections": 0,

    "connect_timeout": 30,
    //"keepalive": 120,
    //"ftp_passive_mode": true,
    "ssh_key_file": "~/.ssh/private_server.pem",
    //"sftp_flags": ["-F", "/path/to/ssh_config"],

    //"preserve_modification_times": false,
    //"remote_time_offset_in_hours": 0,
    //"remote_encoding": "utf-8",
    //"remote_locale": "C",
}

ここでは踏み台サーバーを経由しないとログイン出来ないサーバー上にあるプロジェクトを作業するために必要な設定を行っています。

基本的にsftp-config.jsonは今までと同じ書き方で、主に変更するのは~/.ssh/configの中身です。
~/.ssh/configの中身を上記のようにしていただければ踏み台サーバー経由の作業が出来るようになります。
~/.ssh/configの設定内容に関してはSSH_CONFIG (5)を参考にしていただけたらと思います。

sftp-config.jsonで修正しているところは日本語コメントが入力されている行で、それぞれのプロパティの値を変更して行っている事はコメントに書いてある通りです。

SublimeText2を使っている方も、そうでない方もサーバー上のファイル修正をリアルタイムですぐに反映させたいのであれば、SFTPプラグインを試してみる価値はあると思いますよ。

  • このエントリーをはてなブックマークに追加

記事作成者の紹介

ジョニー(フロントエンドエンジニア)

最近ずっとJavascriptばかりさわってたらJavascriptが好きになってきました。

関連するSONICMOOVのサービス

フロントエンドエンジニア募集中!

×

SNSでも情報配信中!ぜひご登録ください。

×

SNSでも
情報配信中!
SONICMOOV Facebookページ SONICMOOV Twitter SONICMOOV Googleページ
フロントエンドエンジニア募集中!

新着の記事

mautic is open source marketing automation