admin管理员组

文章数量:1662101

需求

用户安装APP，则拉起APP
用户未安装APP,则跳转应用市场

实现方案

首先我们得知道js无法判断出当前手机里面App是否安装。（假如H5页面在微信内打开，可通过调用微信内部的JS API判断出App是否安装，但是该接口不对外开放）。
浏览器中打开H5页面唤起App时也是无法判断出当前app是否安装。

针对这种情况 ，目前业内普遍采取两种做法：
  • 1.是利用延时器原理，打开H5页面会尝试唤起App，假如失败了几秒后会直接跳转到下载页面 （缺点是即使用户安装了App过了时间也会跳转到下载页，从App返回到浏览器时也会变成下载页，体验很不好）
  • 2.不采用延时器，打开H5页面时会直接弹出这个弹框，用户点击【点击下载】，就能直接跳转到App下载页面引。

实现


      const appDownload = () => { 
        function failed() {
           window.location.href = '应用商店的地址'
        }

        function transfer(cb) {
          window.location.href = 'app的scheme';
          const initialTime = new Date();
          let counter = 0;
          let waitTime = 0;
          const checkOpen = setInterval(() => {
            counter++;
            waitTime = new Date() - initialTime;
            if (waitTime > 3500) {
              clearInterval(checkOpen);
              cb();
            }
            if (counter < 1000) {
              return;
            };
          }, 20);
          
          document.addEventListener('visibilitychange', () => {
            const isHidden = document.hidden;
            if (isHidden) {
              clearInterval(checkOpen);
            }
          });
        }
        transfer(failed);
      }

      if(!this.isWeixin()) {
        appDownload();
      }

ps：上面是有延迟的实现代码

另外，在微信里面scheme方案会被屏蔽，我这边是给了提示让浏览器打开，也不知道有没有什么别的好的方案~~~

本文标签： 跳转市场jsapp

版权声明：本文标题：通过js唤醒app或者跳转应用市场 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://www.elefans.com/dongtai/1729957151a1217359.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。