WKWebView的基本使用/拦截URL/Alert弹窗/禁止选择操作/内容字体大小控制

最新推荐文章于 2022-02-18 17:22:11 发布
最新推荐文章于 2022-02-18 17:22:11 发布
阅读量945 收藏
点赞数
文章标签： javascript 人工智能 ViewUI
原文链接：http://www.cnblogs.com/HJiang/p/7832421.html
版权 
WKWebView是iOS 8推出,输入WebKit.framework, UIWebView属于UIKit.framework; WKWebView相对UIWebView优化了很多,特别是内存的消耗.
经测试通过UIWebView和WKWebView分别访问http:www.baidu.com,App正常启动后内存平稳在42M,点击按钮使用UIWebView加载baidu内存最高峰达到131M,然后平稳在119M;
通过WKWebView记载baidu内存最高峰达到47.2M,然后平稳在46.6M.

 WKWebView特性:

  • 在性能、稳定性、功能方面有很大提升.
  • 允许JavaScript的Nitro库加载并使用（UIWebView中限制).
  • 支持了更多的HTML5特性.
  • 高达60fps的滚动刷新率以及内置手势
  • 将UIWebViewDelegate与UIWebView重构成了14类与3个协议

基本使用:

  1. 加载网页
  2. 加载的状态回调
  3. 新的WKUIDelegate协议
  4. 动态加载并运行JS代码
  5. webView 执行JS代码
  6. JS调用App注册过的方法

 

加载页面

- (nullable WKNavigation *)loadRequest:(NSURLRequest *)request;

- (nullable WKNavigation *)loadFileURL:(NSURL *)URL allowingReadAccessToURL:(NSURL *)readAccessURL API_AVAILABLE(macosx(10.11), ios(9.0));

- (nullable WKNavigation *)loadHTMLString:(NSString *)string baseURL:(nullable NSURL *)baseURL;

- (nullable WKNavigation *)loadData:(NSData *)data MIMEType:(NSString *)MIMEType characterEncodingName:(NSString *)characterEncodingName baseURL:(NSURL *)baseURL API_AVAILABLE(macosx(10.11), ios(9.0));

其中有2个方法是iOS 9才有的

注意:load方法中使用的baseURL参数,此参数是html基于的路径,比如html中使用的资源等路径,

[self loadHTMLString:string baseURL:[[NSBundle mainBundle] bundleURL]];

网页中的资源图片等可以写相对路径,相对bundelURL下的资源文件.

 

NSURL *url = [NSURL URLWithString:@"http://www.baidu.com"]; // [NSURL fileURLWithPath:path]
    
NSURLRequest *request = [NSURLRequest requestWithURL:url];
[self.webView loadRequest:request];

 

加载状态回调

 追踪加载过程代理方法:

// 页面开始加载时调用
- (void)webView:(WKWebView *)webView didStartProvisionalNavigation:(null_unspecified WKNavigation *)navigation{
    
}

// 页面加载失败时调用
- (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(null_unspecified WKNavigation *)navigation withError:(NSError *)error{
    
}

// 当内容开始返回时调用
- (void)webView:(WKWebView *)webView didCommitNavigation:(null_unspecified WKNavigation *)navigation{
    
}

// 页面加载完成之后调用
- (void)webView:(WKWebView *)webView didFinishNavigation:(null_unspecified WKNavigation *)navigation{
    
}

// 加载失败
- (void)webView:(WKWebView *)webView didFailNavigation:(null_unspecified WKNavigation *)navigation withError:(NSError *)error{
    
}

页面跳转代理方法:

// 在发送请求之前，决定是否跳转
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler{
    decisionHandler(WKNavigationActionPolicyAllow);
}

// 在收到响应后，决定是否跳转
- (void)webView:(WKWebView *)webView decidePolicyForNavigationResponse:(WKNavigationResponse *)navigationResponse decisionHandler:(void (^)(WKNavigationResponsePolicy))decisionHandler{
    decisionHandler(WKNavigationResponsePolicyAllow);
}

// 接收到服务器跳转请求之后调用
- (void)webView:(WKWebView *)webView didReceiveServerRedirectForProvisionalNavigation:(null_unspecified WKNavigation *)navigation{
    
}

// 接受认证
- (void)webView:(WKWebView *)webView didReceiveAuthenticationChallenge:(NSURLAuthenticationChallenge *)challenge completionHandler:(void (^)(NSURLSessionAuthChallengeDisposition disposition, NSURLCredential * _Nullable credential))completionHandler{
    
    if ([challenge.protectionSpace.authenticationMethod isEqualToString:NSURLAuthenticationMethodServerTrust]) {
        
        NSURLCredential *card = [[NSURLCredential alloc]initWithTrust:challenge.protectionSpace.serverTrust];
        
        completionHandler(NSURLSessionAuthChallengeUseCredential,card);
        
    }
}

新的WKUIDelegate协议

这个协议主要用于WKWebView处理web界面的三种提示框(警告框、确认框、输入框)

// 窗口已经关闭
- (void)webViewDidClose:(WKWebView *)webView API_AVAILABLE(macosx(10.11), ios(9.0)){
    
}


/**
 alert框

 @param webView WKWebView
 @param message 消息文本内容
 @param frame frame主窗口
 @param completionHandler 窗口消失回调
 */
- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler{
    
}

// 确认框
- (void)webView:(WKWebView *)webView runJavaScriptConfirmPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(BOOL result))completionHandler{
    
}

