首先打开webstorm，将最下面h5拷贝到html中。然后导入工程

#define kMessageHandlerName @"mymobile"

1.创建配置类

- (WKWebView *)webView{
if (!_webView) {

WKWebViewConfiguration *config =[[WKWebViewConfiguration alloc]init];

config.preferences.javaScriptEnabled = YES;
/** 默认是不能通过JS自动打开窗口的，必须通过用户交互才能打开 */
config.preferences.javaScriptCanOpenWindowsAutomatically = YES;
_webView = [[WKWebView alloc]initWithFrame:self.view.bounds configuration:config];

_webView.frame = CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height);

_webView.allowsBackForwardNavigationGestures = YES;//打开左划回退功能
_webView.navigationDelegate = self;
_webView.UIDelegate = self;
_webView.backgroundColor = [UIColor whiteColor];
[self.view addSubview:_webView];

}

return _webView;

}

2.加载H5页面

NSURL *path = [[NSBundle mainBundle] URLForResource:@"index" withExtension:@"html"];
[self.webView loadRequest:[NSURLRequest requestWithURL:path]];

3 注入对象名称 kMessageHandlerName

- (void)viewWillAppear:(BOOL)animated{
        [super viewWillAppear:animated];
        [self.webView.configuration.userContentController addScriptMessageHandler:self name:kMessageHandlerName];
}

- (void)viewDidDisappear:(BOOL)animated{
     [super viewDidDisappear:animated];
     [self.webView.configuration.userContentController removeScriptMessageHandlerForName:kMessageHandlerName];
}

/**代理方法
JS通过mymobile发送数据到iOS端时，在代理中接收
var message = {"method":"call","args":"let go"};
window.webkit.messageHandlers.mymobile(注:这里是注入的对象名).postMessage(message);
*/
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message{

NSDictionary *dic = message.body;

NSString *method = dic[@"method"];

if ([method isEqualToString:@"call"]) {

[self call];
      }

NSLog(@"dic = %@", dic);
}

- (void)call{

UIAlertController *sheet = [UIAlertController alertControllerWithTitle:nil message:nil preferredStyle:UIAlertControllerStyleActionSheet];
[sheet addAction:[UIAlertAction actionWithTitle:@"拍照" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
//调用js
NSString *js = [NSString stringWithFormat:@"gotoCall()"];
[self.webView evaluateJavaScript:js completionHandler:nil];

}]];

[sheet addAction:[UIAlertAction actionWithTitle:@"不要点我" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {

}]];
    [sheet addAction:[UIAlertAction actionWithTitle:@"取消" style:UIAlertActionStyleCancel handler:nil]];
    [self presentViewController:sheet animated:YES completion:nil];

}

/**  在JS端调用alert函数时，会触发此代理方法（确认框） */

- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler{

UIAlertController *alertVC = [UIAlertController alertControllerWithTitle:nil message:message preferredStyle:UIAlertControllerStyleAlert];
      [alertVC addAction:[UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleCancel handler:nil]];
      [self presentViewController:alertVC animated:YES completion:nil];

completionHandler();
}

<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{
font-size: 40px;
}
</style>
</head>

<body>

<div style=" margin-top: 150px">

<p></p>

<div>
<button id="call">拍照</button>
</div>

<script type="text/javascript">

call.onclick = function() {
var message = {"method":"call","args":"let go"};
window.webkit.messageHandlers.mymobile.postMessage(message);
};

function gotoCall(){
alert('调用了OC中的alert')
}

</script>

</body>

</html>

