WKWebViewでアプリ領域に保存したコンテンツを表示

はじめに

タイトルの通り、
WKWebViewを使い、アプリ領域(いわゆるローカルファイル)をWebView上に表示してみた。
問題点などを情報共有として残しておく。

アプリ領域について

iOSアプリでアプリ毎に用意されるディレクトリ。

/
|-- Documents/
|-- Library/
|-- tmp/

今回、WebViewで表示するコンテンツは上記の場所に保存する。

実装

ViewController

// WebViewの初期化
CGRect rect = CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height);
self.webView = [[WKWebView alloc] initWithFrame:rect];
[self.view addSubview:self.webView];

Load

NSString *path = [[[NSURL fileURLWithPath:NSHomeDirectory()] URLByAppendingPathComponent:@"tmp/index.html"] path];
NSURL *url = [NSURL fileURLWithPath:path];
[self.webView loadFileURL:url allowingReadAccessToURL:url];

URLは下記の様なパスとなる。

file:///var/mobile/Containers/Data/Application/123456789-1234-55AB-8765-1234ABCDEFGH/tmp/html/index.html

問題点

コンテンツの置き場所で、tmp/ ディレクトリ以外は、HTMLをWebViewに表示出来たが、
参照される、css/javascript等のファイルが読込めていなかった。

また、シミュレータと実機では読込み結果の挙動が変わったので、下記の表で纏めておく。

ディレクトリ	実機	シミュレータ
Documents/	×	○
Library/	×	×
tmp/	○	○
○：読込み成功
×：読込み失敗

読込み失敗時

読込み成功時

表示に利用したコンテンツは、bootstrapのサンプルを使用。
https://getbootstrap.com/