oc 和js之间的交互(webView)

需求: 最近在写关于蓝牙-采集数据然后用网页进行展示的平台;其中涉及到蓝牙数据的读取和数据的展示;

蓝牙数据的读取:
采用了第三方库(babyBluetooth)这个库只要是讲原来的delegate集合称为block的方式
我们进行了再以一次进行了封装,按照业务需求;主要是采用了链式的方式进行写
明白概念:peripheral 、service、characteristic 等它们之间关系;
【主要是看蓝牙之间的数据读取关系,数据结构是硬件嵌入程序决定的,这里是4个字节存储】


oc 和js之间的交互(webView)_第1张图片
蓝牙数据读取示例

webView进行展示:
由于是兼容ios 7 ,所以我们这里就涉及到了UIWebView和WKWebView的内容了;写一个UIWebViewController来进行兼容它们两者,ios8 以及以上都是用WKWebView ;

重点是这里涉及到了oc与js之间的交互,上一次做了实验,我们使用了集中方式,有一个WebViewJavascriptBridge(可以在github搜索) 的第三方库兼容了两种webView的桥接; 并且使用了方法调用的方式,容易让人接受;所以我们选择了这种方式;
下面的两张图片是oc调用js示例
(这个时候就是oc调用js的方法,js方法首先在调用之前先注册,蓝牙网页的时候就可以了,【这个问题不大】)


image.png

oc 和js之间的交互(webView)_第2张图片
image.png

js调用oc:
(这个时候,注意一定是oc在加载html之前就注册了)

oc 和js之间的交互(webView)_第3张图片
js获取这按钮,并且传递转链接,然后出发oc中onScanS3Click 方法

oc 和js之间的交互(webView)_第4张图片
oc中注册的方法

扩展:


oc 和js之间的交互(webView)_第5张图片
js中获取元素的点击事件

需要多点了解网页的基础知识,

你可能感兴趣的:(oc 和js之间的交互(webView))