// 文本输入框
- (void)webView:(WKWebView *)webView runJavaScriptTextInputPanelWithPrompt:(NSString *)prompt defaultText:(nullable NSString *)defaultText initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(NSString * _Nullable result))completionHandler{
    
}

 

动态加载并运行JS代码

// 图片缩放的js代码
NSString *js = @"var count = document.images.length;for (var i = 0; i < count; i++) {var image = document.images[i];image.style.width=320;};window.alert('找到' + count + '张图');";
// 根据JS字符串初始化WKUserScript对象
WKUserScript *script = [[WKUserScript alloc] initWithSource:js injectionTime:WKUserScriptInjectionTimeAtDocumentEnd forMainFrameOnly:YES];
// 根据生成的WKUserScript对象，初始化WKWebViewConfiguration
WKWebViewConfiguration *config = [[WKWebViewConfiguration alloc] init];
[config.userContentController addUserScript:script];
_webView = [[WKWebView alloc] initWithFrame:self.view.bounds configuration:config];
[_webView loadHTMLString:@"<head></head><imgea src='http://www.nsu.edu.cn/v/2014v3/img/background/3.jpg' />"baseURL:nil];
[self.view addSubview:_webView];

 

webView 执行JS代码

//javaScriptString是JS方法名，completionHandler是异步回调block
[self.webView evaluateJavaScript:javaScriptString completionHandler:completionHandler];

 

JS调用App注册过的方法

WKWebView里面注册供JS调用的方法，是通过WKUserContentController类下面的方法：

- (void)addScriptMessageHandler:(id <WKScriptMessageHandler>)scriptMessageHandler name:(NSString *)name;
[self.webView.configuration.userContentController addScriptMessageHandler:self name:@"openYou"];

scriptMessageHandler是代理回调; JS调用name方法后，OC会调用scriptMessageHandler指定的对象

实现代理方法

- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message{
    NSLog(@"%s",__func__);
}

页面点击事件

function btnClick(){
    //JS调用
    window.webkit.messageHandlers.openYou.postMessage(null);
}

name(方法名)是放在中间的，messageBody只能是一个对象，如果要传多个值，需要封装成数组，或者字典.

当js方法btnClick调用时会触发OC的代理方法

- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message;

 

WKWebView拦截URL请求

// 在发送请求之前，决定是否跳转
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler{
//    navigationAction.request.URL.absoluteString 根据请求的Url进行拦截请求处理
    decisionHandler(WKNavigationActionPolicyAllow);
}

 

Alert弹窗解决方案

/**
 alert框

 @param webView WKWebView
 @param message 消息文本内容
 @param frame frame主窗口
 @param completionHandler 窗口消失回调
 */
- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler{
    kFunLog
    UIAlertController *alertController = [UIAlertController alertControllerWithTitle:@"提示" message:message?:@"" preferredStyle:UIAlertControllerStyleAlert];
    [alertController addAction:([UIAlertAction actionWithTitle:@"确认" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
        completionHandler();
    }])];
    [self presentViewController:alertController animated:YES completion:nil];
}

