为了账号安全，请及时绑定邮箱和手机立即绑定
首页 手记 Cordova开发App入门（四）打开及下载第三方App

Cordova开发App入门（四）打开及下载第三方App

标签：
Android JavaScript WebApp
前言

在开发app时经常会碰到这种需求：我要在A应用中打开B应用，那么用Cordova如何实现呢？
图片描述

欲知后事如何，且听下回分解......

...

大大大大佬，别，别打我，我继续写还不行了吗。

本文涉及到的知识点

1.检测第三方应用

2.使用内置浏览器启动第三方应用

3.appt解析第三方Apk安装包，或许必要的信息

4.下载第三方安装包

5.下载完成后打开第三方安装包

注：本文测试的方式为两种，一种是已在系统中安装完成的，一种是尚未安装的

请先浏览相关文章

Cordova开发App入门（一）创建android项目

Cordova开发App入门（二）使用热更新插件

Cordova开发App入门（三）消息推送

安装相关插件

1. startApp（打开第三方应用）

cordova plugin add https://github.com/lampaa/com.lampa.startapp.git

2. appavailability（检测第三方App是否存在）

cordova plugin add cordova-plugin-appavailability --save

3. inappbrowser（应用内置浏览器）

cordova plugin add cordova-plugin-inappbrowser

4. file-transfer （下载文件）

cordova plugin add cordova-plugin-file-transfer
代码实现

1. html

<button type="button" class="openApp" data-scheme="com.baidu.BaiduMap" data-activity="com.baidu.baidumaps.WelcomeScreen" data-title="百度地图">打开百度地图</button>
<button type="button" class="openApp" data-scheme="com.yadongzhang.owp" data-activity="com.uzmap.pkg.EntranceActivity" data-title="Dblog"
        data-download-url="http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d">DBlog</button>

<div style="position: fixed;width: 100%;height: 20px;bottom: 0;"><div id="progress" style="width: 0%;height: 20px;background: red;"></div></div>
<script type="text/javascript">
    zyd.openApp.init();
</script>

属性含义

1.data-scheme 对应app的package

2.data-activity 对应app的启动类

3.data-title 对应第三方app的名字

4.data-download-url 对应第三方app的下载地址（当且仅当app不存在时才会调用）

2.主要的Javascript代码

/**
 * 打开第三方app
 */
open: function(){
    console.log(">>>>  打开" + zyd.openApp._title);
    console.log(">>>>  " + zyd.openApp._scheme);
    console.log(">>>>  " + zyd.openApp._activity);
    console.log(">>>>  " + zyd.openApp._downloadUrl);
    // 检测第三方app是否存在，appAvailability.check(scheme, successCallback, errorCallback)
    appAvailability.check(
        zyd.openApp._scheme,
        function() {
            console.log(zyd.openApp._scheme + ' is available :)');
            // 打开第三方app：【1】
            var sApp = startApp.set({
                "application": zyd.openApp._scheme
            });
            sApp.start(function(compete) {
              console.log(">>>>  已打开APP。" + compete);
            }, function(error) {
              console.error(">>>>  打开失败。" + error);
            }, function(result, requestCode, resultCode) {
                console.log(">>>>  " + JSON.stringify(result) + ", " + requestCode + ", " + resultCode);
            });

        },
        function() {  // Error callback
            console.error(">>>>  " + scheme + ' 对应的App不存在，开始尝试下载App');
            zyd.openApp.downloadApk();
        }
    );
},

注：【1】处打开第三方App时需要获取第三方App的相关信息，大致包括package和main activity，获取方式，请参考如何获取第三方Apk的包名等信息

/**
 * 下载第三方app
 */
downloadApk: function() {
    if(!zyd.openApp._downloadUrl) {
        console.error("未设置downloadUrl！已终止下载App...");
        return;
    }
    console.error(">>>>  download Apk: " + zyd.openApp._downloadUrl);
    //下载文件
    window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function (fs) {
        fs.root.getFile('test1.apk', { create: true }, function (fileEntry) {
            console.log("=========" + JSON.stringify(fileEntry));
            var fileName=fileEntry.toURL().slice( fileEntry.toURL().lastIndexOf('/')+1);
            var targetPath = cordova.file.externalDataDirectory;//cordova.file.documentsDirectory;//'cdvfile://localhost/persistent/apk/';//注意！
            var filePath=targetPath+fileName
            zyd.openApp._download(filePath);
        }, function (errorHandle) {
           console.log(">>>>  下载文件失败: " + errorHandle);
       });
    }, function (errorHandle) {
        console.log(">>>>  下载文件失败: " + errorHandle);
    })
},
/**
 * 下载
 */
