Ruby Earrings -- eRuby + Ruby CGI [2]

Ruby Earrings

eRuby で遊ぶ

第2回 eRuby HTML 入門

入門って書くと、読んでもらえるかな、って。

ホントは、わざわざ「入門」しなきゃいけないような難しいことじゃないんです。HTML と Ruby さえわかっていれば、あとはそれを混ぜて書けばいいだけなんですもの。混ぜ方を覚えるだけのハナシです。ホットケーキミックスと卵があって、あなたは混ぜるだけ。焼くのは eruby がしてくれますからねっ。じゃ混ぜ方を。

eRuby タグは2種類あって、<%...%> と <%=...%> が使えます。<%...%> のほうは任意の Ruby スクリプト断片。<%=...%> は <%print ...%> の省略形で、文字列を埋め込みたい時に重宝します。そうですね、わたしはどちらも同じくらいよく使います。はい、混ぜ方はこれだけ。カンタンカンタン。

前回出てきた例はあまりにもつまんないので、もうちょっとそれらしいスクリプトを書いてみます。size.rhtml というファイルを作って下さい。内容は次の通り。

<html><head><title>eRuby test</title></head><body>
<h1>eRuby test</h1>
<ul>
<%1.upto 7 do |size| %>
  <li>size:<%=size%>
      <font size="<%=size%>">Just another Ruby Hacker,</font></li>
<%end%>
</ul>
</body></html>

ブラウザでアクセスしてみましょう。eruby で解釈した結果がブラウザに送信され、表示されます。Just another Ruby Hacker, が7つ、小さいのから大きいのまで順に並んでますか? (テキストブラウザでご覧のかたスミマセン、同じ大きさでも気にしないで下さい ^_^;) ブラウザで「ソースを見る」をすれば、eruby の解釈結果を見ることができます。きっとこうなってると思います(都合上、余分な空行は削除してあります)。

<html><head><title>eRuby test</title></head><body>
<h1>eRuby test</h1>
<ul>
  <li>size:1
  <font size="1">Just another Ruby Hacker,</font></li>
  <li>size:2
  <font size="2">Just another Ruby Hacker,</font></li>
  <li>size:3
  <font size="3">Just another Ruby Hacker,</font></li>
  <li>size:4
  <font size="4">Just another Ruby Hacker,</font></li>
  <li>size:5
  <font size="5">Just another Ruby Hacker,</font></li>
  <li>size:6
  <font size="6">Just another Ruby Hacker,</font></li>
  <li>size:7
  <font size="7">Just another Ruby Hacker,</font></li>
</ul>
</body></html>

上の例でわかるように、eRuby タグ中の Ruby スクリプトはほんとに断片でかまいません。ここは制御構造だから、ブロックだから、ひとつの eRuby タグにまとめなくちゃ、なんていう気遣いは必要ありません。強いて言えば、「;」が出てくるとマズいところでは切っちゃダメです。でも、普通に書いてれば、そんなところで切ろうなんて思わないと思いますので、あまり気にする必要はないデス。

で、そのように書いてもよいということは、Ruby スクリプトによって繰り返される範囲には地の文の部分も含まれることがある、ということです。上の例でもそうなっています。この場合、地の文も一緒に繰り返されます。仕組みの話をすると、eruby は地の文を

print "地の文"

に変換しているだけですから、あたりまえといえばあたりまえの動作なんですけれど。でも最初はちょっと感動しました。

カンタンすぎてつまんないあなたに。

もうちっとだけ複雑な例を出しましょうか。ウーン、例って難しいですね。表示している例文がアレなのでこういうのとかどうでしょう。 Ruby のほうではクラスをひとつ作ってみました。クラスを作る必要性薄いような気もしますが、例ということで見逃して下さい。HTML のほうではテーブルを組んでみます。あおきみねろうさんの Just another Ruby Hacker, ページを元に作成しました。あおきさんと、スクリプトをお書きになった Ruby Hacker のかたがたに感謝です。

<html><head><title>eRuby test</title></head>
<%
require "cgi-lib"
class Hacker
  attr_reader :name, :scriptstr
  def initialize(name, scriptstr)
    @name, @scriptstr = name, scriptstr
  end
  def result; eval @scriptstr; end
