native 端

  1. 初始化 wkwebview，设置 message handler

    webView = WKWebView.init()
    
let usecc = self.webView.configuration.userContentController
    
usecc.add(self, name: "testecho")

  2. 实现 WKScriptMessageHandler协议

    extension ViewController: WKScriptMessageHandler {
    
    func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
    
        mylog("\(self.sendCount) call native , message is \(message.name),")
    
    }
    
}

  3. 执行JS 代码

    //jsStr = "echo(\"wordword\")"
    
self.webView.evaluateJavaScript(jsStr) { (result, err) in
    
    self.mylog("\(self.sendCount) \(jsStr.count) bytes callback, result: \(result), err: \(err)")
    
}

    前端

    <!DOCTYPE html>
    
<html>
    
<script type="text/javascript">
    
    function echo(str) {
    
        console.log(str);
    
        window.webkit.messageHandlers.testecho.postMessage(str);
    
}
    
</script>
    
<body>
    
<input type="button" onClick="echo('toast clicked')" value="toast">
    
<input type="button" onClick="echo('alert clicked')" value="Alert">
    
</body>

</html>

分析

native 端注册了 testecho 的messageHandler，所以 JS 可以通过 window.webkit.messageHandlers.testecho.postMessage 来回调客户端，和文档中说的一样。

Adding a script message handler with name name causes the JavaScript function window.webkit.messageHandlers.name.postMessage(messageBody) to be defined in all frames in all web views that use the user content controller.

参考

WKWebView 里 JS 和 native 通信的例子的更多相关文章

  1. WebViewJavascriptBridge 进行js 与native通信。

    1,  iOS端加载web页面.开启日志并给webView建立JS与OC的桥梁 - (void)viewWillAppear:(BOOL)animated { if (_bridge) { retur ...

  2. Qtl和JS、HTML通信/交互

    http://www.cnblogs.com/sigma0/p/7346727.html Qt的QWebChannel和JS.HTML通信/交互驱动百度地图 0 前言 我一个研究嵌入式的,不知道怎么就 ...

  3. Qt的QWebChannel和JS、HTML通信/交互驱动百度地图

    Qt的QWebChannel和JS.HTML通信/交互驱动百度地图 0 前言 我一个研究嵌入式的,不知道怎么就迷上了上位机,接了几个项目都是关于Qt,这个项目还是比较经典的,自己没事儿的时候也进行研究 ...

  4. js与native交互

    js与native交互 UIWebView Native调用JS,使用stringByEvaluatingJavaScriptFromString来解释执行js脚本. //script即为要执行的js ...

  5. js与native的交互

    WebView与Javascript交互(Android): WebView与Javascript交互是双向的数据传递,1.H5网页的JS函数调用Native函数 2.Native函数调用JS函数,具 ...

  6. iOS JS 和 OC交互 / JS 和 native 相互调用

    现在app 上越来越多需求是通过UIWebView 来展示html 或者 html5的内容, js 和 native OC代码交互 就非常常见了. js 调用 native  OC代码 第一种机制 ( ...

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

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

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

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

  9. JS操作Cookies的小例子

    这篇文章介绍了JS操作Cookies的小例子,有需要的朋友可以参考一下. 您可能感兴趣的文章:js 保存与获取cookie的代码javascript cookie操作实例详解javascript co ...

随机推荐

  1. Zookeeper 系列（三）Zookeeper API

    Zookeeper 系列(三)Zookeeper API 本节首先介绍 Zookeeper 的 Shell 命令,再对 Java 操作 Zookeeper 的三种方式进行讲解,本节先介绍 Zookee ...

  2. Maven系列（十）发布自己的项目到 Maven 中央仓库

    Maven 发布自己的项目到 Maven 中央仓库 可能很多人都在用 Maven 仓库,但是如果要问怎么发布项目到中央仓库,估计很多人都不知道了,下面本篇文章带大家往中央仓库发布一个自己的 Maven ...

  3. eclipse代码自动提示，eclipse设置代码自动提示

    eclipse代码自动提示,eclipse设置代码自动提示 eclipse是很多JAVA开发者基本上都用的工具,用它可以很方便的开发JAVA代码,当编写JAVA代码时,大部分人都是按组合键[Alt+/ ...

  4. 2018.07.25 bzoj2125: 最短路（圆方树+倍增）

    传送门 人生的第一道仙人掌. 这道题求是仙人掌上的最短路. 先建出圆方树,然后用倍增跑最短路,当lca" role="presentation" style=" ...

  5. （ KMP 求循环节的个数）Power Strings -- poj -- 2406

    链接: http://poj.org/problem?id=2406 Power Strings Time Limit:3000MS     Memory Limit:65536KB     64bi ...

  6. C/C++中如何获取数组的长度？

    C/C++中如何获取数组的长度? 收藏 C.C++中没有提供 直接获取数组长度的函数,对于存放字符串的字符数组提供了一个strlen函数获取长度,那么对于其他类型的数组如何获取他们的长度呢?其中一种方 ...

  7. express 阮一峰的博客

    http://javascript.ruanyifeng.com/nodejs/express.html next没怎么用过... 一个不进行任何操作.只传递request对象的中间件 functio ...

  8. 项目笔记---事半功倍之StyleCop(一)

    前言 曾几何时,你是否在看别人代码的时候总是在抱怨代码没有注释,命名不规范,代码风格不统一,代码可读性差?是否有一个适合团队开发规范的检查工具? 答案就是大名鼎鼎的StyleCop代码检查插件,有了这 ...

  9. 安装webpack常见错误之一

    我安装webpack时,出现如下错误: C:\Users\admin> npm install webpack -gnpm WARN checkPermissions Missing write ...

  10. Prism 的 TabControl 导航

    基于Prism 7.1 最近工作中可能会用到TabControl所以作为小菜的我提前预习了一下,结果并没有我想的那么简单,于是乎 各种网上查,本来用wpf的人就不多 prism 的可查的资料就更少的可 ...