App与H5交互的几种方式

---

App与H5交互

在App内置H5中，我们H5页面经常会与App进行交互，本文中将记录几种常用的交互方式，可能不太完善，欢迎大家补充~

---

1、直接调用App的定义的方法

toLogin: () => {
  if (window.webkit && window.webkit.messageHandlers) {
  	// Ios 客户端调用方法
    window.webkit.messageHandlers.toLogin.postMessage('11');
  } else if (window.PlatformCurrency) {
  	// Android 客户端调用方法
    window.PlatformCurrency.toLogin()
  }
}

首先我们需要判断当前App的客户端是Ios还是Android，针对不同的客户端我们需要调用不同的方法。

---

2、调用方法获取数据

toKyc: () => {
  if (window.webkit && window.webkit.messageHandlers) {
    return window.webkit.messageHandlers.IDVerfication.postMessage('11');
  } else if (window.PlatformCurrency) {
    return window.PlatformCurrency.IDVerfication()
  }
}

这种方法和第一种方法一致，只不过是Ios与Android返回的值不同。

---

3、暴露方法给App调用传值

window["loginSucceed"] = (token) => {
  console.log('token:',token)
}

在很多时候并不一定是H5去调用App，我们有时候还需要App来调用H5来达到某种目的。
例如：
当我在H5页面内调用了App的登录方法，登录完成后我们需要得到用户的token，此时我们就可以暴露一个方法让App来调用H5暴露的方法，通过回调把值传递给H5进行进一步的操作。

---

总结

无论怎么样的交互，关键是与Ios和Android开发进行紧密沟通配合，就会达到预期的功能和效果。