_download: function(filePath) {
    var ft = new FileTransfer();
    //监听下载进度
    ft.onprogress = function (e) {
        if (e.lengthComputable) {
            var progress = e.loaded / e.total * 100;
            $("#progress").css({"width": progress + "%"});
            $("#progress").html(progress + "%");
        }
    }
    ft.download(zyd.openApp._downloadUrl, filePath, function (entry) {
        console.log('下载成功');
        console.info(JSON.stringify(entry));
        console.log('文件位置：' + entry.toURL());
    }, function (err) {
        console.log("下载失败！");
        console.info(JSON.stringify(err));
    }, null, {});
}
模拟器测试

图片描述
注：测试用例中的百度地图已在模拟器上安装完成，理论上测试结果为：百度地图可以直接打开，而另一例【Dblog】应用则需要下载

测试打开百度地图
图片描述

查看控制台日志

D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 130 : >>>>  打开百度地图
I/Web Console: >>>>  打开百度地图 at file:///android_asset/www/js/biz.common.js:130
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 131 : >>>>  com.baidu.BaiduMap
I/Web Console: >>>>  com.baidu.BaiduMap at file:///android_asset/www/js/biz.common.js:131
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 132 : >>>>  com.baidu.baidumaps.WelcomeScreen
I/Web Console: >>>>  com.baidu.baidumaps.WelcomeScreen at file:///android_asset/www/js/biz.common.js:132
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 133 : >>>>  undefined
I/Web Console: >>>>  undefined at file:///android_asset/www/js/biz.common.js:133
D/dalvikvm: GC_CONCURRENT freed 315K, 7% free 9262K/9880K, paused 1ms+1ms, total 4ms
D/dalvikvm: WAIT_FOR_CONCURRENT_GC blocked 2ms
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 138 : com.baidu.BaiduMap is available :)
I/Web Console: com.baidu.BaiduMap is available :) at file:///android_asset/www/js/biz.common.js:138
D/CordovaActivity: Paused the activity.
W/PluginManager: THREAD WARNING: exec() call to startApp.start blocked the main thread for 47ms. Plugin should use CordovaInterface.getThreadPool().
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 144 : >>>>  已打开APP。OK
I/Web Console: >>>>  已打开APP。OK at file:///android_asset/www/js/biz.common.js:144
W/IInputConnectionWrapper: showStatusIcon on inactive InputConnection

测试打开DBlog
图片描述

查看控制台日志

D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 12 : >>>>  打开DBlog
I/Web Console: >>>>  打开DBlog at file:///android_asset/www/js/biz.common.js:12
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 13 : >>>>  com.yadongzhang.owp
I/Web Console: >>>>  com.yadongzhang.owp at file:///android_asset/www/js/biz.common.js:13
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 14 : >>>>  com.uzmap.pkg.EntranceActivity
I/Web Console: >>>>  com.uzmap.pkg.EntranceActivity at file:///android_asset/www/js/biz.common.js:14
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 15 : >>>>  http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d
I/Web Console: >>>>  http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d at file:///android_asset/www/js/biz.common.js:15
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 33 : >>>>  com.yadongzhang.owp 对应的App不存在，开始尝试下载App
E/Web Console: >>>>  com.yadongzhang.owp 对应的App不存在，开始尝试下载App at file:///android_asset/www/js/biz.common.js:33
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 40 : >>>>  download Apk: http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d
E/Web Console: >>>>  download Apk: http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d at file:///android_asset/www/js/biz.common.js:40
W/AssetFilesystem: Asset manifest not found. Recursive copies and directory listing will be slow.
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 45 : ========={"isFile":true,"isDirectory":false,"name":"test1.apk","fullPath":"/test1.apk","filesystem":"<FileSystem: persistent>","nativeURL":"file:///data/data/com.zyd.cordova/files/files/test1.apk"}
I/Web Console: ========={"isFile":true,"isDirectory":false,"name":"test1.apk","fullPath":"/test1.apk","filesystem":"<FileSystem: persistent>","nativeURL":"file:///data/data/com.zyd.cordova/files/files/test1.apk"} at file:///android_asset/www/js/biz.common.js:45
D/FileTransfer: download http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d to file:///mnt/sdcard/Android/data/com.zyd.cordova/files/test1.apk
D/FileTransfer: Download file:http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d
D/dalvikvm: GC_CONCURRENT freed 1296K, 14% free 8921K/10356K, paused 0ms+1ms, total 4ms
D/dalvikvm: GC_CONCURRENT freed 400K, 14% free 8917K/10356K, paused 2ms+0ms, total 7ms
D/dalvikvm: GC_CONCURRENT freed 389K, 14% free 8914K/10356K, paused 3ms+1ms, total 6ms
D/dalvikvm: GC_CONCURRENT freed 391K, 14% free 8914K/10356K, paused 0ms+0ms, total 5ms
D/dalvikvm: GC_CONCURRENT freed 390K, 14% free 8918K/10356K, paused 0ms+0ms, total 3ms
D/FileTransfer: Saved file: file:///mnt/sdcard/Android/data/com.zyd.cordova/files/test1.apk
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 71 : 下载成功
I/Web Console: 下载成功 at file:///android_asset/www/js/biz.common.js:71
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 72 : {"isFile":true,"isDirectory":false,"name":"test1.apk","fullPath":"/test1.apk","filesystem":"<FileSystem: files-external>","nativeURL":"file:///mnt/sdcard/Android/data/com.zyd.cordova/files/test1.apk"}
I/Web Console: {"isFile":true,"isDirectory":false,"name":"test1.apk","fullPath":"/test1.apk","filesystem":"<FileSystem: files-external>","nativeURL":"file:///mnt/sdcard/Android/data/com.zyd.cordova/files/test1.apk"} at file:///android_asset/www/js/biz.common.js:72
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 73 : 文件位置：file:///mnt/sdcard/Android/data/com.zyd.cordova/files/test1.apk
I/Web Console: 文件位置：file:///mnt/sdcard/Android/data/com.zyd.cordova/files/test1.apk at file:///android_asset/www/js/biz.common.js:73

