网页端与App端互通

2017-11-23  本文已影响151人  起个名字真难999

最近在公司做web App项目,需要在webApp中打开原生App
如果本地有安装原生App,那就直接去打开原生App对应的页面,如果本地没有安装原生App,那就直接去下载这个原生App.

先看网页端的代码

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>

    <body>
        <button onclick="doCheck()">测试设备Main2</button></br>
    </body>
    <script type="text/javascript">
        function doCheck() {
            var ua = navigator.userAgent;   
            //判断浏览器的当前设备,是iPhone,还是Android
            if(ua.indexOf('iPhone') > 0) {
                alert('iPhone设备');
            } else if(ua.indexOf('Android') > 0) {
                //alert('Android设备');
                checkAndroid();
            } else {
                alert('暂不支持你所用的系统,请使用Android或iOS系统')
            }
        }

            //
        function checkAndroid() {
            //"banggu://是网页与App约定的协议,这个是自由的不需要限制"
            //com.example.liuzenglong.newapp.Main2Activity 这个是我准备打开对应App的一个类
            //?id=10000&userId ='liuzenglong'&password='123456'"    //提供传递的参数给App
            window.location.href = "banggu://com.example.liuzenglong.newapp.Main2Activity/get/info?id=10000&userId ='liuzenglong'&password='123456'"; /***打开app的协议,有安卓同事提供***/
            window.setTimeout(function() {//这里500ms打不开App就会去下载页下载App
                window.location.href = "http://www.baidu.com"; /***打开app的下载页***/
            }, 500);
        }
    </script>

</html>

至此网页端的工作已经做完了,现在可以看App端,由于本人是做Android开发,这里只提供Android的实现方式.

Android需要做的事情

1.先在AndroidManifest的配置文件配置一下打开页面的数据

<activity android:name=".OpenFromWebActivity">
        <intent-filter>
            <action android:name="android.intent.action.VIEW" />

            <category android:name="android.intent.category.DEFAULT" />
            <category android:name="android.intent.category.BROWSABLE" />
            <data android:scheme="banggu" />//这个是我们对应的协议,与网页里面需要保持一致,
        </intent-filter>
    </activity>

2. 在Activity里处理网页传递来的数据**

/**
 * 获取Uri
 *
 * @return
 */
private String getUri() {
    // 尝试获取WebApp页面上过来的URL
    Uri uri = getIntent().getData();
    if (uri != null) {
        StringBuffer sb = new StringBuffer();
        // 完整的url信息
        sb.append("url: " + uri.toString());
        // scheme部分
        sb.append("\nscheme: " + uri.getScheme());
        // host部分   用来对应对包名,
        sb.append("\nhost: " + uri.getHost());
        enterActivity(uri.getHost());
        // 访问路劲
        sb.append("\npath: ");  //用来对应模块,
        List<String> pathSegments = uri.getPathSegments();
        for (int i = 0; pathSegments != null && i < pathSegments.size(); i++) {
            sb.append("/" + pathSegments.get(i));
        }
        // Query部分  //用来对应模块需要的参数
        sb.append("\nquery: ?" + uri.getQuery());

        return sb.toString();
    }
    return null;
}


/**
 * 进入对应的Activity
 * @param activityName
 */
private void enterActivity(String activityName) {
    try {
        Class currentClass = Class.forName(activityName);
        Toast.makeText(this, "---"+currentClass.getName(), Toast.LENGTH_SHORT).show();
        Intent intent = new Intent(this, currentClass);
        startActivity(intent);
    } catch (ClassNotFoundException e) {
        e.printStackTrace();
    }
}

这样基本工作就已经做完了,具体页面,具体操作。

上一篇下一篇

猜你喜欢

热点阅读