wkwebview 开发中遇到的问题-加载时机和js的交互

最新推荐文章于 2023-02-23 15:37:02 发布

binglan520

最新推荐文章于 2023-02-23 15:37:02 发布

阅读量2k

点赞数

分类专栏： iOS-WebView

本文链接：https://blog.csdn.net/binglan520/article/details/79203936

版权

iOS-WebView 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

在开发中有这个需求，选择若干个播放资源，然后将基本资源信息发送给js做html的展示，其中包含播放列表和播放区域。

最初的讨论是为了加快开发速度，不走java支持，将需要的数据打包成参数字典的形式来累加到url上，比如：

//dic为已经打包好的字典类型的数据结构,首先把dic转换成data

NSData jsonData = [NSJSONSerializationdataWithJSONObject:dic options:0 error:nil];

//url string is the base play page url

NSMutableString *urlString = 获取baseurl;

／／然后将data转换成string

[urlString appendString:[[NSStringalloc]initWithData:jsonDataencoding:NSUTF8StringEncoding]];

／／然后进行特殊字符，空格，中文等的转译工作

NSString *finalUrlString = [[urlStringstringByAddingPercentEncodingWithAllowedCharacters:[NSCharacterSetURLQueryAllowedCharacterSet]] mutableCopy];

}

／／然后把dic作为url？后面的参数部分进行传递

NSMutableURLRequest *request = [[NSMutableURLRequestalloc]initWithURL:[NSURLURLWithString:finalUrlString]];

[self.webViewloadRequest: request];

／／js就会收到请求，让后进行解析数据和重新组装

这样实现不需要走java，不需要开新接口，但是问题就来了，当测试的时候请求的数据参数长度达到了一定的长度后，js出错，无法渲染出html页面，此时手动截短url长度，打开浏览器，可以粘贴成功并且可以访问了，说明的确是url长度超限了。就不同的浏览器url超限的长度是不同的，而且即便统一浏览器不同的版本url长度限制页存在差异，比如：（如果参数包含中文，那么所占用的字节更多）

Firefox：
对于Firefox1.5.x，地址栏能显示的URL最大长度是65,536个字符，但实际上有效的URL最大长度不少于100,000个字符。
对于Firefox 3.0.5，mozilla官方论坛上有人测试其URL长度限制为65,000个字符。
也有人说Firefox可以支持URL高达2Gbyte的长度（参考），在data URL中可以运用到这样大数据量的URL。dataURL是一种URL本身包含了实际数据的URL，比如一个图片、一个HTML网页或者全部的数据、代码等等。仅有Firefox支持dataURL。
data URL示例：

This is a data URL

">This is a test

Safari：
Safari最少支持80,000个字符长度的URL。

Opera：
Opera官方网站上说，Opera并没有强制限制URL的长度。
网友测试Opera 9支持最少190,000个字都长度的URL，并且Opera9的地址栏可以显示、编辑、复制和粘贴完整的URL串。

那么这种方式就是存在隐患的。因此考虑使用java接口或者其他方式。由于pc端使用的localstorage，那么看看wkwebview是否也可以使用localstorage传递参数。答案是肯定的。

于是在didFinishNavigation中添加对应的删除和设置localstorage的操作。发现一个很奇怪的问题，js和app端数据读取的同步时机上总是有问题，导致页面要不就显示旧的内容，要不就什么也显示不出来。折腾半天。最后讨论中突然想起了android和ios中的webview finish并不是真正的监听到了网页最终加载完成，可能此时页面还没有最终完全的加载和渲染出来。于是会有时机上的不对。怎么办呢？因为虽然app不知道确切的finish loading的时间，但是有人知道呀，就是js呀。于是最终的方案确定了，在js finish后通知native我加载完成了，可以给我数据了，于是native此时再删除旧有的localstorage，然后set新的localstorage，并通知js set 完成了，因为js只负责取，他也不知道什么时候真正set成功了。于是需要native 告诉他可以取了，虽然有点儿麻烦，但是最终解决了问题。代码如下：

WKWebViewConfiguration *config = [WKWebViewConfigurationnew];

//添加js调用native的方法

[config.userContentControlleraddScriptMessageHandler:selfname:@"finish"];

self.webView = [[WKWebViewalloc] initWithFrame:self.frameconfiguration:config];

- (void)userContentController:(WKUserContentController *)userContentController

didReceiveScriptMessage:(WKScriptMessage *)message{

NSDictionary *sentData = (NSDictionary*)message.body;

NSString *methodName = [sentDataobjectForKey:@"method"];

if([methodName isEqualToString:@"finish"]) {

NSString *removeUserContent = @"localStorage.removeItem('params')";

//移除旧有的localstorage [self.webView evaluateJavaScript:removeUserContent completionHandler:^(id _Nullable obj, NSError * _Nullableerror) {

if (error == nil) {