美文网首页Android开发程序员Android技术知识
Android中如何通过Js唤起Activity

Android中如何通过Js唤起Activity

作者: Android架构 | 来源:发表于2019-04-23 16:23 被阅读30次

    通过网页唤起一个app这样的场景有很多, 我们来看看如何实现这样的一个功能.
    通过html启动Activity的原理是js代码运行了URL去匹配对应的Activity. 我们可以通过配置Activity的intent-filter来匹配一个URL.

    <activity android:name=".SchemeActivity">
                <intent-filter>
                    <action android:name="android.intent.action.VIEW"/>
                    <category android:name="android.intent.category.BROWSABLE"/>
                    <category android:name="android.intent.category.DEFAULT"/>
                    <data
                        android:host="eric.com"
                        android:scheme="schemedemo"
                        />
                </intent-filter>
    </activity>
    

    data部分就是在构造一个匹配的Url, 启动比较常用的几个字段:
    一个网址:https://zhidao.baidu.com:8080/question?name=google&page=1
    scheme : 协议名,如同上面的 https.
    host : 域名,zhidao.baidu.com
    port : 端口号
    parh : 路径 , question
    query parameter : 查询参数,name=google&page=1
    这里Activity的data部分你都可以自定义,以达到唯一匹配,下面我们来看看如果通过js代码启动它.
    这里我们通过WebView去加载一段html, 从html跳转一个指定Activity来示范一下.
    先完成一段启动该Activity的Js代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
        <title>WEB唤起原生APP</title>
    </head>
    
    <body>
    
    <a href="schemedemo://eric.com:8080/test/scheme?name=google&page=1"> Simple Launch with parameters </a><br/><br/>
    <input id="download-app" type="hidden" name="storeurl" value="http://jd.com/8JZ5OO">
    
    <script>
        (function(){
            var ua = navigator.userAgent.toLowerCase();
            var t;
            var config = {
                /*scheme:必须*/
                scheme_IOS: 'schemedemo://',
                scheme_Adr: 'schemedemo://eric.com/test/scheme?name=google&page=1',
                download_url: document.getElementById('download-app').value,
                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);
                }
            }
            window.addEventListener("DOMContentLoaded", function(){
                document.getElementById("call-app").addEventListener('click', 
                    openclient, false);
            }, false);
        })()
    </script>
    
    </body>
    
    </html>
    

    下面再来在webview中加载该js

    public class MainActivity extends AppCompatActivity {
    
        private WebView mWebView;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            mWebView = findViewById(R.id.web_view);
    
            mWebView.loadUrl("file:///android_asset/callback.html");
        }
    }
    

    注意我的html文件放在了这里

    SchemeActivity这个画面布局如下

    public class SchemeActivity extends AppCompatActivity {
        TextView tv_data;
    
        @Override
        protected void onCreate(@Nullable Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_scheme);
            tv_data = findViewById(R.id.tv_data);
    
            Uri uri = getIntent().getData();
            StringBuilder sb = new StringBuilder();
            // 唤起链接
            sb.append("string : ").append(getIntent().getDataString()).append("\n");
            sb.append("scheme : ").append(uri.getScheme()).append("\n");
            sb.append("host : ").append(uri.getHost()).append("\n");
            sb.append("port : ").append(uri.getPort()).append("\n");
            sb.append("path : ").append(uri.getPath()).append("\n");
            // 接收唤起的参数
            sb.append("name : ").append(uri.getQueryParameter("name")).append("\n");
            sb.append("page : ").append(uri.getQueryParameter("page"));
    
            tv_data.setText(sb.toString());
        }
    }
    

    启动该webview的工程.

    接着点击Simple Launch with parameters按钮,就会通过URLschemedemo://eric.com:8080/test/scheme?name=google&page=1匹配到SchemeActivity, 并实现跳转.

    最后

    在现在这个金三银四的面试季,我自己在网上也搜集了很多资料做成了文档和架构视频资料免费分享给大家【包括高级UI、性能优化、架构师课程、NDK、Kotlin、混合式开发(ReactNative+Weex)、Flutter等架构技术资料】,希望能帮助到您面试前的复习且找到一个好的工作,也节省大家在网上搜索资料的时间来学习。

    资料获取方式:加入Android架构交流QQ群聊:513088520 ,进群即领取资料!!!

    点击链接加入群聊【Android移动架构总群】:加入群聊

    资料大全

    相关文章

      网友评论

        本文标题:Android中如何通过Js唤起Activity

        本文链接:https://www.haomeiwen.com/subject/ydtbgqtx.html