Mac OS XでエックスサーバーにSSH接続

年末間際にエックスサーバーでSSH接続が出来るようになったと聞いたのでMac OS X環境からアクセスしてみました。
マニュアルを見たところ公開鍵認証方式のみでパスワード認証には対応していないとの事。なのでSSHクライアントからの接続のみかなと思いましたが鍵情報登録したらFilezillaのSFTPにも対応できるみたいですが、うちの環境だとFilezillaが途中で止まりましたね・・・
Tera Termとか使用している人はマニュアルに沿って行けば問題ないと思うのでそちらを参照ください。
xserver-ssh-01

INDEX

  1. サーバーパネルのSSH設定について
  2. [公開鍵認証用鍵ペアの生成]からの設定
  3. [公開鍵登録・設定]からの設定
  4. ターミナルからSSH接続を実行
  5. 参考サイト

サーバーパネルのSSH設定について

xserver-ssh-02
“エックスサーバーコントロールパネル > サーバーパネル > SSH設定”のメニューは[SSH設定] [公開鍵認証用鍵ペアの生成] [公開鍵登録・設定]の3つ。

[SSH設定]ではSSH接続機能のON/OFF切り替えを行う。デフォルトではOFF。

SSH接続設定方法は2通り用意されており、[公開鍵認証用鍵ペアの生成]、[公開鍵登録・設定]となります。設定は後述。

というわけで、[SSH設定]でSSH機能の使用状態をONにし、[公開鍵認証用鍵ペアの生成]からの設定、もしくは[公開鍵登録・設定]からの設定へ。

[公開鍵認証用鍵ペアの生成]からの設定

xserver-ssh-03
1つ目の設定方法、[公開鍵認証用鍵ペアの生成]では公開鍵認証用の鍵ペア(公開鍵・秘密鍵)を自動で生成してくれます。
パスフレーズを入力して「公開鍵認証用の鍵ペア生成(確認)」をクリック、続けて次ページにて「公開鍵認証用の鍵ペア生成(確定)」をクリックで公開鍵・秘密鍵が生成されます。秘密鍵は”サーバID.key”というファイル名でダウンロードされ、公開鍵はサーバ上 /.ssh/authorized_keys へ保存されます。
xserver-ssh-04

ダウンロードされた”サーバID.key”秘密鍵はファイル名を”id_rsa”にリネームし /Users/ユーザ名/.ssh/ に移動。
リネーム時に拡張子.keyが残るのでファイルの「情報を見る」より拡張子を削除する。
xserver-ssh-05

一通り設定が完了したので次の項は飛ばしてターミナルからSSH接続を実行へ。

[公開鍵登録・設定]からの設定

xserver-ssh-06
2つ目の設定方法、[公開鍵登録・設定]ではMacのターミナルで公開鍵認証用の鍵ペア(公開鍵・秘密鍵)を生成し、上図公開鍵部分へ公開鍵を登録します。手順は以下の通り。

ターミナルを起動しssh-keygenを実行し鍵ペアを生成。
保存場所、鍵名を聞かれるのでそのままEnter。

$ ssh-keygen
Generating public/private rsa key pair.
Enter file in which to save the key (/Users/ユーザ名/.ssh/id_rsa):

鍵名を変更したい場合は以下の通り。
※鍵名はデフォルトではid_rsa、id_dsa、identity以外登録されていないので /etc/ssh_config の IdentityFileプロパティに追加する必要あり

Enter file in which to save the key (/Users/ユーザ名/.ssh/id_rsa): /Users/ユーザ名/.ssh/hoge_rsa

パスフレーズを求められるので入力。

Enter passphrase (empty for no passphrase):

確認用にもう一度求められるので再度入力。

Enter same passphrase again:

鍵ペアの生成が完了。
xserver-ssh-07

/Users/ユーザ名/.ssh/にid_rsa(秘密鍵)id_rsa.pub(公開鍵)が作成されます。
xserver-ssh-08

id_sra.pubをテキストエディタで開いてコピー。エックスサーバーサーバパネルの[公開鍵登録・設定]の公開鍵部分にペーストして「公開鍵を登録する(確認)」をクリック。続けて次ページにて「公開鍵を登録する(確定)」をクリックでサーバ上に公開鍵情報が登録されます。
xserver-ssh-09
公開鍵はサーバ上 /.ssh/authorized_keys へ保存されます。

xserver-ssh-04

サーバ上に公開鍵、Mac OS X上に秘密鍵が準備できたのでターミナルからSSH接続を実行へ。

ターミナルからSSH接続を実行

2通りのSSH接続設定、[公開鍵認証用鍵ペアの生成]、[公開鍵登録・設定]を行いましたが、共にサーバ上には /.ssh/authorized_keys が登録、Max OS X上には秘密鍵 /Users/ユーザ名/.ssh/id_rsa が保存されたのでターミナルからSSH接続を実行して行きます。