OK，文件已下载成功！但是此处还有个问题就是：下载完成后的apk文件并不会自动安装，这样的话，还需要用户手动去安装，十分不便。那么，cordova中是否有打开第三方app的插件呢？

答案很显然，没有的话我在这吧吧个毛呢？

图片描述

接下来就需要安装另外一个插件：file-opener2（打开文件）

cordova plugin add https://github.com/pwlin/cordova-plugin-file-opener2.git

改造下相关js：_download方法

/**
 * 下载
 */
_download: function(filePath) {
    var ft = new FileTransfer();
    //监听下载进度
    ft.onprogress = function (e) {
        if (e.lengthComputable) {
            var progress = e.loaded / e.total * 100;
            $("#progress").css({"width": progress + "%"});
            $("#progress").html(progress + "%");
        }
    }
    ft.download(zyd.openApp._downloadUrl, filePath, function (entry) {
        console.log('下载成功');
        console.info(JSON.stringify(entry));
        console.log('文件位置：' + entry.toURL());
                // 打开apk安装包
        cordova.plugins.fileOpener2.open(
            entry.toURL(),
            'application/vnd.android.package-archive',
            {
                error : function(e){
                    alert('失败status:'+JSON.stringify(e)+ " 路径："+entry.toURL() )
                },
                success : function(){
                  alert("安装完成后请重新打开。");
                }
        });

    }, function (err) {
        console.log("下载失败！");
        console.info(JSON.stringify(err));
    }, null, {});
}

重新运行项目
图片描述

查看控制台日志

