js与ios交互，js示例

Posted 2021-03-17 sinceForever

js与ios交互，js示例

• js文件：coco3gNativeUser.js

let c3_navtive_user = {};
(function(owner) {
    owner.temp = {};
    //右上角按钮及事件
    owner.__defineSetter__(‘right_button_item‘,function(item){
        this._right_button_item = item;
    });
    owner.__defineGetter__(‘right_button_item‘,function(item){
        return this._right_button_item;
    });
    if (!owner.doActionSync){
        owner.doActionSync = function (){
            alert("客户端尚未实现该方法");
        }
    }
    owner.doActionAnsy = function (action,param,callback){
        var temp = owner.temp;
        if(!param){
            param = {};
        }
        var callbackTag = "callback_" + (new Date()).getTime();
        temp[callbackTag] = callback;
        param.callbackTag = callbackTag;
        var path = "http://coco3g-app/" + action + "?";
        for ( var p in param ){ 
            path += p + "=" + param[p] + "&";
        }
        window.location.href = path;
        return callbackTag; 
    }
    owner.doActionJson = function (action,param,callback){
        var temp = owner.temp;
        var callbackTag = "callback_" + (new Date()).getTime();
        temp[callbackTag] = callback;
        jsondata = {};
        jsondata.callback = callbackTag;
        jsondata.data = param;
        var path = "http://coco3g-app/" + action + "?" + JSON.stringify(jsondata);
        window.location.href = path;
        return callbackTag;
    }
    owner.doActionFunc = function (action,param,callback){
        
        var temp = owner.temp;
        var callbackTag = "callback_" + (new Date()).getTime();
        temp[callbackTag] = callback;
        
        if(!param){
            param = {};
        }
        if("undefined" == typeof CocoObj){
            window.webkit.messageHandlers.XJJsToOC.postMessage({protocol :action, data:param, callback:callbackTag});
        }
        else{
            var paramstring = JSON.stringify({protocol :action, data:param, callback:callbackTag});
            javascript:CocoObj.XJJsToOC(paramstring);
        }
    }
    owner.callback = function (callbackTag,result){
        

        var callbackFun = owner.temp[callbackTag];
        // console.log("callback", callbackFun)
        if (callbackFun){
            // console.log("result1",result)
            callbackFun(result);
        }
        // delete owner.temp[callbackTag];
    }
})(c3_navtive_user);
export default { c3_navtive_user }

• 与ios交互自定义方法：index.js文件

import jsTooc from "../commonJS/coco3gNativeUser.js";
window.jsTooc = jsTooc; //关键代码，设置jsTooc为全局变量，外部可访问，这样才能和ios交互

export const get = (url, protocol = {}, competitionCd) => {
  return new Promise(resolve => {
    // params.url = "";
    // params.callBack = "";
    let param = {};
    param.url = url;
    param.protocol = protocol
    param.competitionCd = competitionCd
    jsTooc.c3_navtive_user.doActionFunc(‘MPJSHttpServiceWithUrl:andCallBack:‘, param, function(data){
      resolve(data);
    });
  });
};

• 文件中使用

1 、触发事件后由ios处理逻辑,

editCustomerAction: function() {
  // console.log("this.customerInformObj", this.customerInformObj)
  let protocol = "editCustomerAction:";
  let parameter = {
  customerInformObj: this.customerInformObj //传递给ios的参数，
  };
  jsTooc.c3_navtive_user.doActionFunc(protocol, parameter, function(
  data
  ) {});
},

2、 触发事件后由ios给出窗口，显示h5写的静态页面

popUpViewAction (){
  let protocol = "XJPopUpViewAction:";
  let parameter = {
    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，
    title: "关于VIP客户",//ios需要的参数
    width: "960",//ios需要的参数
    height: "710"//ios需要的参数
  };
  jsTooc.c3_navtive_user.doActionFunc(protocol, parameter, function(
    data
  ) {});
},