携帯サイト向けにWicketを使う

携帯端末向けにアプリケーションを開発する場合,作成するコンテンツが小さいために,とにかく余計な記述なしにサクサク開発をしたいと考えるだろう。XHTMLでページを作成していけるソリューションを採用すれば,さらに開発効率は向上するはずだ。そう,Wicketの出番となる。

ただし,WicketはもちろんFirefoxやIEなどのWebブラウザを標準のターゲットにしているために,そのままでは不都合がいくつか存在する。

まず,Wicketの標準では,Webブラウザのマルチウィンドウ対応を行うために,出力されるHTMLに以下のようなJavaScriptが含まれる。これが出力されたままの状態で例えばFOMAからアクセスすると,「*/」がゴミとして表示された状態になってしまう。

これを防ぐためには,IPageSettingsオブジェクトのsetAutomaticMultiWindowSupport()メソッドにfalseを渡して,マルチウィンドウサポートを無効にする。この処理を,Applicationクラスのサブクラスのinit()メソッドをオーバーライドし,その中で行ってあげれば良い。

public class HogeApplication extends WebApplication { @Override protected void init() { super.init(); IPageSettings pageSettings = getPageSettings(); pageSettings.setAutomaticMultiWindowSupport(false); } }

基本的には,上記の対応のみで携帯向けアプリケーションを作成可能となるはずなのだが,実はまだ問題がある。

HTMLテンプレートファイルではなく,Javaコード内で作成した文字列は,数値文字参照としてエスケープされてしまう。例えば,以下のようにドロップダウンリストを作成したとしよう。

List items = Arrays.asList(new String[] {“宇都宮線”, “高崎線”}); form.add(new DropDownChoice(“drop1”, items));

すると,出力されたHTMLは,以下のようになってしまう。

宇都宮線

高崎線

PCのブラウザであれば大丈夫なのだが,携帯で見ると何も表示されなくなってしまう。

これを回避するには,今のところ以下のどちらかを選択するしかない。

  • wicket.markup.html.form.AbstractChoiceクラスの385行目付近にあるエスケープ処理を修正し,各コンポーネントでエスケープするかどうかを切り替えられるようにする。

  • Filterを作成し,HttpServletResponse#getWriter()およびgetOutputStream()メソッドで出力された結果の文字列に含まれる数値文字参照を,強引に元の文字列に戻して再出力する。

1つ目はもちろんWicketのリビルドが必要となるが,根本的な解決といえる。Wicketはmaven2のpom.xmlファイルを持っているので,リビルドに関しては難しい作業ではない。具体的には,以下のように修正すれば良い。

public class AbstractChoice extends FormComponent { // escapeMarkupプロパティの追加 private boolean escapeMarkup = true; public void setEscapeMarkup(boolean escapeMarkup) { this.escapeMarkup = escapeMarkup; } public boolean isEscapeMarkup() { return escapeMarkup; } // 385行目付近の以下の行を修正 // CharSequence escaped = Strings.escapeMarkup(display, false, true); CharSequence escaped = Strings.escapeMarkup(display, false, escapeMarkup); }

そして,エスケープしたくないコンポーネントについて,以下のようにコーディングすれば,エスケープされなくなる。

List items = Arrays.asList(new String[] {“宇都宮線”, “高崎線”}); DropDownChioce comp = new DropDownChoice(“drop1”, items); comp.setEscapeMarkup(false); form.add(comp);

これの将来バージョンでの取り込みについて,Wicketの作者に連絡してみようと思っている。

以上の2点を施すことにより,Wicketを携帯サイトの構築に使用することが可能となる。もちろん細かな点で他にも携帯向けに気にしなければならないことはあるのだが,とりあえず土俵に乗るだけなら十分だ。

余談だが,数値文字参照の問題は,JSFの参照実装やapache-myfaces実装でも同じである。実装コードを修正するか,サーブレットフィルタをかまして対処するか,または携帯向けカスタムレンダラを作りまくるか,どれかを選択しなければならない。

それにしても,なぜ数値文字参照にしているのだろうか?しかも切り替えられずにエスケープ処理がハードコーディングされていることがほとんどなことも悩ましい。うーん。。。

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

関連記事

2023年のRemap

Remapにファームウェアビルド機能を追加しました

Google I/O 2023でのウェブ関連のトピック

2022年を振り返って

現在のRemapと今後のRemapについて