0
点赞
收藏
分享

微信扫一扫

微信如何通过Html网页调用本地安卓app 或者ios app?

caoxingyu 2023-07-13 阅读 64


普通浏览器拉起

ps:此处只有android教程,,ios的自己看 文档吧。。

 

需求

微信如何通过Html网页调用本地安卓app 或者ios app

效果

android端

调用起来apk 没有问题,但是第一次应用没有安装的话  需要点击两次才可以下载,如果已经下载 可以正常调用的经过测试 学堂在线android端和iso端也是用的这个具体测试方法

ios端

微信在6.6.1版本后,单方面禁止了iOS的Universal Links的使用,所以提示右上角打开Safari来拉起app,其它app和浏览器不受影响 ios文档地址

以下纯android 方法...ios的请自己看上面文档哦  我不懂ios...才疏学浅,,告辞

演示

复制如下链接到微信聊天窗口

打开后

微信如何通过Html网页调用本地安卓app 或者ios app?_ios

点击打开客户端

但是第一次应用没有安装的话  需要点击两次才可以下载,如果已经下载 可以正常调用

ios端 。。效果微信在6.6.1版本后,单方面禁止了iOS的Universal Links的使用,所以提示右上角打开Safari来拉起app,其它app和浏览器不受影响  我用的是最新版的微信

方案

使用第三方openinstall

官网地址

他们里面有详细的api和耐心解答的客服 ,,

但是为了下次集成的更迅速 我准备把步骤记录下来。。。

  1. 注册好账号 登录
  2. 点击+号创建app

1 创建app  名称我们就叫做官方demo

创建好了以后会出现

AppKey:pqnyjs

Scheme~此处没有出现 但是根据我机智的判断应该是和AppKey一样 ~~~不信我们接着集成

选择免费版(如果有需要付费版的功能 可以支持一下)

android 端其他细节集成 

https://developer.openinstall.io/p-1556442280-765/android.html#integrate

点击android按照 他的官方文档集成(此处可以下载到他们的demo)

如果没有修改直接上传编译好的他的官方安装包

他会提示你

appKey 有问题

scheme(由openinstall自动分配): pqnyjs 也有问题 

改好appkey and scheme

如下

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
          package="com.fm.openinstalldemo">

    <uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>

    <!-- 获取mac地址 -->
    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
    <!-- 获取deviceId -->
    <uses-permission android:name="android.permission.READ_PHONE_STATE"/>

    <!-- 写文件存储 -->
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

    <application
        android:name=".InstallApplication"
        android:allowBackup="false"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".SplashActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>

                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
        </activity>

        <!-- android:allowTaskReparenting="true" -->
        <activity
            android:name=".MainActivity"
            android:launchMode="singleTask">
            <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="pqnyjs"/>

            </intent-filter>
        </activity>
        <activity android:name=".WakeupActivity"/>
        <activity android:name=".InstallActivity"/>
        <activity android:name=".ChannelActivity"/>

        <meta-data
            android:name="com.openinstall.APP_KEY"
            android:value="pqnyjs"/>

    </application>

</manifest>

编译后,再上传一次

android 端其他细节集成 

https://developer.openinstall.io/p-1556442280-765/android.html#integrate

点击android 集成文档

web端集成

网址https://developer.openinstall.io/p-1556442280-765/web.html#javascript

直接用js 加到自己项目中就好 记得把注释去掉

/*可选参数,是否优先考虑拉起app,以牺牲下载体验为代价*/
        //preferWakeup:true,

下载体验就是我说的 要点两次下载才可以下载,,第一次没反应 拉起是正常的。。。

html代码如下

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<button id="downloadButton">点我跳转</button>
<!-- 以下为openinstall集成代码,建议在html文档中尽量靠前放置,加快初始化过程 -->
<!-- 强烈建议直接引用下面的cdn加速链接,以得到最及时的更新,我们将持续跟踪各种主流浏览器的变化,提供最好的服务;不推荐将此js文件下载到自己的服务器-->
<script type="text/javascript" charset="UTF-8" src="//res.cdn.openinstall.io/openinstall.js"></script>
<script type="text/javascript">
    //openinstall初始化时将与openinstall服务器交互,应尽可能早的调用
    /*web页面向app传递的json数据(json string/js Object),应用被拉起或是首次安装时,通过相应的android/ios api可以获取此数据*/
    var data = OpenInstall.parseUrlParams();//openinstall.js中提供的工具函数,解析url中的所有查询参数
    new OpenInstall({
        /*appKey必选参数,openinstall平台为每个应用分配的ID*/
        appKey: "jrwpkb",
        /*可选参数,自定义android平台的apk下载文件名,只有apk在openinstall托管时才有效;个别andriod浏览器下载时,中文文件名显示乱码,请慎用中文文件名!*/
        //apkFileName : 'com.fm.openinstalldemo-v2.2.0.apk',
        /*可选参数,是否优先考虑拉起app,以牺牲下载体验为代价*/
        preferWakeup:true,
        /*自定义遮罩的html*/
        // mask: function () {
        //     return "<div id='openinstall_shadow' style='position:fixed;left:0;top:0;background:rgba(0,255,0,0.5);filter:alpha(opacity=50);width:100%;height:100%;z-index:10000;'></div>"
        // },
        /*openinstall初始化完成的回调函数,可选*/
        onready: function () {
            var m = this, button = document.getElementById("downloadButton");
            button.style.visibility = "visible";

            /*在app已安装的情况尝试拉起app*/
            m.schemeWakeup();
            /*用户点击某个按钮时(假定按钮id为downloadButton),安装app*/
            button.onclick = function () {
                m.wakeupOrInstall();
                return false;
            }
        }
    }, data);

</script>
</body>
</html>

 

 

这样就集成完了。。。拉起很nice

 

 

 

 

 

举报

相关推荐

0 条评论