iOS【webView 加载微信文章注入JS实现交互 浏览图片及保存】
来源:互联网 发布:厦门大学网络教育报名 编辑:程序博客网 时间:2024/06/05 09:54
最近项目某个模块中要求可以实现对网页中图片的查看,并要求在多张图片的情况下可以实现滑动浏览。
所以,问题的集中点就是如何获取所有的图片地址及添加图片的点击事件。不多说,直接上码!
在网页加载完成时,通过js获取图片和添加点击的识别方式
- (void)webViewDidFinishLoad:(UIWebView *)webView { [IDProgressHUD IDPlaceViewHideDirect:self.view]; //这里是js,主要目的实现对url的获取 static NSString * const jsGetImages = @"function getImages(){\ var objs = document.getElementsByTagName(\"img\");\ var imgScr = '';\ for(var i=0;i<objs.length;i++){\ imgScr = imgScr + objs[i].src + '+';\ };\ return imgScr;\ };"; [webView stringByEvaluatingJavaScriptFromString:jsGetImages];//注入js方法 NSString *urlResurlt = [webView stringByEvaluatingJavaScriptFromString:@"getImages()"]; mUrlArray = [NSMutableArray arrayWithArray:[urlResurlt componentsSeparatedByString:@"+"]]; if (mUrlArray.count >= 2) { [mUrlArray removeLastObject]; } //urlResurlt 就是获取到得所有图片的url的拼接;mUrlArray就是所有Url的数组 //添加图片可点击js [mWebView stringByEvaluatingJavaScriptFromString:@"function registerImageClickAction(){\ var imgs=document.getElementsByTagName('img');\ var length=imgs.length;\ for(var i=0;i<length;i++){\ img=imgs[i];\ img.onclick=function(){\ window.location.href='image-preview:'+this.src}\ }\ }"]; [mWebView stringByEvaluatingJavaScriptFromString:@"registerImageClickAction();"];}
//在这个方法中捕获到图片的点击事件和被点击图片的url
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType { //预览图片 if ([request.URL.scheme isEqualToString:@"image-preview"]) { NSString* path = [request.URL.absoluteString substringFromIndex:[@"image-preview:" length]]; path = [path stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding]; //path 就是被点击图片的url return NO; } return YES;}
以下是保存所在作用域的图片
//添加长按事件 UILongPressGestureRecognizer *longPressed = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(longPressed:)]; longPressed.minimumPressDuration = 0.3; longPressed.delegate = self; [webView addGestureRecognizer:longPressed]; /** 获取长按事件所在的位置图片 */- (void)longPressed:(UILongPressGestureRecognizer*)recognizer{ if (recognizer.state != UIGestureRecognizerStateBegan) { return; } CGPoint touchPoint = [recognizer locationInView:_webView]; NSString *imgURL = [NSString stringWithFormat:@"document.elementFromPoint(%f, %f).src", touchPoint.x, touchPoint.y]; NSString *webImage = [_webView stringByEvaluatingJavaScriptFromString:imgURL]; if([webImage rangeOfString:@"player"].location !=NSNotFound || webImage.length == 0){ return; } [self showImageOptionsWithUrl:webImage];}- (void)showImageOptionsWithUrl:(NSString *)imageUrl{ _webImageURL = imageUrl; IBActionSheet *standardIBAS = [[IBActionSheet alloc] initWithTitle:nil delegate:self cancelButtonTitle:@"取消" destructiveButtonTitle:@"保存图片" otherButtonTitles:nil]; [standardIBAS setFont:FontWithSize(SIZE_FONT_CONTENT)]; [standardIBAS setTitleFont:FontWithSize(SIZE_FONT_SUBCONTENT)]; [standardIBAS setButtonTextColor:[UIColor blackColor]]; [standardIBAS showInView:self.navigationController.view];}#pragma mark - IBActionSheetDelegate-(void)actionSheet:(IBActionSheet *)actionSheet clickedButtonAtIndex:(NSInteger)buttonIndex{ if (buttonIndex == 0) { NSURL *url = [NSURL URLWithString:_webImageURL]; NSURLSessionConfiguration * configuration = [NSURLSessionConfiguration defaultSessionConfiguration]; NSURLSession *session = [NSURLSession sessionWithConfiguration:configuration delegate:self delegateQueue:[NSOperationQueue new]]; NSURLRequest *imgRequest = [NSURLRequest requestWithURL:url cachePolicy:NSURLRequestReturnCacheDataElseLoad timeoutInterval:30.0]; NSURLSessionDownloadTask *task = [session downloadTaskWithRequest:imgRequest completionHandler:^(NSURL * _Nullable location, NSURLResponse * _Nullable response, NSError * _Nullable error) { if (error) { return ; } NSData * imageData = [NSData dataWithContentsOfURL:location]; dispatch_async(dispatch_get_main_queue(), ^{ UIImage * image = [UIImage imageWithData:imageData]; UIImageWriteToSavedPhotosAlbum(image, self, @selector(image:didFinishSavingWithError:contextInfo:), NULL); }); }]; [task resume]; }}
后记:js挺好玩,我相信以后还会去多接触它。
阅读全文
0 0
- iOS【webView 加载微信文章注入JS实现交互 浏览图片及保存】
- iOS开发,webView加载图片, js交互, 点击图片放大
- [iOS开发笔记] webview加载+JS交互
- iOS WebView JS 交互
- iOS微信图片浏览模仿
- iOS WebView 如何通过js获取网页中所有图片并加入点击事件,实现浏览图片的功能
- Android点击WebView中的图片实现缩放及滑动浏览
- iOS WebView 图片点击放大并左右滑动,类似微信/网易文章功能
- Android开发模仿微信发表朋友圈图片多选及图片浏览实现-Assur
- iOS webview 和 js 交互
- iOS webView 与js交互
- iOS webView与js交互
- iOS WebView中的JS交互
- Androd WebView中的图片浏览及缩放
- 进击的KFC:iOS WebView 如何通过js获取网页中所有图片并加入点击事件,实现浏览图片的功能
- 模仿微信朋友圈 图片浏览 h5 html5 js
- iOS webView加载本地html,及图片等问题
- php抓取微信文章图片保存到本地
- Myeclipse运行程序时出现Console没有输出信息(只有<terminate>...)解决方法
- pat1007
- 深入理解Django中的ORM数据库操作(Django系列1)
- pat1008
- python依赖注入
- iOS【webView 加载微信文章注入JS实现交互 浏览图片及保存】
- pat1014
- rabin-karp 算法学习心得-lintcode 594
- Web安全笔记整理
- 实战6.SparkSQL(中)--深入了解SparkSQL运行计划及调优
- 复杂度
- iOS【开发即时通讯 SocketIO
- 实战6.SparkSQL(下)--Spark实战应用
- 移植 Nginx+PHP(FastCGI) 到 ARM Linux (一)