Hybrid相关

h5与native交互方法说明

已实现的基本交互(未来可用后面的替代)

 

●设置顶部导航标题

setNativeTitle(string)

 

●设置地址

setFullAddress(json)

 

H5调用native方法:

 

http:///gasq/uploadimg?

 

统一方法名 callNativeHandler

根据传的jsonData数据区分不同的原生方法

●iOS

    window.webkit.messageHandlers.callNativeHandler.postMessage(JSON);

 

●Android

    window.JSBridge.callNativeHandler(JSON)

 

JSON 数据格式：

{"handlerName":"uploadImage","data":null,"callbackId":"callback_1_1497518893399”}

1. handlerName: h5调用原生的方法名，此例中是调用原生”uploadImage”的功能
2. data: h5传给原生的参数，没有传null
3. callbackId: 回调函数id, 没有回调则不传

 

具体方法名称约定：

 

方法名	作用描述	回调数据
uploadImage	上传单张图片： 调用原生图库/拍照，	String 图片url
scanCode	扫码：启动原生摄像头扫码(快递单)	String 具体编码

Native调用h5方法

统一方法JSBridge.handleMessageFromNative(JSON)

作为h5调用原生后的回调使用

 

在js调用原生方法callNativeHandler后，原生处理完数据，回调js时使用 JSBridge.handleMessageFromNative(JSON)

 

JSBridge.handleMessageFromNative({"responseId": "callback_1_1497518893399", "responseData": “url...”})

 

JSON数据格式：

{"responseId": "callback_1_1497518893399", "responseData": "123abcdef”}

 

1. responseId: 回调函数id，需要跟h5调用原生方法callNativeHandler时传的callbackId一致
2. responseData: 回调数据，原生处理后需要返给h5的数据，嵌套数据转JSON

作为直接调用h5方法使用

原生直接调用h5暴露的方法

 

JSBridge.handleMessageFromNative({"handlerName": "setData", "data": "1234abcd”})

 

JSON数据格式：

{"handlerName": "setData", "data": "1234abcd”}

 

1. handlerName: h5在暴露给原生来调用的方法名
2. data: 原生传输给h5的数据 JSON格式

具体方法名称约定：

方法名	作用描述
setData	客户端给h5页面传输数据,数据格式为JSON，一般是进入h5页面后传输header相关数据(token, 各种id等等)

@韩培