我们有遇到可以直接打开QQ的跳转链接,也有遇到过直接启动office打开文档。

具体是如何操作的呢?

添加注册表项

首先需要在注册表中添加应用软件的启动地址,操作方式如下

在HKEY_CLASSES_ROOT下,新建JiraUserQuestion及其子节点:

然后,在JiraUserQuestion中,添加URL Protocol = "C:\Program Files (x86)\JiraUserQuestion\JiraUserQuestion.exe"。

- 这里是定义Protocol,后续通过protocol的检测协议,能访问应用地本地路径

在下方节点,command项中添加默认项。可以通过传入参数,启动应用

Js添加访问应用链接

添加前端demo:

 1 <!DOCTYPE html>
2 <html>
3 <head lang="en">
4 <meta charset="UTF-8">
5 <title>Custom Protocol Demo</title>
6 </head>
7 <body>
8 <h1>Click:</h1>
9 <a href="JiraUserQuestion://Open">Open JiraUserQuestion</a>
10 <script src="protocolcheck.js"></script>
11 </body>
12 </html>

protocolcheck.js文件,即protocol协议js,可从网上直接下载。

下载后,将文件放在html文件同一级,方便引用。

点击链接,效果如下:

检测本地是否存在应用

上面的protocolcheck.js文件,已封装了对url判断、加载的逻辑。

如果存在应用,则打开应用;否则有相应的回调可以选择处理事务。

1     <script>
2 //测试本地应用是否存在
3 let protocalUrl = `JiraUserQuestion://open`
4 protocolCheck(protocalUrl, () => {
5 alert('检测到,未安装客户端')
6 }, () => {
7 alert('检测到:已安装了客户端')
8 })
9 </script>

如果还想了解详细,可以下载我的Demo查看

参考列表:

StackOverFlow解决方案:  https://stackoverflow.com/questions/27489665/approaches-of-detection-of-custom-protocol-in-chrome-and-safari-browsers

Custom Protocol Detection in Browser源码:   https://github.com/ismailhabib/custom-protocol-detection

Native-App-Protocal-Detection源码地址:https://github.com/evanxuhe/Native-App-Protocal-Detection

js检测客户端是否安装:htps://www.cnblogs.com/damonFeng/p/12095558.html

