基于WebView的混合编程

时间 2019-11-18

标签基于 webview 混合编程繁體版

原文原文链接

近日公司需求变动，之前一个页面是后台返回HTML字段，而后咱们直接用webView接收，如今新增一个页面，数据后台返回非HTML，页面跟前面一直，所幸本身会点HTML，因此偷了个懒，本身用代码把数据组装成了一个THML，直接调用之前的UI，节省了一些工做，可是，这个组装HTML的过程却不是那么简单，因此网上搜索了一写资料，能够简化这部分工做。html

1、模板引擎渲染HTML

1.GRMustache模板引擎渲染HTML

a.建立模板文件以下：web

　　<HTML>lua

　　　　<HEAD> </HEAD>代理

　　　　<BODY>htm

　　　　　　<h1>{{name}}</h1>模板引擎

　　　　　　<p>{{content}}</p>ip

　　　　</BODY>字符串

　　</HTML>string

这只是一个最简单的模板，你能够在这个文件中加入各类HTML元素标签等，{{参数名}}代替后面传进来的参数，这个参数名必须与后面穿参的字典中保持一致it

2.代码中读取这个模板文件

NSString *template = [NSString stringWithCntentsOfFile:.....]

3.使用GRMustache的renderObject方法生成渲染后的HTML文件

NSDictionary *valueDic = @{@"name":@"标题", @"content":@"内容：HTML渲染模板"};

注意：此处字典的key值与上面的模板中的参数对应

NSString *htmlstr = [GRMustacheTemplate renderObject:valueDic fromeString:template error:nil];

4.这时候就能够直接用webView接收这个渲染后的HTML字符串了

2、OC与JS语言相互调用

1.OC语言调用JS语言

经过UIWebView的stringByEvaluatingJavaScriptFromString方法能够实现，该方法能够向UIWebView传入一段须要执行的JS代码，而后得到执行结果

2.JS调用OC语言

并无原生的API，咱们知道webView的代理方法中shouldStartLoadWithRequest会捕获webView跳转下一个页面，咱们可让H5在页面点击某个按钮的时候，发出一个大家定义规范的一个URL经过代理捕获解析（eg: test://goToPage?pageID=1），从而本身定义跳转原生页面，或者其余操做。