WKWebView---JS调用OC方法

一、使用的协议进行简单的介绍

1.在WKWebView中OC和JS交互也非常简单,WebKit的库中有个代理WKScriptMessageHandler就是专门来做交互的。

WKScriptMessageHandler其实就是一个遵循的协议,它能让网页通过JS把消息发送给OC。其中协议方法。

- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message;
2.WKUserContentController有两个核心方法,也是它的核心功能。
1)- (void)addUserScript:(WKUserScript *)userScript;:js注入,即向网页中注入我们的js方法,这是一个非常强大的功能,开发中要慎用。
2)- (void)addScriptMessageHandler:(id <WKScriptMessageHandler>)scriptMessageHandler name:(NSString *)name;:添加供JS调用OC的桥梁这里的名称对应WKScriptMessage中的名字,多数情况下我们认为它就是方法名。
3.WKScriptMessage,WKScriptMessage就是JS通知OC的数据。其中有两个核心属性用的很多
@property (nonatomic, readonly, copy) NSString *name;
- (void)addScriptMessageHandler:(id <WKScriptMessageHandler>)scriptMessageHandler name:(NSString *)name;添加的名称。
@property (nonatomic, readonly, copy) id body;:携带的核心数据。

二、JS调用OC,实例如下

1.初始化wkwebview,并进行相应的配置
- (WKWebView *)webView {
if (_webView == nil) {
// js配置
WKUserContentController *userContentController = [[WKUserContentController alloc] init];
//需要JS调用iOS 原生的方法,都要添加到这里
[userContentController addScriptMessageHandler:self name:@"jsCallOC"];
// WKWebView的配置
WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];
configuration.userContentController = userContentController;
// 显示WKWebView
_webView = [[WKWebView alloc] initWithFrame:self.view.frame configuration:configuration];
_webView.UIDelegate = self; // 设置WKUIDelegate代理
[self.view addSubview:_webView];
}
return _webView;
}
2.在当前页面引入WKScriptMessageHandler,并实现WKScriptMessageHandler协议即可。
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message {
NSLog(@"方法名:%@", message.name);
NSLog(@"参数:%@", message.body);
// 方法名
NSString *methods = [NSString stringWithFormat:@"%@:", message.name];
SEL selector = NSSelectorFromString(methods);
// 调用方法
if ([self respondsToSelector:selector]) {
[self performSelector:selector withObject:message.body];
} else {
NSLog(@"未实行方法:%@", methods);
}
}
3.在JS方法里如何让JS通知Wkwebview
function onClickButton() {
// 复杂数据
var list = [1,2,3];
var dict = {"name":"阳君", "qq":"937447974", "data":input.value, "list":list};
alert(dict);
// JS通知WKWebView
window.webkit.messageHandlers.jsCallOC.postMessage(dict);
}
4.使用wkwebview加载html页面
- (void)viewDidLoad {
[super viewDidLoad];
// [self loadWebView]; // 加载测试
NSURL *url = [[NSBundle mainBundle] URLForResource:@"index" withExtension:@"html"];
NSURLRequest *urlRequest = [NSURLRequest requestWithURL:url];
[self.webView loadRequest:urlRequest]; // 加载页面
}

