通过url scheme唤起APP操作

快乐星球喂
851 阅读2分钟

1、背景

通过APP分享出来的页面，在微信浏览器打开的时候可以采用微信开放标签唤起APP的操作。但是，如果使用外部其他浏览器，脱离微信webview的时候，应该如何跳回APP。

2、技术路径

为了保持代码(适配安卓和iOS)通用性，采用url scheme方式唤起APP。

3、url scheme工作原理

url scheme是一种特殊的url类型，告诉操作系统应该如何处理特定的url请求，工作原理依赖于操作系统对url的处理机制。当用浏览器打开一个url的时候，操作系统会去检查是否符合已经注册的url scheme，匹配到就会打开对应的APP。

4、具体使用方法

（1）APP注册url scheme

AndroidiOS
在androidmanifest.xml文件中注册在info.plist中注册

（2）特定url在浏览器唤起

按照约定好的协议分享一个url地址，使用浏览器打开，移动设备安装该APP的时候，会自动打开对应的APP，没有会唤起提示下载APP的页面，引导本地打开应用商店等下载。 微信浏览器会限制使用url scheme方式，可以采用微信开放标签的实现方式。

// 浏览器打开App
openAppBrowser() {
  let u = window.navigator.userAgent;
  let isWX = u.indexOf('MicroMessenger') > -1
  // 如果在微信浏览器中，提示打开其他浏览器
  if (isWX) {
    this.showTipMask = true // showTipMask 右上角箭头引导打开其他浏览器
  } else {
    this.showTipMask = false
    // 设置一个延迟，如果没有打开app,则跳转APP store
    var timer
    // 使用url打开app
    let url = 'exampleapp://?' + this.urlQueryParams //urlQueryParams跳转携带的参数
    window.location.href =  url 
    // 没有安装跳转到下载页
    if (timer) clearTimeout(timer);
    timer = setTimeout(() => {
      window.location.href = this.downloadUrl
    }, 3000)
    // 跳转app之后禁止再跳转中间页
    document.addEventListener('visibilitychange', () => {
      if (window.document.hidden) {
        clearTimeout(timer);
      }
    });
  }
},
avatar
文章
阅读
粉丝