h5和ios/android交互

8 篇文章 0 订阅
本文详细介绍了在混合式App开发中,如何实现iOS调用H5方法并传递参数,以及H5如何调用iOS方法进行通信。在iOS端,通过将方法暴露在window对象中供客户端调用;在H5端,利用uniapp的onShow方法监听,并通过window.webkit.messageHandlers进行消息传递。同时展示了如何在不同平台下根据系统类型切换调用方式。
摘要由CSDN通过智能技术生成

我们的App项目属于混合式开发,ios/Android负责打包,app里面点击时通过地址跳入我们的h5页面。

问题1:ios调用h5方法并传参

//ios调用h5方法,必须将事件暴露在window中供客户端调用,不然ios调用不到我们的方法
onShow() {//这是uniapp的方法,vue的话写到mounted()
	window.footprintDelAll=(params)=>{//ios传的参数
		this.footprintDelAll(params)
	} 
},
methods:{
	footprintDelAll(params){//
		 alert(params,typeof(params),'接参类型int、string???')
		// uni.showToast({title:"接参"+params ,duration: 2000,icon: 'none',});
	}
}

问题2:h5调用ios方法并传参

当我们点击按钮时,给ios/Android传参,callAndroid()、scan.postMessage(str)是给他们传参的方法

goToIndex() {//0去首页
	let obj = {
		"type":0//0去首页
	}
	console.log(obj,'0首页')
	let str = JSON.stringify(obj)//对象转字符串
	let type = uni.getSystemInfoSync().platform
	switch (type) {
		case 'android':
			window.android.callAndroid(str);//传参并告诉Android跳转详情
			break;
		case 'ios':
			window.webkit.messageHandlers.scan.postMessage(str)//scan自定义传参方法名,后台需要用这个名接参
			break;
		default:
			break;
	}
}
  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值