如何用HTML检测是否安装低代码服务程序

本文介绍在HTML页面上呼起低代码服务时,如何在用户没有安装低代码服务程序时给出提示。

前提条件

您已经安装了互动直播或互动课堂低代码服务客户端,并且已经拿到了跳转链接。

实现样例

假设拿到的跳转链接为

aliyunclient://xx.xx.xx.xxx:xxxx/entry/standard_class?nick=chrtest&classId=65657e0c-****-****-bf50-537437d6b6ba&userAuthSession=ec15f883-3c3e-****-****-6c5d794e394b

创建HTML页面来呼起低代码服务客户端,HTML页面样例如下:

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Page Title</title>
</head>

<body>
    <a href="aliyunclient://xx.xx.xx.xxx:xxxx/entry/standard_class?nick=chrtest&classId=65657e0c-12e0-4613-bf50-537437d6b6ba&userAuthSession=ec15f883-3c3e-40d7-8573-6c5d794e394b&env=pre_release">
 打开客户端软件</a>
    <script src="protocolcheck.js"></script>
    <script src="example.js"></script>
</body>

</html>

其中依赖的js文件中,protocolcheck.js(license)为检测SDK,不需要改动。example.js包装了protocolcheck.js的基本使用,需要跟据您的HTML页面引用跳转链接的方式稍做改动。

protocolcheck.js核心API说明:

/* 检测给定uri是否存在
   参数列表:
   uri:协议地址
   failCb:失败回调
   successCb:成功回调,
   unsupportedCb:浏览器不支持时的回调
*/
window.protocolCheck(uri, failCB, successCb,unsupportedCb);

example.js样例如下:

window.onload = function() {
    document.querySelectorAll("a[href]").forEach(function(el) {
        el.addEventListener("click", function(event) {
            window.protocolCheck(
                el.getAttribute("href"),
                function() {
                    alert("protocol not recognized");
                }
            );
            event.preventDefault ? event.preventDefault() : event.returnValue = false;
        });
    });
}

example.js中,alert弹框的内容即为提示语,也可以加入其它操作代码。

样例及SDK下载地址: SDK下载