最近做的功能,有部分逻辑是h5实现的,我们采用了本地+网络的机制来提高h5的显示速度,首先说一下机制,
1.本地存在一份html文件+校验码
2.程序启动获取远程校验码
3.远程校验码与本地校验码,比对,不同则下载最新html文件到沙盒
4.加载html首先看沙盒路径是否有html文件,优先加载沙盒,再次加载工程内部文件
ps:这里有个下载的问题,若是沙盒相同路径存在同一文件,从网络下载的话,不会覆盖原文件,导致不能覆盖老的文件,校验出问题,
解决方法:
1.下载之前先删除相应文件(有风险)
2.设置缓冲区,下载到缓冲区完成后再删除工作区文件,拷贝缓冲区文件到工作区(推荐)
以下说一下WKWebview加载本地html文件和html字符串出现的两个问题
html加载本地html文件:
1.通常的加载方式加载工程内部或是网络数据 个别机型和系统也可以加载沙盒的html,亲测在iphone6中这种方式加载不出沙盒的数据
NSURLRequest *request = [NSURLRequest requestWithURL:[NSURL URLWithString:@"lineSte"]];// 服务器
NSURLRequest *request = [NSURLRequest requestWithURL:[NSURL fileURLWithPath:@"locationPath"]];// 本地url地址
[self.webView loadRequest:self.model.URLRequest];
2.加载沙盒html文件,iphone若是需要加载沙盒html文件需要用这个方法,iOS9有效
// 这里需要两个参数,本地html文件的url地址,这里说的是文件的url而非路径
// 还有一个是html文件存放的路径一般是上级的任意一个路径都可以
[self.webView loadFileURL:self.model.URL allowingReadAccessToURL:[NSURL fileURLWithPath:self.model.allowingReadAccessPath]];
3.直接加载html字符串
[self.myWebView loadHTMLString:[self setHtmlStringWithContent:threadModel.body cssStyle:nil jsUrl:nil] baseURL:nil];
// 配置blog h5数据
- (NSString *)setHtmlStringWithContent:(NSString *)content cssStyle:(NSString *)cssStyle jsUrl:(NSString *)jsUrl{
#pragma mark = 此处添加标注 若是html文件和css,js都是本地,可以使用本地的css、js文件,若是像这种直接拼接的html 字符串,html会找不到本地的路径,只能使用网络地址
NSString *cssStyle = @"http://1.css";
NSString *jsUrl = @"http://1.js";
// 获取字体颜色r,g,b
UIColor *color = [UIColor blackColor];
const CGFloat *components = CGColorGetComponents(color.CGColor);
int r = components[0] * 255;
int g = components[1] * 255;
int b = components[2] * 255;
// 组建成#rgb的文本形式
NSString *colorStr = [NSString stringWithFormat:@"%0x%0x%0x", r, g, b];
colorStr = @"515151";
const NSString *htmlHead = @"
";
//css
NSString *css = nil;
css = [NSString stringWithFormat:@"",cssStyle];
//js
NSString *js = [NSString stringWithFormat:@"",jsUrl];
const NSString *htmlBlogContentStart = [NSString stringWithFormat:@"
"];
const NSString *htmlBlogContentEnd = @"
";
NSString *html = [NSString stringWithFormat:@"%@%@%@%@%@%@",htmlHead,css,js,htmlBlogContentStart,content,htmlBlogContentEnd];
return html;
}
// 这种方式本身没有问题,但是像我们的需求,css和js文件放在本地,此时若是在htmlStr添加css和js的本地读取路径(路径写绝对路径),看不到任何效果,猜测自己拼接的html字符串加载本地css和js文件,会获取不到文件,没看出什么原因(知道原因的小伙伴欢迎留言)
根据上述3的情况果断联系后端,搞了css和js文件的服务器连接,解决问题
为验证本地html可加载本地css文件,创建本地html文件(文件内饮用相对路径的css和js)和css和js在同一路径下,上述1或2的方法加载html文件,样式没有问题,由此确定是自己创建html字符串没有路径,识别本地文件有问题,在此记录一下,希望能对遇到相同问题的小伙伴有点帮助