WKWebView与Js交互的更多相关文章

  1. ios WKWebView 与 JS 交互实战技巧

    一.WKWebView 由于Xcode8发布之后,编译器开始不支持iOS 7了,这样我们的app也改为最低支持iOS 8.0,既然需要与web交互,那自然也就选择使用了 iOS 8.0之后 才推出的新 ...

  2. WKWebView与JS交互，UIWebView+JavascriptCore和JS交互

    最近一直在做有关Swift和JavaScript交互的程序,所以有关UIWebView和WKWebView在使用上的差别在此总结下: UIWebView: (1)创建 var webView: UIW ...

  3. WKwebView与JS交互(h5主动）

    先:WKUIDelegate,WKNavigationDelegate,WKScriptMessageHandler // 创建一个webiview的配置项 WKWebViewConfiguratio ...

  4. WKWebView与js交互中产生的内存泄漏

    最近开发中突然发现富文本帖子详情内存没有释放掉,找了好久问题都没找到,终于今天发现了问题,先上一点代码片段 WKWebViewConfiguration *configuration = [[WKWe ...

  5. iOS（WKWebView）OC与JS交互 之三

      随着H5功能愈发的强大,没进行过混合开发的小伙们都不好意思说自己能够独立进行iOS的app开发,在iOS7操作系统下,常用的native,js交互框架有easy-js,WebViewJavascr ...

  6. WKWebView新特性及JS交互

    引言 一直听说WKWebView比UIWebView强大许多,可是一直没有使用到,今天花了点时间看写了个例子,对其API的使用有所了解,为了日后能少走弯路,也为了让大家更容易学习上手,这里写下这篇文章 ...

  7. iOS（UIWebView 和WKWebView）OC与JS交互 之二

    在iOS应用的开发过程中,我们经常会使用到WebView,当我们对WebView进行操作的时候,有时会需要进行源生的操作.那么我记下来就与大家分享一下OC与JS交互. 首先先说第一种方法,并没有牵扯O ...

  8. UIWebView和WKWebView的使用及js交互

    UIWebView和WKWebView的使用及js交互 web页面和app直接的交互是很常见的东西,之前尝试过flex和js的相互调用以及android和js的相互调用,却只有ios没试过,据说比较复 ...

  9. 【Swift】WKWebView与JS的交互使用

    一.前言 近日,有朋友问我关于WKWebView与JS的交互问题,可我之前一直使用的是UIWebView,也不曾做过WKWebView的交互啊!接下来大家一块学习下WKWebView是怎么实现原生代码 ...

随机推荐

  1. xampp版本和具体的php，mysql版本的对应

    在国外网上查找到具体的xampp版本与php,mysql版本的对应关系,特此记录.以便需要的人使用.原文链接如下: http://code.stephenmorley.org/articles/xam ...

  2. maven GroupId 和ArtifactId的含义

    GroupID是项目组织唯一的标识符,实际对应Java的包的结构,是main目录里java的目录结构. ArtifactID就是项目的唯一的标识符,实际对应项目的名称,就是项目根目录的名称.

  3. BOS物流管理系统-第五天

    BOS物流管理系统-第五天-定区管理-WebServcie远程调用 主要内容: 分区设置-导出(分区条件查询后的结果导出为Excel-POI生成Excel和文件下载) 定区管理---定区添加(定区关联 ...

  4. mvn 如何添加本地jar包 IDEA pom.xm

    -------------背景介绍------------------------------------ 最近做的项目,就是office在线浏览功能, 使用的是openoffice+jodconve ...

  5. Chapter 2 Open Book——31

    "It's too bad about the snow, isn't it?" Edward asked. I had the feeling that he was forci ...

  6. Retrofit,Rxjava,OkHttp3的配置

    这几个库的版本都更新了,和以前的使用略有不同,这是两篇介绍的博客:http://www.jianshu.com/p/91ac13ed076d ,https://drakeet.me/retrofit- ...

  7. scrapy 知乎的模拟登陆及抓取用户数据

    最近看了python的scrapy 框架并用其抓取了部分知乎用户数据,代码主要是集中在知乎登陆和抓取时候的逻辑处理上. 1. 首先进入知乎登陆页面zhihu.com/#sigin上, 用xpath提取 ...

  8. String类之substring--->查找某位置对应的字

    以下方法都是java内置类String类的内置方法(不是构造方法哦,就是普通的方法),不需要我们写,直接拿过来用即可. substring方法对应Api介绍   查找字符串中的 从int beginI ...

  9. HDU 1896 Stones (优先队列)

    Problem Description Because of the wrong status of the bicycle, Sempr begin to walk east to west eve ...

  10. POJ 3710 Christmas Game#经典图SG博弈

    http://poj.org/problem?id=3710 (说实话对于Tarjan算法在搞图论的时候就没搞太懂,以后得找时间深入了解) (以下有关无向图删边游戏的资料来自论文贾志豪<组合游戏 ...