Ruby の Webrick でお手軽 HTTP サーバ

2007/08/26 2:12am

ruby
tips

サイトの HTML や CSS を自分のパソコン上で編集するとき、不便に感じるのは画像や外部 CSS ファイルの指定方法の違いだ。

サイト上の HTML や CSS では、たとえば、

<link rel="stylesheet" href="/stylesheets/application.css" type="text/css" media="screen" charset="utf-8" />

とか、

div#header div.logo h1 {
  width: 250px;
  height: 50px;
  background: url(/images/logo.png) no-repeat center center;
}

になっているのに、自分のパソコン上で編集するときには、これらを

<link rel="stylesheet" href="./stylesheets/application.css" type="text/css" media="screen" charset="utf-8" />

...

div#header div.logo h1 {
  width: 250px;
  height: 50px;
  background: url(./images/logo.png) no-repeat center center;
}

いちいち、相対パスに変換しなくてはいけないのだ。面倒だし、誤って別の箇所を削ってしまったり、一部だけ変更し忘れるなんてことがないとも限らない。

変更しなくても済むように

こういうときは、ローカルに HTTP サーバを用意すると便利だ。

ローカルに HTTP サーバを用意して、そこで編集中のサイトを表示させるようにすれば、画像や外部 CSS ファイルのパスを実際のサイトのものから書き換えなくても、正常に表示できるようになる。

そして、Mac には Ruby が標準添付されているので、簡単に HTTP サーバを用意することができる。

簡単な HTTP サーバを書く

Ruby には Webrick という汎用サーバーフレームワークが標準添付されており、これを使えば、以下のように簡単なスクリプトで HTTP サーバを実装できるのだ。

#!/usr/local/bin/ruby
require 'webrick'

def webrick(config = {})
  WEBrick::HTTPServer.new(config).instance_eval do |server|
    [:INT, :TERM].each do |signal|
      Signal.trap(signal) { shutdown }
    end
    start
  end
end

webrick :DocumentRoot => '/path/to/your/document/root',
        :Port => 5001

強調部分がサーバを設定する箇所になる。実際にサーバを実行する環境に合わせて書き換えてほしい。

:DocumentRoot 編集する HTML や CSS の置かれたディレクトリのルートディレクトリへのパス
:Port サーバを起動するポート番号（普通はこのままでよい）。

:DocumentRoot を適切なディレクトリに書き換えたら、ターミナルから起動する。ここでは、このスクリプトを server.rb という名前で保存したとする。

% ruby ./server.rb
[2007-08-25 17:01:45] INFO  WEBrick 1.3.1
[2007-08-25 17:01:45] INFO  ruby 1.8.6 (2007-03-13) [i686-darwin8.9.1]
[2007-08-25 17:01:45] INFO  WEBrick::HTTPServer#start: pid=446 port=5001

そうして、ブラウザから http://localhost:5001/ にアクセスすれば、ローカルで編集中のサイトが表示されるはずだ。

また、サーバを終了させたいときはサーバを起動しているターミナルのウインドウで、Control + C で終了させることができる。