浏览器点击链接打开指定APP详解

Android业务组件化之URL Scheme使用

什么是 URL Scheme?

android中的scheme是一种页面内跳转协议,是一种非常好的实现机制,通过定义自己的scheme协议,可以非常方便跳转app中的各个页面;通过scheme协议,服务器可以定制化告诉App跳转那个页面,可以通过通知栏消息定制化跳转页面,可以通过H5页面跳转页面等。

URL Scheme应用场景:

客户端应用可以向操作系统注册一个 URL scheme,该 scheme 用于从浏览器或其他应用中启动本应用。通过指定的 URL 字段,可以让应用在被调起后直接打开某些特定页面,比如商品详情页、活动详情页等等。也可以执行某些指定动作,如完成支付等。也可以在应用内通过 html 页来直接调用显示 app 内的某个页面。综上URL Scheme使用场景大致分以下几种:

  • 服务器下发跳转路径,客户端根据服务器下发跳转路径跳转相应的页面
  • H5页面点击锚点,根据锚点具体跳转路径APP端跳转具体的页面
  • APP端收到服务器端下发的PUSH通知栏消息,根据消息的点击跳转路径跳转相关页面
  • APP根据URL跳转到另外一个APP指定页面

URL Scheme协议格式:

先来个完整的URL Scheme协议格式:

openapp://thisapp:8888/content?Id=10011002

通过上面的路径 Scheme、Host、port、path、query全部包含,基本上平时使用路径就是这样子的。(Scheme和Host是必要的)

openapp代表该Scheme 协议名称(相当于http这样的协议头)
thisapp代表Scheme作用于哪个地址域(相当于baidu.com这样的域名格式,当然,可以不需要.com这样的后缀)
content代表Scheme指定的页面(相当于 baidu.com/css 这样的路径,然后在app内打开相关的页面)
Id代表传递的参数(相当于 https://www.baidu.com/s?wd=12312 这样的GET参数)
8888代表port该路径的端口号

URL Scheme如何使用:

1.在AndroidManifest.xml中对 < activity / > 标签 增加 < intent-filter /> 设置Scheme

<activity
            android:name=".GoodsDetailActivity"
            <!--Activity的名称-->
            android:theme="@style/AppTheme">
             <!--Activity的主题-->
            <!--要想在别的App上能成功调起App,必须添加intent过滤器-->
            <intent-filter>
                <!--协议部分,随便设置-->
                <data android:scheme="openapp" android:host="thisapp" android:path="/content" android:port="8888"/>
                <!--下面这几行也必须得设置-->
                <category android:name="android.intent.category.DEFAULT"/>
                <action android:name="android.intent.action.VIEW"/>
                <category android:name="android.intent.category.BROWSABLE"/>
            </intent-filter>
</activity>

2.JAVA获取Scheme跳转的参数

Uri uri = getIntent().getData();
if (uri != null) {
    // 完整的url信息
    String url = uri.toString();
    Log.e(TAG, "url: " + uri);
    // scheme部分
    String scheme = uri.getScheme();
    Log.e(TAG, "scheme: " + scheme);
    // host部分
    String host = uri.getHost();
    Log.e(TAG, "host: " + host);
    //port部分
    int port = uri.getPort();
    Log.e(TAG, "host: " + port);
    // 访问路劲
    String path = uri.getPath();
    Log.e(TAG, "path: " + path);
    List<String> pathSegments = uri.getPathSegments();
    // Query部分
    String query = uri.getQuery();
    Log.e(TAG, "query: " + query);
    //获取指定参数值
    String goodsId = uri.getQueryParameter("Id");
    Log.e(TAG, "Id: " + Id);
}

3.调用方式
HTML网页

<a href="openapp://thisapp:8888/content?Id=10011002">打开商品详情</a>

原生调用

  Intent intent = new Intent(Intent.ACTION_VIEW,Uri.parse("xl://goods:8888/goodsDetail?goodsId=10011002"));
  startActivity(intent);

4.如何判断一个Scheme是否有效

PackageManager packageManager = getPackageManager();
Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse("xl://goods:8888/goodsDetail?goodsId=10011002"));
List<ResolveInfo> activities = packageManager.queryIntentActivities(intent, 0);
boolean isValid = !activities.isEmpty();
if (isValid) {
    startActivity(intent);
}

