js与ios交互,js示例
- js文件:coco3gNativeUser.js
1 let c3_navtive_user = {}; 2 (function(owner) { 3 owner.temp = {}; 4 //右上角按钮及事件 5 owner.__defineSetter__('right_button_item',function(item){ 6 this._right_button_item = item; 7 }); 8 owner.__defineGetter__('right_button_item',function(item){ 9 return this._right_button_item; 10 }); 11 if (!owner.doActionSync){ 12 owner.doActionSync = function (){ 13 alert("客户端尚未实现该方法"); 14 } 15 } 16 owner.doActionAnsy = function (action,param,callback){ 17 var temp = owner.temp; 18 if(!param){ 19 param = {}; 20 } 21 var callbackTag = "callback_" + (new Date()).getTime(); 22 temp[callbackTag] = callback; 23 param.callbackTag = callbackTag; 24 var path = "http://coco3g-app/" + action + "?"; 25 for ( var p in param ){ 26 path += p + "=" + param[p] + "&"; 27 } 28 window.location.href = path; 29 return callbackTag; 30 } 31 owner.doActionJson = function (action,param,callback){ 32 var temp = owner.temp; 33 var callbackTag = "callback_" + (new Date()).getTime(); 34 temp[callbackTag] = callback; 35 jsondata = {}; 36 jsondata.callback = callbackTag; 37 jsondata.data = param; 38 var path = "http://coco3g-app/" + action + "?" + JSON.stringify(jsondata); 39 window.location.href = path; 40 return callbackTag; 41 } 42 owner.doActionFunc = function (action,param,callback){ 43 44 var temp = owner.temp; 45 var callbackTag = "callback_" + (new Date()).getTime(); 46 temp[callbackTag] = callback; 47 48 if(!param){ 49 param = {}; 50 } 51 if("undefined" == typeof CocoObj){ 52 window.webkit.messageHandlers.XJJsToOC.postMessage({protocol :action, data:param, callback:callbackTag}); 53 } 54 else{ 55 var paramstring = JSON.stringify({protocol :action, data:param, callback:callbackTag}); 56 javascript:CocoObj.XJJsToOC(paramstring); 57 } 58 } 59 owner.callback = function (callbackTag,result){ 60 61 62 var callbackFun = owner.temp[callbackTag]; 63 // console.log("callback", callbackFun) 64 if (callbackFun){ 65 // console.log("result1",result) 66 callbackFun(result); 67 } 68 // delete owner.temp[callbackTag]; 69 } 70 })(c3_navtive_user); 71 export default { c3_navtive_user }
- 与ios交互自定义方法:index.js文件
1 import jsTooc from "../commonJS/coco3gNativeUser.js"; 2 window.jsTooc = jsTooc; //关键代码,设置jsTooc为全局变量,外部可访问,这样才能和ios交互 3 4 export const get = (url, protocol = {}, competitionCd) => { 5 return new Promise(resolve => { 6 // params.url = ""; 7 // params.callBack = ""; 8 let param = {}; 9 param.url = url; 10 param.protocol = protocol 11 param.competitionCd = competitionCd 12 jsTooc.c3_navtive_user.doActionFunc('MPJSHttpServiceWithUrl:andCallBack:', param, function(data){ 13 resolve(data); 14 }); 15 }); 16 };
- 文件中使用
1 、触发事件后由ios处理逻辑,
1 editCustomerAction: function() { 2 // console.log("this.customerInformObj", this.customerInformObj) 3 let protocol = "editCustomerAction:"; 4 let parameter = { 5 customerInformObj: this.customerInformObj //传递给ios的参数, 6 }; 7 jsTooc.c3_navtive_user.doActionFunc(protocol, parameter, function( 8 data 9 ) {}); 10 },
2、 触发事件后由ios给出窗口,显示h5写的静态页面
1 popUpViewAction (){ 2 let protocol = "XJPopUpViewAction:"; 3 let parameter = { 4 url: "exampleUrl",//写h5静态页面的路径,vue打包后点击dist文件中的index.html(此路径为根目录),在index.html后加该h5静态页面的相对路径,这俩组成的新路径为完整的该h5页面完整路径,例如https://p.tohours.com/bluedeer-h5/2019/20191017_mp3ipad/customer-detail/dist/index.html#/customerAnalysisRule/VIPCustomerRule, 5 title: "关于VIP客户",//ios需要的参数 6 "960",//ios需要的参数 7 height: "710"//ios需要的参数 8 }; 9 jsTooc.c3_navtive_user.doActionFunc(protocol, parameter, function( 10 data 11 ) {}); 12 },