iOS 原生和H5混合开发总结

2019-04-01 15:14:28 浏览数 (1)

最近一段时间开发一个App,由于时间紧采用原生 H5混合开发,这里记录一下开发过程中遇到的问题。

之前在项目中使用过WebViewJavascriptBridge,使用起来很简单,但是这次项目中没有使用。只用了原生的WKWebView。这里就不具体讲怎么使用WKWebView。

思路:

1.写一个自定义的webVIew继承WKWebView。用于初始化和增加进度条(UIProgressView) 2.写一个Web通用的ViewController。处理各种逻辑。 3.原生页面的导航栏标题可以取H5的title

代码语言:javascript复制
// 监听title
[self.webView addObserver:self forKeyPath:@"title" options:NSKeyValueObservingOptionNew context:NULL];

// 监听回调
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary<NSKeyValueChangeKey,id> *)change context:(void *)context{
    //网页title
    if ([keyPath isEqualToString:@"title"] && object == self.webView)
    {
         
    }
}

4.有的页面可能导航栏颜色不一样,可以根据H5的文件名来判断显示不同的颜色。 5.H5页面的文件名和路径都配置在数据库中。

问题

1.之前和Android讨论把所有的跳转都通过这个方法监听

代码语言:javascript复制
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler
{
    // 如果是跳转一个新页面
    NSString *url = [navigationAction.request.URL absoluteString];
    NSLog(@"url--%@",url);
}

但是Android在使用URL Schemes 跳转的时候在有些机型会弹窗。所以后来采用和js交互的方式进行跳转

2.iOS给JS提供了一个页面返回的方法,但是在测试过程中发现,这个方法会无限调用,导致页面一直pop; 调用的结果是因为iOS这边使用了一个通用的页面,比如两个页面一个页面是ViewController1,跳转到下一个页面ViewController2,这两个ViewController其实都是一个通用H5Controller的,初始化的时候都注册了handleBack方法,而H5那边把这个handleBack方法写成全局的了,所以我返回ViewController1的时候也在调用handleBack,所以会无限的调用,H5那边之后改成局部就没有问题了。

3.首页有个逻辑是如果客户端定位成功就把定位传给H5进行交互。H5根据定位信息来显示不同的页面,所以和JS注册了一个方法。在网速很快的时候都没有发现问题。但是如果定位返回很快,但是访问H5那边慢就会导致JS方法在没有注册的情况下就调用了JS所以没有效果。解决方法是定位成功和H5交互但是在WebView加载完成后再调用一次交互。这样就没有问题了。

0 人点赞