// 确认框
- (void)webView:(WKWebView *)webView runJavaScriptConfirmPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(BOOL result))completionHandler{
    kFunLog
    UIAlertController *alertController = [UIAlertController alertControllerWithTitle:@"提示" message:message?:@"" preferredStyle:UIAlertControllerStyleAlert];
    [alertController addAction:([UIAlertAction actionWithTitle:@"取消" style:UIAlertActionStyleCancel handler:^(UIAlertAction * _Nonnull action) {
        completionHandler(NO);
    }])];
    [alertController addAction:([UIAlertAction actionWithTitle:@"确认" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
        completionHandler(YES);
    }])];
    [self presentViewController:alertController animated:YES completion:nil];
}

// 文本输入框
- (void)webView:(WKWebView *)webView runJavaScriptTextInputPanelWithPrompt:(NSString *)prompt defaultText:(nullable NSString *)defaultText initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(NSString * _Nullable result))completionHandler{
    kFunLog
    UIAlertController *alertController = [UIAlertController alertControllerWithTitle:prompt message:@"" preferredStyle:UIAlertControllerStyleAlert];
    [alertController addTextFieldWithConfigurationHandler:^(UITextField * _Nonnull textField) {
        textField.text = defaultText;
    }];
    [alertController addAction:([UIAlertAction actionWithTitle:@"完成" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
        completionHandler(alertController.textFields[0].text?:@"");
    }])];
    
    [self presentViewController:alertController animated:YES completion:nil];
}

 

禁止选择操作

方式1.

// 禁止选择CSS
        NSString *css = @"body{-webkit-user-select:none;}";
        
        // CSS选中样式取消 此方式可能会影响dataDetectorTypes属性
        NSMutableString *javascript = [NSMutableString string];
        [javascript appendString:@"var style = document.createElement('style');"];
        [javascript appendString:@"style.type = 'text/css';"];
        [javascript appendFormat:@"var cssContent = document.createTextNode('%@');", css];
        [javascript appendString:@"style.appendChild(cssContent);"];
        [javascript appendString:@"document.body.appendChild(style);"];
        
        // javascript注入
        WKUserScript *noneSelectScript = [[WKUserScript alloc] initWithSource:javascript injectionTime:WKUserScriptInjectionTimeAtDocumentEnd forMainFrameOnly:YES];
        WKUserContentController *userContentController = [[WKUserContentController alloc] init];
        [userContentController addUserScript:noneSelectScript];
        
        WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];
        configuration.userContentController = userContentController;
WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];if(greaterIOS10){
      configuration.dataDetectorTypes = WKDataDetectorTypePhoneNumber | WKDataDetectorTypeLink | WKDataDetectorTypeCalendarEvent;
  }

 

方式2.

- (void)webView:(WKWebView *)webView didFinishNavigation:(null_unspecified WKNavigation *)navigation{
    if([webView isLoading]){
        return;
    }
    // 禁用用户菜单操作效果
    [webView evaluateJavaScript:@"document.documentElement.style.webkitUserSelect='none'" completionHandler:nil];
    [webView evaluateJavaScript:@"document.documentElement.style.webkitTouchCallout='none'" completionHandler:nil];
}

 

此方式1采用JavaScript注入CSS方式实现的过程经测试调用会影响页面电话号码,超链接等的识别. 本人调试过,去掉css注入就可以识别, 最后采用方式2解决禁止选中效果 

 

WKWebView滚动渲染时肯能出现空白问题解决方式

- (void)scrollViewDidScroll:(UIScrollView *)scrollView{
    
    // 渲染WKWebView ((void(*)(id,SEL,BOOL))objc_msgSend)(self.webView,@selector(_updateVisibleContentRects),NO);
//    objc_msgSend(person, @selector(run));
    
    if ([self.twebView respondsToSelector:@selector(_updateVisibleContentRects)]) {
        ((void(*)(id,SEL,BOOL))objc_msgSend)(self.twebView,@selector(_updateVisibleContentRects),NO);
    }
}

 

.WebView内容字体大小

根据app字体大小的调整,webView的字体大小调整

