app

与App交互(常用)

# 方案 1 自定义 url 协议

  • 该方案适合页面传参给 app
  • 缺点不是 100%稳定,有极小概率不成功
function clickFun() {
    location.href = `scancode://details?id=${state.params.uid}`
}

scancode  //与App协商的协议
details   //当前页面地址

2. app端拦截该协议做对应处理

# 方法传递(常用)

window.appMethod = {
  viewAll(params = '') {
    let u = navigator.userAgent
    let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
    let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1 //android终端
    if (isiOS) {
      // window.webkit.messageHandlers.jsShowDialog.postMessage('lalalalalalal');
      window.webkit.messageHandlers.goBackHome.postMessage({ params })
    } else if (isAndroid) {
      window.android.goBackHome({ params })
    }
  }
}

function clikFun() {
  appMethod.viewAll()
}

# App 或者 h5 多层次页面返回指定页面注意事项

router.go(-2) // 相当于 history.go(-2):后退+刷新, -2代表要返回的页面层次, 如:-1为上一个页面

# 在 iOS 桌面生成网页快捷方式图标(Web Clip)

https://www.jianshu.com/p/2ab0945823d8

# 仅供参考

<template>
  <div>
    <div class="voiceroom-top-btn" @click="dowload">立即下载</div>
    <div class="voiceroom-btn" @click="openApp">进入房间</div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      schemeUrl: `lksuperfunny://app/voiceRoom?roomId=${this.$route.query.roomId}`,
      downloadUrl: 'https://download.xxx.com/',
      timer: null
    }
  },
  methods: {
    openApp() {
      if (!this.isBlackApp()) {
        this.openTuer()
      } else {
        //显示手动打开外置浏览器提示
        alert('请在浏览器中打开')
      }
    },

    // 点击下载APP
    dowload() {
      window.location.href = this.downloadUrl
    },

    isBlackApp() {
      let u = navigator.userAgent.toLowerCase()
      return (
        /micromessenger/i.test(u) ||
        u.indexOf('weibo') > -1 ||
        u.indexOf('qq') > -1 ||
        u.indexOf('mqqbrowser') > -1
      )
    },

    // 点击打开app
    openTuer() {
      this.jumpApp(this.schemeUrl)
      this.noApp()
    },

    // 跳转打开app
    jumpApp(t) {
      try {
        let e = navigator.userAgent.toLowerCase()
        let n = e.match(/cpu iphone os (.*?) like mac os/)
        if (
          ((n = null !== n ? n[1].replace(/_/g, '.') : 0), parseInt(n) >= 9)
        ) {
          window.location.href = t
        } else {
          let r = document.createElement('iframe')
          ;(r.src = t), (r.style.display = 'none'), document.body.appendChild(r)
        }
      } catch (e) {
        window.location.href = t
      }
    },

    // 无响应或者没安装跳转下载
    noApp() {
      let t = Date.now()
      let r = this.downloadUrl
      this.timer = setTimeout(() => {
        return Date.now() - t > 2200
          ? (clearTimeout(this.timer), !1)
          : !document.webkitHidden &&
              !document.hidden &&
              void (location.href = r)
      }, 2000)
    }
  }
}
</script>
上次更新: