UIWebView 加载本地文件，多层的网页目录结构失败分析和解决，以及demo

http://blog.csdn.net/mangosnow/article/details/36879725

 

此方案解决了如下问题：

 

有一个本地可以打开的网页，这个网页是一个文件夹。文件夹里面是一个index.html。 同级还有其他的文件夹。如图:

 

 

要求使用 UIWebView 把此网页完全加载，使用普通方法加载是这样的:

 

 

 

分析：

 

使用普通的本地加载方式有两种方法

第一种，把本地文件初始化成Request，让webview 加载Request

NSString *htmlPath = [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html"];
NSURL *url = [NSURL fileURLWithPath:htmlPath];
[aWebView loadRequest:[NSURLRequest requestWithURL:url]];

第二种,把本地文件的数据包装成NSData，让UIWebview实例对象加载

NSString *htmlPath = [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html"];
NSURL *url = [NSURL fileURLWithPath:htmlPath];
[aWebView loadRequest:[NSURLRequest requestWithURL:url]];

发现可以加载 index.html，但问题来了，CSS,JS,IMAGES都没有加载进来

通过products下的文件，在Findle中展示。点击右键——现实内容，会发现导入的网页的目录结构没有了，里面是一个个文件在同一目录下。

 

 

这就是问题产生的原因：文件结构破坏，导致不能找到资源

解决办法：

 

想办法保留文件夹结构。

Bundle 是一种保存了文件结构的数据存储方式，把本地网页文件夹打包成 bundle 结构就可以了
xxx.bundle 是文件夹xxx 加上后缀生成的， index.html 是 文件夹下 xxx 的文件
代码中 baseURL 是一个非常重要的字段，这个字段传入顶级路径（也就是 xxx.bundle 的路径）

工程结构如下

 

 

最后的加载方式如下：

NSString *bundleFile = [[NSBundle mainBundle] pathForResource:@"xxx" ofType:@"bundle"];
NSString *htmlFile = [bundleFile stringByAppendingPathComponent:@"/index.html"];

NSData *htmlData = [NSData dataWithContentsOfFile:htmlFile];
[aWebView loadData:htmlData MIMEType:@"text/html" textEncodingName:@"UTF-8" baseURL:[NSURL fileURLWithPath:bundleFile]];