JS 打开本地应用软件的更多相关文章

  1. html JS 打开本地程序及文件

    在网页打开本地应用程序示例: 一.在本地注册表自定义协议:以自定义调用Viso为例 1.在HKEY_CLASSES_ROOT下添加项ZVISIO. 2.修改ZVISIO项下的"(默认)&qu ...

  2. js 判断是否可以打开本地软件

    js判断时候可以打开本地的软件或者插件 点击一个按钮,打开本地的软件,比如问题反馈,需要调起本地的邮箱,填入一些信息. 这个功能<a>标签有提供支持,但是如果本地没有安装邮箱,则无法打开, ...

  3. js调用本地office打开服务器的office文件预览

    本来是想做成直接在网页上在线预览office文件的,但是找了好多,要不是收费,要不就是要调用别人的API不安全,所以纠结了好久还是用调用本地的office预览office文件. 废话不多说,那么怎么调 ...

  4. 实现HTML调用打开本地软件文件

    有时候我们想要实现一个功能,就是在HTML页面点击一个链接就能调用打开本地可执行文件.就像腾讯QQ.迅雷这种. 而实现这种功能其实也很简单,就是需要我们添加修改注册表,实现自定义URL Protoco ...

  5. 使用JS启动本地应用程序、屏幕键盘

    问题描述:     现在希望在Web端使用JS调用本地应用程序 问题解决:   (1)使用JS启动本地应用程序 使用上述代码重点是创建了一个ActiveXObject的对象     参考说明:     ...

  6. 【Electron】Electron开发入门(七):打开本地文件或者网页链接 and webview里操纵electron api

    1.打开本地文件或者网页链接 // 打开系统本地文件 const {shell} = require('electron'); // Open a local file in the default ...

  7. 移动浏览器H5页面通过scheme打开本地应用

    在移动端浏览器H5页面中,点击按钮打开本地应用主要通过 scheme 协议.本文主要介绍如何在浏览器H5页面中通过 scheme 协议打开本地应用. scheme协议定义 scheme 是一种页面之间 ...

  8. MyWebViewDemo【封装Webview常用配置和选择文件、打开相机、录音、打开本地相册的用法】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 封装webview的常用配置和选择文件.打开相机.录音.打开本地相册的用法.[如果想要使用简单的预览功能,可以参考<MyBri ...

  9. 京东在html5页面中打开本地app的解决方案

    转:https://blog.csdn.net/CameloHuang/article/details/64476385 从html5打开本地的app–如果本地没有app就跳转到下载页面,大家都会认为 ...

  10. 给你的移动网站加点料:推荐下载App,如果本地安装则直接打开本地App(Android/IOS)

    纵观现在每家移动网站,打开首页的时候,都有各种各样的形式来提示你下载自身的移动App(Android/IOS),这是做移动客户端产品的一个很好地引流的手段.当然各家引流下载的交互和视觉各不相同,有的是 ...

随机推荐

  1. python读书笔记-网页制作

    socket()函数 Python 中,我们用 socket()函数来创建套接字,语法格式如下:  Socket 对象(内建)方法  Python Internet 模块:

  2. Hadoop服务启动失败

    Hadoop服务启动失败今天启动Hadoop时,终端报了一个新的错误 ```bashStarting namenodes on [192.168.19.128]192.168.19.128: ssh: ...

  3. Linux(CentOS8) 安装 Docker

    查询当前系统的相关信息 cat /etc/os-release 输入内容如下 校验当前CentOS内核版本 说明:Docker 要求 CentOS 的内核版本,至少高于 3.10 .低于 3.10 的 ...

  4. win10无管理员权限下以压缩包方式安装JDK8

    使用场景:如果在没有管理员权限的情况下,无法运行.exe文件,可以使用这种方式安装,本次把JDK安装到D:\jdk-8u152 一:获取JDK8的压缩包 1.JDK8 华为镜像地址 2.将下载好的ex ...

  5. centOS7 + MongoDB 3.6.22 集群搭建 - 切片+副本集 - 个人学习

    因为我是学习这个,所以是安装成功之后自己再记录一下过程,mongodb是重新安装的,参考博客:MongoDB 3.6.9 集群搭建 - 切片+副本集 1. 服务结构介绍 结构图: 结构图解: 1. S ...

  6. sql union 和 union all

    UNION 操作符用于合并两个或多个 SELECT 语句的结果集. 但是需要注意: 1.union内部的select语句必须拥有相同数量的列. 2.列必须拥有相似的数据类型. 3.每条select语句 ...

  7. Docker-应用部署案例

    1.Docker部署mysql 拉取mysql镜像 # 查询mysql镜像 docker search mysql # 拉取镜像命令 docker pull centos/mysql-57-cento ...

  8. Centos7 禁用IPV6地址的方法

    方法 1 编辑文件/etc/sysctl.conf, vi /etc/sysctl.conf 添加下面的行: net.ipv6.conf.all.disable_ipv6 =1 net.ipv6.co ...

  9. Javaweb学习第十二弹--Request和Response

    XML配置方式编写Servlet 3.0版本之前,仅仅支持XML配置文件的配置方式 1.编写Servlet类 2.在web.xml中配置该Servlet Request和Response Reques ...

  10. 基于 Web SDK 实现视频通话场景 | 声网 SDK 教程

    声网视频 SDK 被广泛应用于多种实时互动场景中,例如视频会议.视频通话.音视频社交.在线教育等.为了让刚刚接触声网 SDK 的开发者,可以更顺畅地实现基础的视频通话功能,我们基于声网 Web SDK ...