ターミナル起動。
$ ssh サーバID@サーバID.xsrv.jp -p 10022 で接続。(サーバIDは仮に”hogehoge”とする)
※接続ポートはエックスサーバー側で10022に制限されているので-pオプションで使用ポートを指定します。

$ ssh hogehoge@hogehoge.xsrv.jp -p 10022

なお、/Users/ユーザー名/.ssh/id_rsaのパーミッションが他のユーザからアクセス可能なもの(644等)の場合以下エラーが発生するので秘密鍵のパーミッションは600にしておく。

@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
@         WARNING: UNPROTECTED PRIVATE KEY FILE!          @
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
Permissions 0644 for '/Users/ユーザ名/.ssh/id_rsa' are too open.
It is recommended that your private key files are NOT accessible by others.
This private key will be ignored.
bad permissions: ignore key: /Users/ユーザ名/.ssh/id_rsa
Permission denied (publickey,gssapi-with-mic).

パーミッション変更方法は以下の通り。

$ chmod 600 /Users/ユーザ名/.ssh/id_rsa

再度、SSH接続実行。初回接続時は以下が表示されるかもしれない(うろ覚えです)ので”yes”を入力してEnter。

The authenticity of host '[hogehoge.xsrv.jp]:10022 ([xxx.xxx.xxx.xxx]:10022)' can't be established.
RSA key fingerprint is xx:xx:xx:xx:xx:xx:xx:xx:xx:xx:xx:xx:xx:xx:xx:xx.
Are you sure you want to continue connecting (yes/no)? 

ポップアップが開きSSHキー”id_rsa”のパスワードを聞かれるので登録したパスフレーズを入力しOK。
xserver-ssh-10

これでエックスサーバーにSSH接続する事ができました。
試しにWordPressインストールディレクトリに移動し一覧を表示してみました。
xserver-ssh-11

というわけで年末と全くない記事でしたが来年もよろしくお願い致します。

参考サイト

NetBeans IDE 7.1でプラグインを無効化したら動かなくなった対処法

NetBeans IDE 7.1は動作が軽いので愛用してるのですが更に軽くできないかと “ツール > プラグイン > インストール済み” を見ると有効になっているプラグインがいっぱい。
「PHP Smarty フレームワーク」とか使ってないし・・・と不要っぽいプラグインを無効化していったら動かなくなったので対処法を。
NetBeans IDE 7.1 プラグイン画面

起動しても何も表示されないorz

プラグインを適当に無効化した後再起動すると下の様な感じに。
エディターもプロジェクトもメニューすら表示されていません。
NetBeans IDE 動作しないよ

右下を見ると何やら赤い警告が。クリックしてみると。
エラー警告
更に警告の詳細を見てみる。
エラー警告詳細
Javaらしきエラーが表示されているようですがさっぱりわかりません。

というわけでいつものようにGoogle先生に頼ることに。
プラグインを無効にしたのだからその設定ファイルがあるはず。ということで辿り着いたのがこちら。
自分実験室 : netbeansプラグインの有効・無効化を直接切り替える

プラグインの有効・無効を直接切替える

プラグインの設定ファイルは “C:\Users\(ユーザ名)\.netbeans\7.1\config\Modules\” にxmlファイルで格納されているとのこと。
プラグイン設定ファイル郡

これらxmlファイルにプラグインの有効・無効の設定が保存されているので全て有効にしていくことに。
以下はzencodingプラグイン設定xmlファイルの中身です。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE module PUBLIC "-//NetBeans//DTD Module Status 1.0//EN"
                        "http://www.netbeans.org/dtds/module-status-1_0.dtd">
<module name="org.lorenzos.zencoding">
    <param name="autoload">false</param>
    <param name="eager">false</param>
    <param name="enabled">false</param>
    <param name="jar">modules/org-lorenzos-zencoding.jar</param>
    <param name="reloadable">false</param>
</module>
	

7行目に有効・無効の設定値enabledがあるので有効にするために値をtrueに変更します。
動かなくなった原因はコアプラグインを無効化したことだろうけど、どれが原因かわからなかったので取り敢えず全ての設定をtrueに修正しました。

そしてNetBeans IDEを再起動!
みごとメニューも表示され問題なく動作もするのですがまだ右下に警告が。

キャッシュがどーとか、ロックが掛かってるとか・・・よくわかりません。
でも “C:\Users\(ユーザ名)\.netbeans\7.1\var\cache\” あたりが原因かな、ということでchcheフォルダをバックアップを取った後削除。
再度再起動。
ようやくエラーも表示されず見慣れた画面が表示されました。

というわけで、設定はあまり弄り過ぎないようにという教訓でした。

