cjdg_melange
v1.0.5
Published
项目为超导公司内部，h5与原生通信方法大杂烩
Readme
该模块主要是把超级导购中h5页面用调用ios android 原生方法 汇总到一起。
工作计划： 第一阶段： 1.调试通ios android当前常用方法 2.封装抽象 3.列出每一个方法调用示例 Ps：由于当前ios android 方法格式不统一，只能写一个通用文件。达到减少每个前端调用调试时间，只能做到减少平台判断 每个平台回调传参不同要单独处理。当前阶段只能做到方法汇总，不能做到深度封装。 第二阶段： 1.ios换新方法后做到方法统一，深度封装。 2.支持npm引入、和单独cdn文件引入
2019-05-23
已完成第一阶段内容，通用方法communicationWithNative 传入参数未做判断，需进一步做判断
调用形式 如index.html 示例
communicationWithNative({'method':'openCameraJavascriptHandler','callback':callback,'sendData':{'type': 17 }},{method:'scanCode',args:['callback']})
传入参数说明：
第一个参数（json）为ios端参数， method 为ios回调h5 注册方法，callback为js端接受ios回传方法.sendData 为js传送给ios数据
***注意***
当method、callback根据实际接口情况 看是否填写。未填写js端接收不到数据
*******
第二个参数（json）为andriod端参数， method 为android 调用方法名，args:[] 为js向android 传送参数
字段说明：callback为原生回调方法 ，示例全部用callback命名，实际使用时可以随意命名。由于ios android 回传数据格式不统一，建议分开处理说明： melange.js 为ios未更改浏览器的老方法调用文件， melange2.js 为ios更新浏览器后新的调用方法
嵌入式开发h5页面调用原生方法公共文件引用和使用说明：
1.js引入
在使用方法页面应用js
或
2.方法使用
ios和andriod 调用统一使用 communicationWithNative(Object iosobj,Object andriodobj) //所有方法调用都调用此方法，相应方法传入相应的参数 第一个参数为ios端传入参数 对象类型，第二个参数为andriod端传入参数 对象类型
iosobj 为{String method,Object args {String callback,Object sendData}} 形式
method 为要使用方法名
callback 为原生回调方法名 方法名可以自己随意定义 此处必须写字符串类型 无回调 可以忽略此参数
sendData 为传送给原生端参数 对象类型 无传送值可忽略此参数
andriodobj 为{String method,String[] args } 形式
method 为要使用方法名
args 是用传送给android 的参数 为数组 内部元素为字符串
(1)扫一扫方法 /**** method :scanCode
callback:(回调方法名 字符串 不是function) 返回参数为扫描结果
***/ 调用形式： communicationWithNative({ method: 'scanCode', args: { callback: 'scanCodeCallback', sendData: null } }, { method: 'scanCode', args: ['scanCodeCallback'] }) scanCodeCallback 为示例方法名 (2)隐藏标题
/**** method :hideTitle 无回调 无传递参数 / 示例： communicationWithNative({ method: 'hideTitle', args: null, }, { method: 'hideTitle', args: [] }) (3)显示标题 /* method :showTitle 无回调 无传递参数 / 示例： communicationWithNative({ method: 'showTitle', args: null, }, { method: 'showTitle', args: [] }) (4)更改标题 /* method :showTitle 无回调 传递参数 title / 示例： communicationWithNative({ method: 'setTitle', args: { sendData: { title: '更改标题' } } }, { method: 'setTitle', args: ['更改标题'] }) (5)关闭所有页面/退回首页 /* method :finish 无回调 无传递参数 ***/ 示例： communicationWithNative({ method: 'finish', args: null
}, {
method: 'finish',
args: []
})(6)只允许拍照 /**** method :takePhotoOnly callback:(回调方法名 字符串 不是function) 返回参数为上传后的照片url 无传递参数 / 示例： communicationWithNative({ method: 'takePhotoOnly', args: { callback: 'scanCodeCallback', sendData: null } }, { method: 'takePhotoOnly', args: ['scanCodeCallback'] }) (7)登录超时或异地登录 /* method :reLogin 传递参数 1001为登录超时 1003 为异地登录 无回调 ***/
登录超时： communicationWithNative({ method: 'reLogin', args: { sendData: 1001 } }, { method: 'reLogin', args: ['1001'] }) 异地登录： communicationWithNative({ method: 'reLogin', args: { sendData: 1003 } }, { method: 'reLogin', args: ['1003'] }) (8) 分享 /**** method :share 传递参数 ios sendData :{String img ,String title,String subtitle,String url} url 为h5页面地址 andriod args:String[img,title,subtitle,url] 无回调 ***/
示例： communicationWithNative({ method: 'share', args: { sendData: { img: 'https://img14.360buyimg.com/n0/jfs/t1/67326/18/1201/66483/5cf71e87E8db47be7/4db71444dbc65619.jpg', title: '分享测试', subtitle: '耳机图片', url: 'https://www.baidu.com' } } }, { method: 'share', args: ['https://img14.360buyimg.com/n0/jfs/t1/67326/18/1201/66483/5cf71e87E8db47be7/4db71444dbc65619.jpg', '分享测试', '耳机图片', 'https://www.baidu.com' ] })
(9) 模块跳转 /**** method :turnTo 传递参数 ios sendData :{int type ,int modleId,String modleName,String url} type 模块类型 modleId 模块id modleName 模块名称 url 如果是h5模块，就是所带的链接 不是写null andriod args:String[img,title,subtitle,url] 无回调 ***/
示例： communicationWithNative({ method: 'turnTo', args: { sendData: { type: 109, modleId: 2570, modleName: '在线考试', url: null } } }, { method: 'turnTo', args: ['109', '2385', 'H在线考试', ''] }) (10) 刷新前一个页面 此方法为ios独有方法 无需参入 androidobj /**** method :refreshPrevPage 无传递参数 无回调 ***/
示例： communicationWithNative({ method: 'refreshPrevPage', args: null })
(11) 添加日历提醒
/****
method :addCalendar
传递参数 ios sendData:{int type,long alarmTime,String planText,int alarmId }
andriod args:[String planText, String alarmId, long alarmTime, int type]
@param type（ 9 添加 10 删除）
@param alarmTime 提醒时间 ios 为 yyyy-MM-dd hh:mm:ss android 为时间戳 type为10时 ios端可不传 android 必须传 空null
@param planText 日历提醒内容 type为10时 ios端可不传 android 必须传 空字符串 ''
@param alarmId 设置成功id type为9时 ios端可不写 andriod 写 null
回调 callback ios端 自定义方法 返回 alarmId isSuccess 1成功 其他为失败
android 必须挂载 function timeOk(message) {} 方法 （message -1 设置失败 -2 没有权限 其他为成功）
***/
示例： 添加 var iosplanTime = '2019-06-12 15:35:00' var andriodplanTime = new Date(2019, 6, 13, 16, 09).getTime(); communicationWithNative({ method: 'addCalendar', args: { callback: 'addAlarm', sendData: { type: 9, alarmTime: iosplanTime, planText: '消息提醒测试' } } }, {
method: 'addCalendar',
args: ['添加提醒', null, andriodplanTime, 9]
})删除 communicationWithNative({ method: 'addCalendar', args: { callback: 'delateAlarm', sendData: { type: 10, alarmId: 'A1A9D905-35C0-4F82-A233-B2B75085E6BB:55653097-3903-4F9F-9213-A278A20C39DA' } } }, {
method: 'addCalendar',
args: ['', '70', null, 10]
})(12) 设置右上角菜单
/****
method :initMenu
传递参数
ios sendData:{menulist:[obj {String title ,String callback}]}
@param menulist 菜单列表
@param title 菜单名称
@param callback 菜单绑定事件
andriod args:[String[] method, String[] name]
@param method 回调方法集合
@param name 菜单显示名字集合
***/
示例：
communicationWithNative({
method: 'initMenu',
args: {
sendData: {
'menulist': [{
title: '加一',
callback: 'addNub'
}, {
title: '减一',
callback: 'delNub'
}]
}
}
}, {
method: 'initMenu',
args: [
["addNub", "delNub"],
["加一", "减一"]
]
})(13) 添加图片列表 （要与放大图片列表一起使用）
/****
method :getList
传递参数
ios sendData:{imgList:String []}
@param imgList 传递图片集合
andriod args:[String[] imgList ]
@param imgList 传递图片集合
***/
示例：
communicationWithNative({
method: 'getList',
args: {
sendData: {
imgList: [
'http://hbimg.b0.upaiyun.com/0f77354506e1bc52352bd78a01ddc2ca85c429bc32785-Taitw2_fw658',
'http://hbimg.b0.upaiyun.com/40ffdea405c34c998e6212a70ed06bf562accb48390c6-OCqRk3_fw658',
'http://img.besoo.com/file/201608/20/0655472245908.jpg',
'http://ec4.images-amazon.com/images/I/61FHsTyltRL.UL1500.jpg'
]
}
}
}, {
method: 'getList',
args: [
[
'http://hbimg.b0.upaiyun.com/0f77354506e1bc52352bd78a01ddc2ca85c429bc32785-Taitw2_fw658',
'http://hbimg.b0.upaiyun.com/40ffdea405c34c998e6212a70ed06bf562accb48390c6-OCqRk3_fw658',
'http://img.besoo.com/file/201608/20/0655472245908.jpg',
'http://ec4.images-amazon.com/images/I/61FHsTyltRL._UL1500_.jpg'
]
]
})(14) 放大图片
/****
method :toShow
传递参数
ios sendData:{Sting imageUrl }
@param imageUrl 指定放大图片的url
andriod args:[int pos ]
@param pos 指定放大图片的数组中的位置
***/
示例：
communicationWithNative({
method: 'toShow',
args: {
sendData: {
imageUrl: src
}
}
}, {
method: 'toshow',
args: [2]
})(15) 视频下载
/****
method :ios downloadVideo android downLoadProgress
传递参数
ios sendData:{Sting videoUrl }
andriod args:[String videoUrl String callback ]
@param videoUrl 下载视频url
@param callback 回调方法名（字符串），参数100=完成，-1=失败，其他为进度 ios无失败字段
***/
示例：
communicationWithNative({
method: 'downloadVideo',
args: {
callback: 'downRange',
sendData: {
videoUrl: 'https://vd3.bdstatic.com/mda-jf5iqpu551p8h3x1/sc/mda-jf5iqpu551p8h3x1.mp4'
}
}
}, {
method: 'downLoadProgress',
args: ['https://vd3.bdstatic.com/mda-jf5iqpu551p8h3x1/sc/mda-jf5iqpu551p8h3x1.mp4',
'downRange'
]
})(16) 活动分享 （此方法为ios专用方法，需在活动详情页调用） /**** method :share 无传递参数 无回调 ****/ 示例：
communicationWithNative({ method: 'share', args: { sendData: null } })
(17) 跳转到文章详情 /**** method :turnToArticle 传递参数 ios sendData: {String title,String articleId} andriod args:[String title,String articleId] @param title 文章标题 @param articleId 文章Id 无回调 / 示例： communicationWithNative({ method: 'turnToArticle', args: { sendData: {title:'cs001-测试新增文章1',articleId:'90000475'} } }, { method: 'turnToArticle', args:['90000616','文章中图片加载是否正常'] }) (18) 跳转个人详情页 / method :turnUserInfo 传递参数 ios sendData: {String userId} andriod args:[String userId] 无回调 ****/
communicationWithNative({ method: 'turnUserInfo', args: { sendData: {userId:'314697008'} } }, { method: 'turnUserInfo', args:['315248762'] })
(19) 巡店报告分享
/****
method :share
传递参数
ios sendData: {String reportId,String shopName,String accessToken}
@param reportId 巡店报告id
@param shopName 店铺名称
@param accessToken
无回调
****/
communicationWithNative({
method: 'share',
args: {
sendData: {reportId:'3456'shopName:'浦东二店'accessToken:'774848'}
}
})
(20) 九宫格图片分享 /**** method :share 传递参数 ios sendData: {Array images } @param images 分享图片集合 无回调 communicationWithNative({ method: 'share', args: { sendData: { images: picArr } } }, { method: 'share', args: [ picArr ] })
(21) 向原生端传递页面或图片高度（此方法仅ios端可用用于帮助计算图片加载后webview高度）
method：onHightChanged；
communicationWithNative({ method: 'onHightChanged', args: { sendData: {height:'500'} } }) （22）h5 跳转原生及企业微信指定页面 页面中请引用 melange3.js 地址：http://120.27.45.57:18080/wangjw/melange 参数： /**
- 跳转到原生界面
- @param turnJson {"id":"values","state":"values","title",values} id分别对应 文章id，pk id,，排行榜id,试卷id,问题id，帖子id
- @param type article 为文章 (id为文章id,title为文章标题)，
- pk 为pk详情 (id为pkid，state为0表示进行中 1表明历史界面 2表示未参与 3表示观战)，
- pkRank 为pk排行榜 (id为pkid，state为0表示进行中 1表明历史界面 2表示未参与 3表示观战)，
- exam 为考试 (id为试卷id,1为考试历史，0为考试)，
- qa为问答中心 (id为问题id)，
- fourm 为话题 (id为帖子id) */
公共方法调用实例： communicationWithNative(iosObj，androidObj，wxObj) （wxObj与iosObj 保持一样） 以跳转文章为例： communicationWithNative({ method: 'turnPage', args: { sendData:{type:article,id:123,title:'跳转测试'} } }, { method: 'turnPage', args:['article','{id:123,title:跳转测试}'] }, { method: 'turnPage', args: { sendData:{type:article,id:123,title:'跳转测试'} } } )