JXBWKWebView
JXBWKWebView copied to clipboard
xiubojin
An component WebView for iOS base on WKWebView
如果你有好的想法，欢迎Issue或贡献代码！
如果你在使用该库的过程中遇到任何问题，可以通过我的邮箱或Issue联系到我。
使用CocoaPods安装
pod 'JXBWebKit', '~> 1.3.0'
手动安装
拖动JXBWebKit文件夹到你的项目.
注意Copy选项需要选择"Copy items into destination group's folder" and select "Create groups for any folders".
示例
打开JXBWebKitProject直接执行项目。
使用方法
1.可以直接使用JXBWebViewController实例对象打开远程和本地的HTML.
2.可以从JXBWebViewController派生出一个子类，使用该子类实例打开远程和本地的HTML.
3.还可以从JXBWKWebViewPool获取一个可复用的WebView，使用该WebView打开远程和本地的HTML.
提供的功能
1.WebView适配不通机型.
2.UI支持（进度条、进度条颜色、back&close按钮）.
3.支持拦截URL.
4.通过JSBridge和Web进行交互,实测任何场景的交互操作都可满足!比如
- 打开
naive任意页面. - 获取
native定位、推送、相册、相机等权限. - 获取
native数据。 - 调用
native的任意API。 - 其他
5.对子类提供WebView父类的hook操作.
6.支持WKWebView的复用，通过复用优化启动性能以及内存占用.
7.支持各种自定义浏览器的UserAgent.
8.支持拦截WebView的网络请求.
9.支持操作Cookie.
10.demo中提供了让业务H5页面秒开的方案（HTML模板渲染 & 静态资源离线包）.
- 现在市面上绝大部分新闻类APP使用的都是HTML模板渲染方案.
- 除了资讯类页面外其他业务场景的H5都可使用离线包方案.
注意
关于上述第10条中提到的H5秒开方案需要server进行配合，因此在这里我使用Go语言进行后台开发，server提供了两个API：
1.一个普通的get请求，client通过获取响应数据中的html渲染模板进行渲染。
2.一个下载服务器离线包资源的接口。
当然，要想看这个功能的具体实现效果，需要在本地配置Go的开发环境，详见如下步骤：
1.使用brew install go安装golang.
2.环境配置
（1）使用cd ~切换到根目录.
（2）使用ls -all查看所有文件，看有没有.bash_profile文件.
（3）没有就创建一个touch .bash_profile
使用vim打开.bash_profile进行编辑，i进行编辑，编辑完成后:wq退出，编辑内容如下：
export GOPATH=/Users/<your name>/Documents/go
export GOBIN=$GOPATH/bin
export PATH=$PATH:$GOBIN
（4）切换到Documents文件夹，创建go文件夹，再在go文件夹下分别创建bin、src文件夹，src就是以后存放项目的文件夹.
（5）在终端输入go env命令查看配置是否正确，GOBIN有值表示配置没问题.
（6）在本工程内搜索文件夹GoProject > src > OfflineServer，将OfflineServer文件夹拷贝至Documents > go > src目录下.
（7）切换至Documents > go > src
（8）go build编译项目.
（9）go run main.go运行项目.
（10）不再需要开启server服务可以control+c退出.
整体架构
关于JSBridge的实现原理
图解
JS调用Native
示例代码大家可以通过两种方式获取到，如下：
（1）找到当前工程目录，再找到GoProject -> src -> OfflineServer -> source，在source文件下有个压缩文件offline_pkg.zip，将该文件拷贝至别处解压，找到resource目录下的offline.js文件，里面就有示例代码，比如：
获取native的推送权限状态
function getPushAuthState() {
window.JXBJSBridge.call({
target : "push",
action : "getAuthorityState",
data : {
"id" : "123456789",
"name" : "zhangsan"
},
callback : {
success : function(result){document.getElementById('message').innerHTML = result;},
fail : function(result){document.getElementById('message').innerHTML = result;},
progress : function(result){document.getElementById('message').innerHTML = result;},
}
});
}
（2）在当前工程目录下有个JSResources.bundle文件，显示包内容，里面有个index.html，同样也有示例代码。
Object-C代码如何写？
与JS约定好参数，target、action、data、callback等。
target：对应原生的目标类，格式为Service_target。
action：对应目标类的目标方法，格式为func_action:。
data：JS传给Native的数据。
callback：Native处理完业务后回调给JS的结果。
示例：
//获取推送权限状态
- (void)func_getAuthorityState:(NSDictionary *)param {
//获取id
NSString *ID = param[@"id"];
//获取name
NSString *name = param[@"name"];
BOOL isOpen = NO;
UIUserNotificationSettings *setting = [[UIApplication sharedApplication] currentUserNotificationSettings];
if (setting.types != UIUserNotificationTypeNone) {
isOpen = YES;
}
void(^successCallback)(NSDictionary *result) = param[@"success"];
NSDictionary *resultDict = @{@"isOpen":@(isOpen)};
successCallback(resultDict);
}
如何与Android统一调用方式
当前库加载的注入脚本是JXBJSBridge.js，当WebView加载HTML时会在window上挂一个call方法，此时call方法相当于一个全局方法，供JS调用，这个脚本文件同样可以提供给Android使用，达到调用方式统一的目的。
xiubojin