iOS WKWebView js交互
来源:互联网 发布:java web网站实例 编辑:程序博客网 时间:2024/05/19 23:14
1:设置代理
@interface WkWebViewController ()<WKNavigationDelegate,WKUIDelegate>
//网页内容 _webView = [[WKWebView alloc] initWithFrame:CGRectMake(0, 64, kScreenWidth - 64, kScreenHeight)]; _webView.userInteractionEnabled = YES; _webView.navigationDelegate = self; _webView.UIDelegate = self;
2:实现代理方法。假设需要交互的是,在webview界面,点击包含图片的a标签,需要弹出图片浏览并保存的功能。
a标签的显示为:
bytedance://large_image?url=http://static.lingfo.com/upload/bbs/2017-02-27/c18bc717-d737-4841-90ee-9b93257ea3e5.png&index=0其中“bytedance://large_image”这个是判断条件。index=0,是显示的第1张图片。中间url=http://....png是图片的链接URL。
根据要求,点击A标签需要弹出对应图片,并浏览文章所有的图片和保存本地的功能。
#pragma mark - WKNavigationDelegate// 类似 UIWebView的 -webView: shouldStartLoadWithRequest: navigationType:- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler { NSString *strRequest = [navigationAction.request.URL.absoluteString stringByReplacingPercentEscapesUsingEncoding:NSUTF8StringEncoding]; if([strRequest isEqualToString:@"about:blank"]) {//主页面加载内容 decisionHandler(WKNavigationActionPolicyAllow);//允许跳转 } else if([strRequest containsString:@"bytedance://large_image"]){//截获页面里面的链接点击 //do something you want decisionHandler(WKNavigationActionPolicyCancel);//不允许跳转 NSLog(@"%@",strRequest); NSRange range = [strRequest rangeOfString:@"index="]; NSString *indexStr = [strRequest substringFromIndex:range.location+range.length]; [self showBigPicWithIndex:[indexStr integerValue]]; }else{ //截获页面里面的链接点击 //do something you want decisionHandler(WKNavigationActionPolicyCancel);//不允许跳转 } }-(WKWebView *)webView:(WKWebView *)webView createWebViewWithConfiguration:(WKWebViewConfiguration *)configuration forNavigationAction:(WKNavigationAction *)navigationAction windowFeatures:(WKWindowFeatures *)windowFeatures{ if (!navigationAction.targetFrame.isMainFrame) { [webView loadRequest:navigationAction.request]; } return nil; }至此,完成了交互。
对于点击图片查看大图,使用的第三方框架SDPhotoBrowser。
//self.picPathURLArray:从返回的数据中拿到所有图片的URL链接。-(void)showBigPicWithIndex:(NSInteger)index{ SDPhotoBrowser *brower = [[SDPhotoBrowser alloc]init]; brower.currentImageIndex = index; brower.sourceImagesContainerView = self.webView; brower.imageCount = self.picPathURLArray.count; brower.delegate = self; [brower show];}#pragma mark - SDPhotoBrowersDelegate-(NSURL *)photoBrowser:(SDPhotoBrowser *)browser highQualityImageURLForIndex:(NSInteger)index{ NSURL *url = self.picPathURLArray[index]; return url;}-(UIImage *)photoBrowser:(SDPhotoBrowser *)browser placeholderImageForIndex:(NSInteger)index{ UIImage *image = [UIImage imageNamed:@"image_default"]; return image;}
使用WKWebView时,使用的懒加载的方法,滚动到即将出现图片的位置时,图片再显示出来。节省省流量并节省加载时间。需要与后台js数据进行交互,传递一个实时偏移量,让写js代码的实现。
#pragma mark - 懒加载-滚动到图片的时候,图片再显示出来。节省省流量并节省加载时间// 页面加载完成之后调用- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{ //第一次的时候 传给服务器屏幕滚动值 NSString *param = [NSString stringWithFormat:@"scrollevent('%f')",kScreenHeight]; [self.webView evaluateJavaScript:param completionHandler:nil]; YJWeakSelf; [_webView evaluateJavaScript:@"document.getElementById(\"content\").offsetHeight;" completionHandler:^(id _Nullable result,NSError * _Nullable error) {//result:当前已经看到的webview的高度。 //获取页面高度,并重置webview的frame CGFloat webViewHeight = [result floatValue] + 10.0; //记录wkwebview内容新旧高度 weakSelf.oldWkHeight = webViewHeight; weakSelf.newWkHeight = webViewHeight; CGRect frame =_webView.frame; CGFloat webY = frame.origin.y; if (webViewHeight < kScreenHeight-kNavBarHeight) { webViewHeight = kScreenHeight-kNavBarHeight; } frame.size.height = webViewHeight; weakSelf.webView.frame = frame; //webview的高度加上 webview的y值 CGFloat contentHeight = webY + webViewHeight + 35 + 45; weakSelf.headerView.contentSize = CGSizeMake(kScreenWidth,contentHeight); if (contentHeight > kScreenHeight) { weakSelf.headerView.showsVerticalScrollIndicator = YES; weakSelf.headerView.scrollEnabled = YES; } }]; }#pragma mark - scrollview delegate-(void)scrollViewDidScroll:(UIScrollView *)scrollView{ CGFloat useroff = scrollView.contentOffset.y + kScreenHeight; NSString *param = [NSString stringWithFormat:@"scrollevent('%f')",useroff]; [self.webView evaluateJavaScript:param completionHandler:nil]; YJWeakSelf; [_webView evaluateJavaScript:@"document.getElementById(\"content\").offsetHeight;" completionHandler:^(id _Nullable result,NSError * _Nullable error) { //获取页面高度,并重置webview的frame CGFloat webViewHeight = [result floatValue] + 10.0; weakSelf.oldWkHeight = weakSelf.newWkHeight; weakSelf.newWkHeight = webViewHeight; if (weakSelf.oldWkHeight != weakSelf.newWkHeight) { CGRect frame = _webView.frame; CGFloat webY = frame.origin.y; frame.size.height = webViewHeight; weakSelf.webView.frame = frame; //webview的高度加上 webview的y值 CGFloat contentHeight = webY + webViewHeight + 35 + 45; weakSelf.headerView.contentSize = CGSizeMake(kScreenWidth,contentHeight); if (contentHeight > kScreenHeight) { weakSelf.headerView.showsVerticalScrollIndicator = YES; weakSelf.headerView.scrollEnabled = YES; } } }];}
0 0
- iOS WKWebView js交互
- iOS WKWebView 与 js 交互
- iOS WKWebView与JS交互
- IOS UIWebView (API+JS交互)、WKWebView
- ios WKWebView 与 JS 交互实战技巧
- WKWebView与js交互
- WKWebView与JS交互
- WKWebView与JS交互
- WKWebView与js交互
- WKWebView与JS交互
- WKWebView与js交互
- WKWebview js交互
- WKWebView 与 JS 交互
- WKWebView与js交互
- iOS-WKWebView特性以及与JS交互的一些事
- IOS UIWebView转WKWebView中的js交互问题
- iOS下OC与JS的交互(WKWebview-MessageHandler实现)
- iOS开发中的WKWebView与JS的交互
- mybatis自定义别名与sql片段
- java二叉树的非递归遍历
- 创建一个Android项目的步骤
- Oracle的DBHelper
- private Java 有点意思
- iOS WKWebView js交互
- HAProxy 研究笔记 -- TCP 连接处理流程
- cocos2dx- call to OpenGL ES API with no current context(logged once per thread)
- RabbitMQ常用命令
- javacpp-opencv图像处理3:使用opencv原生方法遍历摄像头设备及调用(增加实时帧率计算方法)
- centos升级OpenSSL
- Bag-of-words model
- 你好,我叫传智学院
- TCP协议中的端口具体指的是什么,为什么要有端口