h5激活app

h5激活app

参考链接：https://zhuanlan.zhihu.com/p/71682493

第一种方式：

参考链接地址：https://blog.csdn.net/jiang314/article/details/52269818

说明：通过h5可换醒app，如访问一个URL，点击按钮，打开应用，如果该应用APP没有安装，那么直接跳转到App Store的APP下载页面，通过点击的方式兼容性较好，如果安装了app，在手机各大浏览器(360浏览器 uc浏览器 搜狗浏览器 QQ浏览器 百度浏览器 )和QQ客户端中，能唤醒。微信 新浪微博客户端 腾讯微博客户端无法唤醒。

<template>
  <div class="twoPage">
    <a href="zjmobile://platformapi/startapp" id="zjmobliestart" target="_blank" @click="applink">唤醒浙江移动手机营业厅</a>
    <!-- <a href="weixin://platformapi/startapp" target="_blank" @click="applink">拿手机点，就能打开微信</a><br/>
	<a href="mqq://platformapi/startapp" target="_blank" @click="applink">拿手机点，就能打开打开QQ</a><br/> -->
	<!-- <a href="alipay://platformapi/startapp" target="_blank" @click="openApp">拿手机点，就能打开打开支付宝</a><br/> -->
	<!-- <a href="zhihu://platformapi/startapp" target="_blank" @click="applink">拿手机点，就能打开打开知乎</a><br/> -->
  </div>
</template>
<script>
export default {
  data(){
    return{
     
    }
  },
  methods:{
    applink(){
      var clickedAt = +new Date;  
      setTimeout(function(){
          !window.document.webkitHidden && setTimeout(function(){ 
                if (+new Date - clickedAt < 2000){  
                    window.location.href = 'https://itunes.apple.com/us/app/zhe-jiang-yi-dong-shou-ji/id898243566#weixin.qq.com';  
                }  
          }, 500);       
      }, 500)
    }
  }
}
</script>
<style scoped>
  
</style>

第二种方式：

<template>
  <div class="twoPage">
   <div class="btn" @click="openApp">打开支付宝App</div>
  </div>
</template>
<script>
export default {
  data(){
    return{
     
    }
  },
  methods:{
    openApp() { 
        // 通过iframe的方式试图打开APP，如果能正常打开，会直接切换到APP 
        // 每个APP有自己scheme协议名称，例如微信是weixin:// // 否则跳转APP下载页 
      var ifr = document.createElement('iframe');
      // ifr.src = 'APP协议://打开页面路径'; 
      // ifr.src = 'zjmobile://platformapi/startapp'; 
      ifr.src = 'alipay://platformapi/startapp'; 
      ifr.style.display = 'none'; 
      document.body.appendChild(ifr); 
      setTimeout(()=>{ 
         this.downloadAPP() 
         document.body.removeChild(ifr); 
        },2000)
      } ,
      downloadAPP() {
        // 判断是Android还是iOS 
        const u = navigator.userAgent; 
        let system = ''; 
        if (u.indexOf('Android') > -1 || u.indexOf('Adr') > -1) {
           system = 'Android'; 
        } else if (!!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
           system = 'iOS'; 
        } else { 
          system = 'unknown'; 
        } 
        // 根据系统不同，跳转不同的下载APP地址 
        if(system === 'Android') { 
          // TODO：这里还可以根据手机厂商的不同跳转各自厂商的应用商店
          // 支付宝
          window.location = "https://h5coml.vivo.com.cn/h5coml/appdetail_h5/browser_v2/index.html?appId=44428&resource=301&source=7" 
          
          } else if(system === 'iOS') {
            // window.location = "iOS商店地址" 
            // 移动手机营业厅
            // window.location = "https://itunes.apple.com/us/app/zhe-jiang-yi-dong-shou-ji/id898243566#weixin.qq.com" 

            // 支付宝
            window.location = "https://apps.apple.com/cn/app/%E6%94%AF%E4%BB%98%E5%AE%9D-%E7%94%9F%E6%B4%BB%E5%A5%BD-%E6%94%AF%E4%BB%98%E5%AE%9D/id333206289" 
          } 
      }
  }
}
</script>
<style scoped>
  
</style>