WKWebView--JS调用OC的方法的更多相关文章

  1. iOS JS 交互之利用系统JSContext实现 JS调用OC方法以及Objective-C调用JavaScript方法

    ios js 交互分为两块: 1.oc调用js 这一块实现起来比较简单, 我的项目中加载的是本地的html,js,css,需要注意的是当你向工程中拖入这些文件时,选择拷贝到工程中,(拖入的文件夹是蓝色 ...

  2. JS调用OC方法并传值,OC调用JS方法并传值////////////////////////zz

     iOS开发-基于原生JS与OC方法互相调用并传值(附HTML代码)     最近项目里面有有个商品活动界面,要与web端传值,将用户在网页点击的商品id 传给客户端,也就是js交互,其实再说明白一点 ...

  3. [iOS Hybrid实践:UIWebView中Html中用JS调用OC方法,OC执行JS代码]

    原理: 1.JS调用OC 每次webview执行跳转时都会被iOS给拦截,执行下面函数获得系统允许. 因此可以根据跳转信息转给系统,执行相应功能,比如打开相册等. // 网页中的每一个请求都会被触发 ...

  4. UIWebView中Html中用JS调用OC方法及OC执行JS代码

    HTML代码: <html> <head> <title>HTML中用JS调用OC方法</title> <meta http-equiv=&quo ...

  5. iOS JS 交互之利用系统JSContext实现 JS调用oc方法

    ios js 交互分为两块: 1.oc调用js 这一块实现起来比较简单, 我的项目中加载的是本地的html,js,css,需要注意的是当你向工程中拖入这些文件时,选择如下操作,(拖入的文件夹是蓝色的, ...

  6. ios--网页js调用oc代码+传递参数+避免中文参数乱码的解决方案(实例)

    此解决方案原理: 1.在ViewController.h中声明方法和成员变量,以及webView的委托: // //  ViewController.h //  JS_IOS_01 // //  Cr ...

  7. iOS UIWebView 中 js调用OC 打开相册 获取图片, OC调用js 将图片加载到html上

    线上html <!DOCTYPE html> <html> <head> <title>HTML中用JS调用OC方法</title> < ...

  8. CEF3中js调用delphi内部方法

    2015-01-20修改:以下方法不适合delphi7,在CEF3源码中限制了delphi_14 up,对于被我误导的朋友说声抱歉 在CEF1中JS调用delphi的方法已经贴过:http://www ...

  9. 通过js调用android原生方法

    有时候我们有这样一个需求,监听html中控件的一些事件.例如点击html中某个按钮,跳转到别的activity,复制某段文本. 首先是对webview的设置: myWebView = (WebView ...

随机推荐

  1. Yarn篇--搭建yran集群

    一.前述 有了上次hadoop集群的搭建,搭建yarn就简单多了.废话不多说,直接来 二.规划 三.配置如下 yarn-site.xml配置 <property>        <n ...

  2. SAP HANA中的SLT简介

    在以SAP系统作为主要ERP的企业中,不同系统之间的数据库数据同步是个重要的工作.对于这种需求,除了开发ABAP接口之外,也有高效的工具可用.SLT就是其中之一. SLT是SAP的第一个ETL(Ext ...

  3. 富文本编辑器Quill的使用

    我们经常需要使用富文本编辑器从后台管理系统上传文字,图片等用于前台页面的显示,Quill在后台传值的时候需要传两个参数,一个用于后台管理系统编辑器的显示,一个用前台页面的显示,具体代码如下截图: 另Q ...

  4. jq传统火车轮播图

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. ------- 当前全球最新的 IPv4 地址池使用报告 -------

    -------------------------------------------------------------- 对于互联网行业相关的从业人员而言,时刻关注 IPv4 地址池的状态此类&q ...

  6. asp.net core 配置

    ASP.NET Core的配置系统已经和之前版本的ASP.NET有所不同了,之前是依赖于System.Configuration和XML配置文件web.config,现在支持各种格式的配置,比以前灵活 ...

  7. 2017 Multi-University Training Contest - Team 9 1005&&HDU 6165 FFF at Valentine【强联通缩点+拓扑排序】

    FFF at Valentine Time Limit: 6000/3000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others) ...

  8. [bzoj1806] [ioi2007]Miners 矿工配餐

    相当于noip前两题难度的ioi题........ 还是挺好想的...算是状压一下?...两个二进制位可以表示三种食物或者没有,所以用四个二进制位表示某个煤矿最近两餐的情况... 先把各种情况加上各种 ...

  9. Codeforces Round #336 (Div. 2)-608A.水题 608B.前缀和

    A题和B题...   A. Saitama Destroys Hotel time limit per test 1 second memory limit per test 256 megabyte ...

  10. NYoj289苹果(0-1背包)

    苹果 时间限制:3000 ms  |  内存限制:65535 KB 难度:3 描述 ctest有n个苹果,要将它放入容量为v的背包.给出第i个苹果的大小和价钱,求出能放入背包的苹果的总价钱最大值. 输 ...