美文网首页
WKWebview加载本地html问题汇总

WKWebview加载本地html问题汇总

作者: 黑炭长 | 来源:发表于2020-06-06 12:21 被阅读0次

    最近做的功能,有部分逻辑是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 = @"<!DOCTYPE html><html><head><meta http-equiv='Content-Type' content='text/html; charset=utf-8' /><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no\" />";
        
        //css
        NSString *css = nil;
        css = [NSString stringWithFormat:@"<link type='text/css' rel='stylesheet' href=\"%@\" media='all'>",cssStyle];
        
        //js
        NSString *js = [NSString stringWithFormat:@"<script src=\"%@\" type='text/javascript'></script>",jsUrl];
        
        const NSString *htmlBlogContentStart = [NSString stringWithFormat:@"</head><body><div class=\"contentBox\">"];
        const NSString *htmlBlogContentEnd = @"</div></body></html>";
        
    
        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字符串没有路径,识别本地文件有问题,在此记录一下,希望能对遇到相同问题的小伙伴有点帮助

    相关文章

      网友评论

          本文标题:WKWebview加载本地html问题汇总

          本文链接:https://www.haomeiwen.com/subject/llgbzhtx.html