Windows7でSCSS+Compass(導入編)

半年ほど前からSCSS(Sass)LESSについては聞いていたのですが腰が重く手をつけていなかったのですが最近TwitterのTLでよく見かけたので導入してみました。

明確な定義はよく分かっていませんが「CSSを拡張できるmeta言語」という説明をよく見かけたのでCSSを効率的に記述できるようになるフレームワークのようなものという認識です。

SCSSとSassが混同してしまいそうですが、Sassから派生したのがSCSS(Sassy CSS)らしく、記述方法もCSS同様 a { display: none; } の様に波括弧を使用しており慣れているので以下ではSCSSで統一します。

参考にさせて頂いたサイト

この記事を見ずとも参考サイトさえ見ればSCSS/LESSが理解できる、というくらい情報が豊富だったので列挙しておきます。

Less & Sass Advent calendar 2011
昨年度のAdvent Calender。SCSS/LESSに限らずCSSmeta言語やCompassフレームワークについて等、最新・マニアック?な情報が豊富です。以下参考サイトはほぼこちらから。
CSS拡張メタ言語「SCSS(Sass)」と「LESS」の比較 – (DxD)∞
SCSSとLESSのどちらを導入するか迷って、SCSSに決めたポイント – 眠る前に布団にはいろうか
まずSCSSとLESSどちらを導入するか、という点で参考にさせて頂きました。
LESSはnode.jsが必要(node.js分からない)、もしくはクライアント側JavaScriptで動的に生成(動的なのでパフォーマンス面で不安)という理由からRubyさえあれば導入できるSCSSにしました。
Sass を今すぐ実務で使おうよ! « NAVER Engineers' Blog
SCSSを導入して実際にどのように運用すれば良いのか、という実務について。
個人的には便利だけどクライアント側に導入してもらうには敷居が高いので制作時の効率化の為に使う、というのが現在の考えです。
サーバによってはSCSS自体導入不可なところもありますし。
hamashun.me : Windows PC に Ruby と Sass を導入する方法
既にWindowsにRubyをインストールしていたのですがバージョンが古かったこともあり最新版を導入する際に参考にさせて頂きました。
CSS書くならcompass使った方がいいよ。SASS使ってる人なら特に。 | howtohp
Compassを使ってSassのCSS出力を手軽にしよう|Blog|Skyward Design
SCSSを更に便利に使えるフレームワークCompassの導入・使い方について。
CSS3のborder-radiusやReset用CSSのMixinが含まれていて開発効率アップしそう、またSassコマンドより分かりやすいCompassコマンドが便利です。
NetBeansではじめるSCSS | Webエンジニアライフ
Netbeans IDE用のscss-editorの解説。プラグイン自体は便利だと思うのですが私の知識不足の為かCompass導入時にコンパイルエラーが発生してしまったので自動コンパイルは使用せずに整形の為に利用しています。

WindowにRuby、SCSS、Compassをインストールする

SCSSはRubyベースなのでWindowにRubyをインストールする必要があります。
hamashun.me : Windows PC に Ruby と Sass を導入する方法に詳しくありますが一応・・・。

Windows7にRubyをインストール

RubyInstaller for WindowsのDownlaodよりRubyInstallerをダウンロード。
rubyinstaller-1.9.3-p0.exe(12/01/17現在)を使用しました。
rubyinstaller

ダウンロードしたrubyinstaller-1.9.3-p0.exeを起動して手順どおりにインストール。
OSがCドライブの場合Cドライブ下にRuby193フォルダが生成されます。
コマンドプロンプトを起動して以下コマンドを入力。

ruby -v


上のようなエラーが出てくると思うのでRubyへのパスを通す必要があります。
“コントロールパネル > システムとセキュリティ > システム > システムの詳細”よりシステムのプロパティが開くので”詳細設定タブ > 環境変数”のシステム環境変数の中のPathの末尾に C:¥Ruby193¥bin を追加します。

環境設定を保存後再度上記コマンド入力で以下の通り現在のRubyのバージョンが表示されパスが通ったことが確認できると思います。

RubyGemsでSCSS、Compassをインストール

Rubyインストール時にRubyのパッケージ管理ツール”RubyGems”がインストールされているのでそれを用いてSCSS、Compassをインストールします。
が、その前にRubyGems自体のアップデートをしておいたほうが良いらしいのでコマンドプロンプトで以下コマンドを。

gem update --system

RubyGemsがアップデートされたら以下コマンドでSCSS、Compassをインストールできるのですが、試してみたところCompassのインストール時にSCSSもインストールされるようなのでSCSSのインストールは不要かもしれません。

gem install sass

gem install compass

以上がWindows7でSCSS+Compass(導入編)となります。
記事が中途半端ですが仕事があるので実践編は明日以降にしたいと思います。