如果手机内没有安装该APP则JS跳转至下载页面

 <!DOCTYPE html>
    <html lang="en">
    <head>
    <title>h5跳原生</title>
    </head>
 
    <body></body>
 
    <script>
 
    (function(){
 
        var ua = navigator.userAgent.toLowerCase();
 
        var t;
 
        var config = {
 
/*scheme:必须*/
 
                scheme_IOS: 'openapp://',
 
                scheme_Adr: 'openapp://thisapp:8888/content?Id=10011002',
 
                download_url: 'http://www.baidu.com',
                //下载地址
 
                timeout: 600
 
        };
 
 
 
        function openclient() {
 
            var startTime = Date.now();
 
 
 
            var ifr = document.createElement('iframe');
 
 
 
            ifr.src = ua.indexOf('os') > 0 ? config.scheme_IOS : config.scheme_Adr;
 
            ifr.style.display = 'none';
 
            document.body.appendChild(ifr);
 
 
 
            var t = setTimeout(function() {
 
                var endTime = Date.now();
 
 
 
                if (!startTime || endTime - startTime < config.timeout + 200) {
 
                    window.location = config.download_url;
 
                } else {
 
 
 
                }
 
            }, config.timeout);
 
 
 
            window.onblur = function() {
 
                clearTimeout(t);
 
            }
 
        }
 
        openclient();
 
    })()
    </script>
 
    </html>

第二种

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8" />
<title>文档标题</title>
</head>
<body>
    <div style="font-size: 68px;">
        <a href="javascript:open_or_download_app();">打开APP</a>
        <span id="device"></span>
    </div>
    <script type="text/javascript">
    //<![CDATA[
    function open_or_download_app() {
        var device = document.getElementById("device");
        if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) {
            device.innerHTML = "ios设备";
            // 判断useragent,当前设备为ios设备
            var loadDateTime = new Date();
          // 设置时间阈值,在规定时间里面没有打开对应App的话,直接去App store进行下载。
            window.setTimeout(function() {
                var timeOutDateTime = new Date();
                if (timeOutDateTime - loadDateTime <2200) {
                    window.location = "xxxxxxxx";  // APP下载地址
                } else {
                    window.close();
                }
            },2000);
             window.location = "openapp://thisapp:8888/content?Id=10011002";  //ios端URL Schema
        } else if (navigator.userAgent.match(/android/i)) {
            device.innerHTML = "Android设备";
            // 判断useragent,当前设备为Android设备
            // 判断useragent,当前设备为ios设备
            var loadDateTime = new Date();
          // 设置时间阈值,在规定时间里面没有打开对应App的话,直接去App store进行下载。
            window.setTimeout(function() {
                var timeOutDateTime = new Date();
                if (timeOutDateTime - loadDateTime < 2200) {
                    window.location = "xxxxxxxx";   // APP下载地址
                } else {
                    window.close();
                }
            },2000);
             window.location = "openapp://thisapp:8888/content?Id=10011002";  // Android端URL Schema 
        } 
    } 
    //]]>
    </script>
</body>
</html>

总结:
Scheme的基本使用也就这么多了,其他的使用在以后用到的时候再做总结。

干我们这行,啥时候懈怠,就意味着长进的停止,长进的停止就意味着被淘汰,只能往前冲,直到凤凰涅槃的一天!

发布了30 篇原创文章 · 获赞 23 · 访问量 1万+

猜你喜欢

转载自blog.csdn.net/qq_41716624/article/details/96000817
今日推荐