- (void)webView:(WKWebView *)webView didFinishNavigation:(null_unspecified WKNavigation *)navigation{
    if([webView isLoading]){
        return;
    }
    // 禁用用户菜单操作效果
    [webView evaluateJavaScript:@"document.documentElement.style.webkitUserSelect='none'" completionHandler:nil];
    [webView evaluateJavaScript:@"document.documentElement.style.webkitTouchCallout='none'" completionHandler:nil];
    
    // 控制字体大小
    // (initial-scale是初始缩放比,minimum-scale=1.0最小缩放比,maximum-scale=5.0最大缩放比,user-scalable=yes是否支持缩放)
    NSString *metaJS = [NSString stringWithFormat:@"document.getElementsByName(\"viewport\")[0].content = \"width=self.view.frame.size.width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=yes\""];
    [webView evaluateJavaScript:metaJS  completionHandler:nil];
    
    CGFloat fontSize = [AppFontSizeUtil getMailContentFontProportionOfNormal];
    // 修改百分比即可 @"document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust= '150%'"
    NSString *fontSizeJs = [NSString stringWithFormat:@"document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust= '%f%%'",fontSize*100];
    [webView evaluateJavaScript:fontSizeJs  completionHandler:nil];
}

 

转载于:https://www.cnblogs.com/HJiang/p/7832421.html