D/CordovaActivity: Started the activity.
D/CordovaActivity: Resumed the activity.
W/EGL_emulation: eglSurfaceAttrib not implemented
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 12 : >>>>  打开DBlog
I/Web Console: >>>>  打开DBlog at file:///android_asset/www/js/biz.common.js:12
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 13 : >>>>  com.yadongzhang.owp
I/Web Console: >>>>  com.yadongzhang.owp at file:///android_asset/www/js/biz.common.js:13
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 14 : >>>>  com.uzmap.pkg.EntranceActivity
I/Web Console: >>>>  com.uzmap.pkg.EntranceActivity at file:///android_asset/www/js/biz.common.js:14
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 15 : >>>>  http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d
I/Web Console: >>>>  http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d at file:///android_asset/www/js/biz.common.js:15
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 33 : >>>>  com.yadongzhang.owp 对应的App不存在，开始尝试下载App
E/Web Console: >>>>  com.yadongzhang.owp 对应的App不存在，开始尝试下载App at file:///android_asset/www/js/biz.common.js:33
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 40 : >>>>  download Apk: http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d
E/Web Console: >>>>  download Apk: http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d at file:///android_asset/www/js/biz.common.js:40
W/AssetFilesystem: Asset manifest not found. Recursive copies and directory listing will be slow.
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 45 : ========={"isFile":true,"isDirectory":false,"name":"test1.apk","fullPath":"/test1.apk","filesystem":"<FileSystem: persistent>","nativeURL":"file:///data/data/com.zyd.cordova/files/files/test1.apk"}
I/Web Console: ========={"isFile":true,"isDirectory":false,"name":"test1.apk","fullPath":"/test1.apk","filesystem":"<FileSystem: persistent>","nativeURL":"file:///data/data/com.zyd.cordova/files/files/test1.apk"} at file:///android_asset/www/js/biz.common.js:45
D/FileTransfer: download http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d to file:///mnt/sdcard/Android/data/com.zyd.cordova/files/test1.apk
D/FileTransfer: Download file:http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d
D/dalvikvm: GC_CONCURRENT freed 1292K, 14% free 8921K/10352K, paused 1ms+2ms, total 8ms
D/dalvikvm: GC_CONCURRENT freed 399K, 14% free 8929K/10352K, paused 2ms+1ms, total 31ms
D/dalvikvm: GC_CONCURRENT freed 403K, 14% free 8924K/10352K, paused 1ms+0ms, total 19ms
D/dalvikvm: GC_CONCURRENT freed 402K, 14% free 8925K/10352K, paused 0ms+1ms, total 11ms
D/FileTransfer: Saved file: file:///mnt/sdcard/Android/data/com.zyd.cordova/files/test1.apk
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 71 : 下载成功
I/Web Console: 下载成功 at file:///android_asset/www/js/biz.common.js:71
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 72 : {"isFile":true,"isDirectory":false,"name":"test1.apk","fullPath":"/test1.apk","filesystem":"<FileSystem: files-external>","nativeURL":"file:///mnt/sdcard/Android/data/com.zyd.cordova/files/test1.apk"}
I/Web Console: {"isFile":true,"isDirectory":false,"name":"test1.apk","fullPath":"/test1.apk","filesystem":"<FileSystem: files-external>","nativeURL":"file:///mnt/sdcard/Android/data/com.zyd.cordova/files/test1.apk"} at file:///android_asset/www/js/biz.common.js:72
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 73 : 文件位置：file:///mnt/sdcard/Android/data/com.zyd.cordova/files/test1.apk
I/Web Console: 文件位置：file:///mnt/sdcard/Android/data/com.zyd.cordova/files/test1.apk at file:///android_asset/www/js/biz.common.js:73
W/PluginManager: THREAD WARNING: exec() call to FileOpener2.open blocked the main thread for 19ms. Plugin should use CordovaInterface.getThreadPool().
D/CordovaActivity: Paused the activity.
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 82 : >>>>  安装完成后请重新打开。
I/Web Console: >>>>  安装完成后请重新打开。 at file:///android_asset/www/js/biz.common.js:82
W/IInputConnectionWrapper: showStatusIcon on inactive InputConnection
D/CordovaActivity: Stopped the activity.
D/CordovaActivity: Started the activity.
D/CordovaActivity: Resumed the activity.
W/EGL_emulation: eglSurfaceAttrib not implemented
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 12 : >>>>  打开DBlog
I/Web Console: >>>>  打开DBlog at file:///android_asset/www/js/biz.common.js:12
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 13 : >>>>  com.yadongzhang.owp
I/Web Console: >>>>  com.yadongzhang.owp at file:///android_asset/www/js/biz.common.js:13
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 14 : >>>>  com.uzmap.pkg.EntranceActivity
I/Web Console: >>>>  com.uzmap.pkg.EntranceActivity at file:///android_asset/www/js/biz.common.js:14
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 15 : >>>>  http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d
I/Web Console: >>>>  http://downloadpkg.apicloud.com/app/download?path=http://7zmssi.com1.z0.glb.clouddn.com/b3bf6ca124fb52aa2d51350262313c9d_d at file:///android_asset/www/js/biz.common.js:15
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 19 : com.yadongzhang.owp is available :)
I/Web Console: com.yadongzhang.owp is available :) at file:///android_asset/www/js/biz.common.js:19
W/PluginManager: THREAD WARNING: exec() call to startApp.start blocked the main thread for 21ms. Plugin should use CordovaInterface.getThreadPool().
D/CordovaActivity: Paused the activity.
D/SystemWebChromeClient: file:///android_asset/www/js/biz.common.js: Line 24 : >>>>  已打开APP。OK
I/Web Console: >>>>  已打开APP。OK at file:///android_asset/www/js/biz.common.js:24
W/IInputConnectionWrapper: showStatusIcon on inactive InputConnection
D/CordovaActivity: Stopped the activity.

至此，【Cordova开发App入门（四）打开及下载第三方App】已完成，感兴趣的朋友赶紧去试试吧。
图片描述

参考资料

https://github.com/lampaa/com.lampa.startapp

https://github.com/ohh2ahh/AppAvailability

https://github.com/pwlin/cordova-plugin-file-opener2

https://blog.csdn.net/mcp1490644562/article/details/78717586

https://blog.csdn.net/u011127019/article/details/58062123

https://blog.csdn.net/hardly555/article/details/80545793/

项目源码

1.我的github

2.我的码云

点击查看更多内容
发表于 2018.06.21 20:36， 共 12252 人浏览

本文原创发布于慕课网 ，转载请注明出处，谢谢合作

举报
5人点赞

若觉得本文不错，就分享一下吧！

评论

作者其他优质文章

正在加载中

慕冬雪

全栈工程师
手记
篇
粉丝
9132
获赞与收藏
5502

关注作者，订阅最新文章

阅读免费教程

感谢您的支持，我会继续努力的～
扫码打赏，你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫，即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消