H5页面唤起指定app或跳转到应用市场

场景1：

在 h5 页面上，不管用户是否安装过该app，都直接跳转到应用市场，让用户从应用市场上打开app。

思路：

这种场景处理比较简单，直接判断判断是android端还是ios端，然后在点击按钮上赋值对应终端的应用市场下载链接就可以了，在微信上打开h5页面时也不用另外处理。跳转之前，系统会默认弹出对话框问是否跳转。

案例：

下图以ios端打开 淘宝 为例：

    
        
            
            
            
                body{ padding-top: 30px; }
                .open-app { margin: 30px; border-radius: 5px; padding: 10px 20px; border: 1px solid #ccc; }
                
                    
    
    
click me to store

       
    

场景2：

在 h5 页面上，用户点击打开app按钮，在用户手机上已经安装了App时，打开app，否则就引导用户前往应用市场。这样就方便了用户，而且在业务需要情况下，可以跳转到app指定页面和传参。

思路：

在 h5 页面上唤醒app ，需要用到 scheme协议（由app端小伙伴提供，关于什么是scheme文末补充），但是在微信浏览器里scheme不起作用，有没有印象有时在微信上打开的一些需要跳转到app的操作时，会提示在浏览器上打开，就是这个原因。

所以需要先判断是否为微信浏览器，是微信浏览器的话，提示到浏览器打开，不是的话，再判断是Android端还是iOS端，然后做相应的处理。

案例：

以打开 淘宝 为例：

    
        
        
        
        
        
    
    

        click me to app

        
    

原文链接：https://www.jianshu.com/p/21380058d609