ssh(1) と apache proxy を使って、ローカルの開発環境にケータイの実機ブラウザから直アクセスして動作確認する方法。ssh(1) の -R オプションを使うのがキモです。これだけで分かる人は、以下略でどうぞ。
ちょっと考えたらできそうな気はしてたんだけど、-R オプションの存在を知らなかったので、いろいろ試してみる時間が取れなかったのです。で、ふとマニュアル読んでたら -R オプションの存在を知り、やってみたらやっぱし簡単にできた、と。みんなやってるのかもだけど、あまりネット上で見かけない tips なのでポストします。
動作イメージ
(A) (B) (C) 携帯電話 ←────→ サーバ ←─────→ ローカル開発環境 http 80 13000 ssh 3000
まず、(C) の開発環境で Web アプリケーションを稼働させて、その後 (C) から (B) サーバへ ssh(1) で接続します。この際、-R オプションを指定し、(B) サーバの適当なポート(ここでは 13000)へのアクセスを、(C) の稼働環境 Listen ポート(ここでは 3000) にフォワードします。
次に、(B) サーバへの http アクセスを、(B) サーバ上ローカルの 13000 ポートにプロキシする設定をします。これで、(B) サーバへの http アクセスが、ssh のポートフォワード設定に渡されるようになります。
設定はこれだけ。あとは (A) の携帯ブラウザから (B) へ接続すれば、アクセスがローカル開発環境へ飛んできます。
用意するもの
上図の通り、(B) サーバとして使える インターネットから固定名もしくは固定IPでアクセスできて、わりと自由に使えるサーバ機 があれば、だいたいオッケーです。レンタルサーバでも良いですが、リモート側に開いたポートをローカルにフォワードするということをやるので、共用環境ではオススメしません。
ローカルの開発環境を見に来る、ということですので、ローカルには Web アプリケーションの稼働環境が入っている事が前提です。最近の気の利いたフレームワークは httpd や DB もセットになっててラクチンですね。
サーバ側の設定
上記 (B) サーバのアクセス名を example.com とします。
サーバ側には ssh 接続できる sshd と、適当な http プロキシの設定が必要です。僕は sshd に OpenSSH、http プロキシには Apache の mod_proxy を使いました。どちらもパッケージシステム等で簡単にインストールできます。
Apache のプロキシ設定は、以下のような感じです。httpd.conf など適当なところに書きます。
ProxyRequests Off <VirtualHost *> ServerName mobile.example.com ProxyPass / http://localhost:13000/ ProxyPassReverse / http://localhost:13000/ </VirtualHost>
mobile.example.com の部分は、適当に読み替えてください。
要は ProxyPass を書くだけなので、Location とかで適当なパス以下をプロキシしても良いと思います。VirtualHost にしてるのは、アプリ内で指定するリンクのパスの書き方を初期から気にするのが面倒なのでルートを合わせたい、というだけ。
ここまで設定が終わったら $ apachectl graceful で適用して、サーバ側設定おわり。
ローカル開発環境側の設定
(C) のローカル側には ssh 接続クライアントが必要です。ssh クライアントが用意できたら、上記の (B) サーバに ssh するときのオプションとして -R を指定し、接続します。
こんな感じ。-R オプションには、サーバ側で待ち受けるポート:フォワードする先のアドレス(接続元ネットワークで識別できるもの):フォワード先ポート を指定しています。127.0.0.1 のところには localhost と書いても良さそうなのですが、これだと僕の環境だとうまくいきませんでした。詳しくは $ man ssh をどうぞ。
携帯からアクセス確認
携帯のブラウザから、プロキシ設定した (B) サーバ(上記だと http://mobile.example.com/ )へ接続すると、ローカルの稼働環境にアクセスが飛んできます。ssh(1) スゲー。-R オプションスゲー。
うまくいかなかったら、ssh 接続した状態で (B) サーバから $ curl http://localhost:13000/ とかやって、ポートフォワードがちゃんと動いてるか、mod_proxy の設定がちゃんと生きているか、とかとか、確認してみてください。
おわりに
最近は携帯サイト開発向けのイカしたエミュレータが出てきてたりしてますし(Winソフトなので、使えてない Orz)、moxy やら ssb も超便利なので、あんまし面白くない tips かもしれません。が、ケータイサービス作ってると、やっぱし実機確認が、ツラくもあり面白くもあるフェーズだと、僕はおもいます。どうせパケット定額制使ってるんなら、がりがり実機確認しちゃえばいいじゃん、と。
手元の実機で目の前で作ってるアプリがすぐに見られるというのは、結構快感です。ちょっと出来上がってきたので実機で見ようかな、と思っても、デプロイ環境作るまでに一手間あって、そこでテンション下がることも多いです。手元でちまちま仕込みながらも、さくっと実機確認できる環境があるのはうれしいなあ、とやってみながらおもったのでした。
おお、最近ずっと書いてなかったからか、やけに真面目な文体になっている。なぜだ。
関連していそうなエントリ:
最近のコメント