UIWebViewでloadHTMLStringするときの要点まとめ

iOSアプリで適宜、UIの一部分をUIWebViewにしてHTMLで処理するようにすると開発効率が劇的に向上するということは間々あって、その中でもこのエントリではUIWebViewを使ってローカルでHTMLをloadHTMLStringするときの注意点のメモ。


UIWebViewにHTMLをロードするときの方法には２つある。

（１）- (void)loadRequest:(NSURLRequest *)request：NSURLRequestを引数に取り、サーバから直接HTMLをロードする方式。まあ、普通にWebサーバからページを読むときはこっち。


（２）- (void)loadHTMLString:(NSString *)string baseURL:(NSURL *)baseURL ：NSString形式のHTMLの文字列を直接読ませる。こちらはWebサーバも使わず、たとえばHTMLをアドホックに生成したりして単純にHTML+JavaScriptでUI要素を構築したいときなんかに使える。


このエントリでは後者（２）の話で、このときの注意事項のメモ。loadHTMLStringは、以下のように利用するのが典型的な利用シーンだと思う：

1. アプリBundleの中にHTMLのひな形を登録しておいて、
2. NSStringのstringWithContentsOfFile:encoding:とかでロード
3. 適当な値、文字列で置換して整形する。
4. 最後に整形後の文字列をUIWebViewのloadHTMLStringに読ませて表示。

これは該当のUIWebView要素をHTMLができるデザイナーとかに任せて分業したりすることも可能になるので便利。ただしこのとき、画像の配置などでアプリBundle内に含まれている画像やCSS、JavaScriptコードなどを相対URLでリンクしていた場合、loadHTMLStringの時の引数であるbaseURLを適切に設定しないと、ファイル名の指定だけではうまく参照できないことに注意しないといけない。

例えば、

myApp.app/index_template.html

myApp.app/banner.png というのがあるとして、

NSString *htmlStr = [NSString stringWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"html_template" ofType:@"html"]];

でhtmlStrをロード、適宜置換および整形したとしてloadHTMLStringするときには

[webView loadHTMLString:htmlStr baseURL:nil]とかでは<img src="banner.png">みたいな指定は無効。

これが有効になるためには

[webView loadHTMLString:htmlStr baseURL:[[NSBundle mainBundle] pathForResource:@"html_template" ofType:@"html"]]みたいにしてやる必要がある。baseURLはディレクトリじゃないとだめかなと思ったんだけどこの例ではhtmlのパスを指定してやればいいみたい。