ZHANGBO9477
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
SpringCache框架加载/拦截原理详解
08-26
主要介绍了SpringCache框架加载/拦截原理详解，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
android webview修改js,Android WebView通过动态的修改js去拦截post请求参数实例
weixin_39854867的博客
05-26 313
需求背景:需要在用户点击提交按钮的时候拦截用户提交的数据。遇到的问题:1.页面不是自家前端做的,不能修改网页中的代码2.要拦截的请求不是get请求,而是一个post请求 (难点在于:如果拦截的请求是get请求的话,我只需要拿到url,将后面拼接的参数键值对取出来就好了,但是post请求的参数键值对我们是看不到的。。。)解决重点:重写webViewClient的shouldInterceptRequ...
android APP响应H5页面的点击事件（JS交互)
从入门到入狱
05-21 3981
public class MainActivity extends AppCompatActivity{ private static final String TAG = "MainActivity"; private WebView mWebView; /** *必加 */ @SuppressLint("JavascriptInterface") @Overr...
android webview一篇文章全面了解（基本使用，url拦截，js跟java交互）
热门推荐
曹银飞的专栏
11-22 1万+
1.前言最近几年混合应用越来越流行，及一部分功能用原生代码开发，一部分功能用html5实现。那什么时候用原生什么时候用网页呢？很多人第一反应就是经常变化的页面用网页开发，避免经常发包，不全对。其实因为网页使用体验远远不及原生开发，所以一般有以下两种情况建议使用网页代替原生： 1.试水功能 2.类似双11主会场，这类只在固定时间内使用的功能。2.基本使用方法1）xml布局：<?xml versio
IOS Webview JS交互之事件拦截获取
smk524198002的专栏
08-21 5292
最近项目中用到了webvVew，webView加载的网页中有两个按钮，要在app里面响应这两个按钮的点击事件，并接受JS传过来的参数。   ios7 的时候，出来了一个新的类库叫JavaScriptCore.framework - (void)setupJsContent { //获取当前JS环境 _content = [_webView valueForKeyPath:@"d
WKWebView拦截资源
回梦游仙
05-06 824
背景 由于苹果对UIWebView的各种放弃,现在向WKWebView上面转才是正道,在从UIWebView转到WKWebView的过程中,还是遇到不少问题的.尤其是WKWebView的拦截资源很成问题.下面介绍下我遇到的问题和做的一些解决办法. 解决方法 1.第一种解决方法 [NSURLProtocol wk_registerScheme:@"http"]; [NSURLProtocol wk_registerScheme:@"https"]; 2.第二种解决方法 自定义类遵守WKURLScheme
iOS_OC_拦截WKWebview的网络请求
qq_23577319的博客
08-07 3641
应用场景
iOS WKWebView (NSURLProtocol)拦截js、css，图片资源
weixin_30873847的博客
03-07 981
项目地址github：<a href="https://github.com/LiuShuoyu/HybirdWKWebVIew/">HybirdWKWebVIew</a> HybridNSURLProtocol 一个基于WKWebView的hybirde的容器。能拦截所有WKWKWebView的的css,js,png等网络请求的demoNSURLProtoco...
iOS WKWebView禁止全屏播放视频
TailOfFairyLu的博客
12-06 4377
IOS 视频禁止全屏播放 前端将video标签加入属性 webkit-playsinline，如：&lt;video id="player" width="480" height="320" webkit-playsinline&gt;；
Android原生代码拦截H5 Web页面中JavaScript弹窗/弹框
Zhang Phil
01-10 4245
Android原生代码拦截H5 Web页面中JavaScript弹窗/弹框 res/assets/web.html： &lt;html&gt; &lt;body&gt; &lt;script&gt; function showAlert(){ alert("JavaScript - hello , world !"); } function showConfirm(){ ...
机房卫士/弹窗拦截/清理流氓软件
09-01
弹窗拦截 清理流氓软件 自启动软件清理 自定义拦截
axios添加请求/响应拦截器
03-31
axios拦截器，摘自vue3项目，主要代码请查看request.js文件，axios添加请求、响应拦截器，以及如何添加公共请求参数，过滤无效请求参数，aes请求参数加密，aes响应解密，加密狗，仅供学习参考。
粉网封包拦截器_ou.rar_C/C++_
08-09
粉网封包拦截器现在支持拦截发送封包、拦截接收封包、拦截发送软件信息、拦截进程路径，拦截全局封包、拦截指定进程封包、拦截网页封包、拦截Tcp/Ip封包、拦截Udp封包、模拟Post操作、模拟IE浏览网页等。。粉网封包...
关于API HOOK拦截封包原理 .rar_api hook/_hook封包_封包 拦截_封包拦截_拦截封包
09-19
关于API HOOK拦截封包原理
swift的WKWebView跟js互动调用js方法和弹出alert打开新窗口禁用手势等教程
小手琴师的博客
11-12 3878
目录网页端的js给手机端发js方法的代码格式:swift端接收js方法需要做的事给WKWebView添加要捕获js的方法名捕获js方法swift端接收js的alert遵守WKUIDelegate设置代理在代理方法里面写入接收alert的后续代码swift 执行 js.open方法打开新窗口遵守WKUIDelegate代理重写代理方法,并且打开新的url直接用swift执行js例如下面代码是通过执行js,禁用WKWebView的缩放手势 今天做公司项目网页程序里面调用手机的截图.跟公司网页端的同事合作完成了功
WKWebView实现请求拦截，http/https/file等
colrying的博客
08-17 5873
本文是通过WKURLSchemeHandler的方式实现的请求拦截，WKWebView的WKURLSchemeHandler是不支持拦截http/https/file等原始协议的，如果通过[config setURLSchemeHandler:handler forURLScheme:@"http"];就会闪退，但是支持自定义协议，但是有时候项目就是需要拦截这些请求，该怎么处理呢？ 一、自定义一个HFURLSchemeHandler类，并实现WKURLSchemeHandler代理 1、HFURLSch
iOS下JS与OC互相调用（二）--WKWebView 拦截URL
weixin_30729609的博客
08-06 633
在上篇文章中讲述了使用UIWebView拦截URL的方式来处理JS与OC交互。 由于UIWebView比较耗内存，性能上不太好，而苹果在iOS 8中推出了WKWebView。 同样的用WKWebView也可以拦截URL，做JS 与OC交互。关于WKWebView与UIWebView的对比，大家请自动百度或者google。 打开百度网页前 打开百度网页后 ...
iOS WKWebView 设置默认系统字体
Andy Coding
02-18 2504
一般来讲，苹果系统提供的控件的字体基本都是跟随系统，但是WKWebView却不是，可能是网页的兼容性有自己的考虑。现在我的App里只有WKWebView的字体不跟着系统走，视觉上很别扭，严格的UI设计师也不会通过。 笔者翻遍百度和stackoverflow也没找到WKWebView的默认字体是什么？如何修改成跟随系统倒是在stackoverflow找到？最后在国外大神的一遍文章里找到了答案，和大家一起分享。 By default, if you don’t specify a font family in
WKWebView刷新机制小探
逆钟夕的忘忧阁
05-23 1933
背景iOS的一个坑。在线上的版本中，iOS10系统中，app内使用WKWebView当作一个普通的子View来展示一个较长的Web内容组成一个hybrid页面时，会发生白屏的。经过原生端的开发的排除，确认是WKWebView的机制问题，并不是页面加载不完整或者是被劫持而导致的问题。为了更严谨的排出问题所在，我拉去了原声端的代码再次确认代码逻辑是否存在导致该问题所在的bug。因为该页面是一个自定义的...
nginx 使用/d匹配拦截url ,如何配置
最新发布
05-20
在 nginx 的配置文件中，可以使用以下方式来使用/d匹配拦截url： ``` location /example/ { # 匹配 /example 或 /example/，不匹配 /example.html # 这里可以配置需要执行的操作，例如转发请求或返回特定的响应 }...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值