前端(js) 判断本地是否安装了某个软件，如果安装则打开，如果没有安装则下载软件。

发布于：2023-04-26 ⋅ 阅读:(988) ⋅ 点赞:(0)

前端（js） 判断本地是否安装了某个软件，如果安装则打开，如果没有安装则下载软件。

需求场景

用户要求浏览器端可以直接打开本地安装的软件，如果没有安装就进行下载。

话不多说“开撸”

我本地是用内网通作为测试：

  1. 安装“内网通”；

  2. 在注册表中查找“内网通”注册表信息；
    在这里插入图片描述

  3. 将“内网通”的注册信息添加到目标区域；在这里插入图片描述
    4.下载js文件

    jquery:
    http://www.jq22.com/jquery/jquery-3.4.1.zip

    protocolcheck.js
    https://github.com/ismailhabib/custom-protocol-detection
    在这里插入图片描述

  4. 废话不多说上代码：

    <!DOCTYPE html>
<html lang="zh">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>监测平台</title>
  <style>
    h1 {
      position: absolute;
      top: 20%;
      left: 38.5%;
      color: white;
      font-size: 45px;
    }

    #indexBg {
      top: 45%;
      left: 15%;
      position: absolute;
      height: 200px;
      width: 72%;
      display: flex;
      justify-content: center;
    }

    .i_div {
      float: left;
      text-align: center;
      margin: 20px 73px;
    }

    .i_div img {
      cursor: pointer;
    }

    .i_div img {
      width: 70px;
      height: 70px;
      margin-top: 5px;
    }

    .i_div_text {
      width: 300px;
      height: 300px;
      font-size: 25px;
      color: white;
      /* background-color: cornsilk; */
    }

    .i_div_text span {
      cursor: pointer;
    }
  </style>
  <h1>监测平台</h1>
  <script>
    var url = "http://192.168.5.17";
  </script>
  <script src="js/jquery-3.4.1.js"></script>
  <script src="js/protocolcheck.js"></script>
</head>

<body style="background: url(bg.jpg) no-repeat 0 0 /cover;overflow: hidden;">
  <div id="indexBg">

    <div class="i_div" href="nwt://NWT?%1">
      <img src="./3.png" />
      <div id="pie_text" class="i_div_text">
        <span>内网通</span>
      </div>
    </div>
  </div>
  <script>
    function goto(flag) {
      switch (flag) {
        case 1: window.open(url + ":8080"); break;
        case 2: window.open(url + ":8082/dms/gologin.do"); break;
        default: window.open(url + ":8082/Download/内网通.exe"); break;
      }
    }
    function Exec(event) {
      window.protocolCheck($(this).attr("href"),
        function () {
          alert("protocol not recognized");
        });
      event.preventDefault ? event.preventDefault() : event.returnValue = false;
    }
    $(function () {
      $("div[href]").click(function (event) {
        window.protocolCheck($(this).attr("href"),
          function () {
            //alert("protocol not recognized");
            goto(3);
          });
        event.preventDefault ? event.preventDefault() : event.returnValue = false;
      });
    });

  </script>
</body>

</html>

参考于：
https://blog.csdn.net/evanxuhe/article/details/79240051
https://github.com/ismailhabib/custom-protocol-detection

本文含有隐藏内容，请 开通VIP 后查看

网站公告

今日签到

点亮在社区的每一天
去签到

热门文章

最新发布