end
hackers_data = [
  ['わたなべ氏',
   'print(eval %-%: Just another ruby hacker, :-)'],
  ['青山氏',
   '(eval %|eval %:print %/Just another ruby hacker, /:|)'],
  ['前田氏',
   "'tsuJona rehtbuR ah yrekc,'.unpack('N6c').pack('V6c').display"],
  ['わたなべ氏',
   %q|$> << "4a75737420616e6f746865722052756279206861636b65722c".gsub(/../, '=\\&').unpack("M").join|],
  ['前田氏',
   'print "Just another Ruby hacker,".unpack("M")'],
  ['前田氏',
   '$><<"jUST ANOTHER rUBY HACKER,".swapcase'],
  ['あおき氏',
   '[74,117,115,116,32,97,110,111,116,104,101,114,32,82,117,98,121,32,104,97,99,107,101,114,44,10 ].each do |i| print i.chr end'],
  ['ふなば氏',
   %q|'abcdefghijklmnopqrstuvwxyz'.tr('gqtkmevuxndyfohljsrwzciabp','nyae  kcrRt,auorhh e stJub').display|],
  ['わたなべ氏',
   'print eval %<%%Just another Ruby hacker,%%>']
]
%><body bgcolor="#ffffff">
<h1>various 'Just another Ruby Hacker,'</h1>
<table border="1">
  <tr>
    <th>HackerName</th>
    <th>Script</th>
    <th>Result</th>
  </tr>
<%hackers_data.each do |h|
    hacker = Hacker.new(*h)%>
  <tr>
    <td nowrap><%=hacker.name%></td>
    <td nowrap><%=CGI::escapeHTML(hacker.scriptstr)%></td>
    <td nowrap><%hacker.result%></td>
  </tr>
<%end%>
</table>
</body></html>

いかがでしょう。まんなかのあたり複雑に見えるかもしれませんが、それは Ruby Hacker の皆様がお書きになったスクリプトが凝っているからであって、例自体にはなにも難しいところはありません。クラスを定義して、配列の配列を作っているだけです。body が始まってからは、配列をもとに Hacker クラスのインスタンスを作って、テーブルの各行を出力しています。ソースはこちら、実行結果を見たいかたはこちら。って、アレー。4行目のスクリプト(わたなべさん作の)が動いてない…。しかしさすが「Just another Ruby Hacker,」、一体どこがマズいのか見当もつかないよぅ。(*1)(*2)

HTML、特に CGI 中の HTML はテーブルを扱い始めると一挙に保守性が落ちます。テーブルはどうしても入れ子が深くなり、構造を把握しにくくなるからです。普通の CGI だとタグを閉じ忘れたりしてむちゃくちゃな画面になって、トホホなことが多いですが、これだと閉じ忘れも少ないでしょう。オーサリングツールを使えば閉じ忘れはまず起きないです。

第1回で、eRuby HTML は Dreamweaver で直接編集できると書きました。Dreamweaver をお持ちでないかたや Windows/MacOS を使わずに済んでいる幸福なかたのために、上記の eRuby HTML を編集しているところのスクリーンショットをお見せしましょう。ちと画像が大きめですのでこちらをどうぞ。テーブルのセルの背景色を変えてみているところです。eRuby タグのところは ASP タグとして認識されていますので、そのような表示になっています。

次回はスクリプト外部からデータを取得してみます。ウーン、意外な落とし穴がー。

(*1) 動くようになりました。ごとけんさん、ありがとうございました。ご指摘の点のほかに、eruby では出力先を STDOUT にするとうまくうごかないという問題もありまして、失礼ながら STDOUT を $> に変えてあります。eruby は print の出力先を変更しているので、標準出力と直接お話をすると期待の動作をしません。eruby 用スクリプトを書くときは、STDOUT や $stdout へメッセージを送るのではなく、print とか $> を使いましょう。

(*2) わたなべさん御本人からコメントをいただきました、ありがとうございます。最終的に eval しているのでもう一個 \ が必要です、だそうです。むぅエスケープ苦手。コメントと一緒に eRuby っぽい jarh を載せてらしたので頂こうかと思ったのですガー、eRuby タグ中に %> を書くやりかたがわかりませんデシタ。しくしく。…と泣いていたら前田さんが教えてくださいました。'<%%'が'<%'に'%%>'が'%>'になります。だそうです。

| prev || Ruby Earrings || next |

TAKEUCHi Kahori <takeuchi@kahori.com>