js判断时候可以打开本地的软件或者插件

  点击一个按钮,打开本地的软件,比如问题反馈,需要调起本地的邮箱,填入一些信息。

  这个功能<a>标签有提供支持,但是如果本地没有安装邮箱,则无法打开,点了之后也没有任何反应,那么就需要判断当前电脑或者手机是否已经安装了指定的软件,如果已经安装,则打开该软件,否则,弹出模态框,给用户提示。

  其实这个并不好判断,后来在各大网站中找到一下方法

  1. ActiveXObject

  2. navigator.plugins

然而这些方法都无效

最后在GitHub上发现了一个插件 custom-protocol-detection

在插件中有这样一个原理:如果本地安装了软件,当尝试打开时,window后触发 blur 事件,如果无法打开,则什么都不会发生

根据这个原理,进行一个非常简单的封装,这里使用的是 vue + es6,只在Chrome或者移动端中可用

<template>
<div>
<p
class="link"
data-link="mailto:lihuan10@baidu.com"
@click="openMailto">
测试打开邮箱
</p>
</div>
</template> <script>
export default {
name: 'plugin',
data() {
return {
readyToBlur: false,
hasPlugin: null,
timeout: 1000,
timer: null
}
},
methods: {
openMailto(e) {
let link = e.target.dataset.link
this.readyToBlur = true;
this.hasPlugin = false;
window.location.href = link;
this.timer = setTimeout(() => {
this.readyToBlur = false;
!this.hasPlugin && this.noPlugin('mailto');
clearTimeout(this.timer);
}, this.timeout);
},
noPlugin(pluginName) {
console.log('no plugin ' + pluginName);
}
},
mounted() {
window.addEventListener('blur', () => {
if (this.readyToBlur) {
this.hasPlugin = true;
console.log('has plugin');
}
});
},
}
</script>

打开本地软件(比如邮箱,qq)的方法都是让浏览器的url发生改变,一般有一下方法

1. 使用 a 标签,并使用 href 属性,<a href="plugin: data">plugin</a>

2. 使用 window.location.href = 'plugin: data';

3. 使用 window.open('plugin: data');

这里使用的是第二种,第一种不好做拦截,第三种无论是否安装都会打开一个新的窗口

注意:这里设置的 timeout 是根据实际情况而定的,因为有一些软件打开的速度很慢。

js 判断是否可以打开本地软件的更多相关文章

  1. js通过注册表找到本地软件安装路径并且执行

    场景:用js执行本地的安装软件,如果不存在就执行安装 操作步骤: 1.前台js代码 <script type="text/javascript"> function e ...

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

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

  3. js 判断通过什么打开(安卓、苹果、微信、QQ、浏览器、某个app应用…)

    /* 获取当前环境: 系统环境: iOS Android PC 浏览器环境 微信内置浏览器.QQ内置浏览器.正常浏览器 是否app内打开 */ var ua = navigator.userAgent ...

  4. JS判断网页是否在微信中打开/

    JS判断网页是否在微信中打开,代码如下: <script type="text/javascript"> function is_weixn(){ var ua = n ...

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

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

  6. js判断当前页面在移动设备还是在PC端中打开

    方法一: var isPC = function () { var userAgentInfo = navigator.userAgent.toLowerCase(); var Agents = ne ...

  7. JS判断PC还是移动端打开网页

    最近在做移动端网站,也需兼容PC端.还没找到更好的方法,只能用javascr判断用户是在PC端打开还是移动端打开. JS判断 var isPC = function (){    var userAg ...

  8. js判断页面在pc端打开还是移动端打开

    js判断页面在pc端打开还是移动端打开,分别跳转不同的index.html window.addEventListener('load', function() { // true为手机,false为 ...

  9. js判断手机是否安装了某一款app,有则打开,没有去下载

    function openApp(){ if(navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) { var loadDateTime = new ...

随机推荐

  1. Windows Server 2008环境下Apache2.4+Tomcat8配置

    安装步骤 1. 安装配置JDK2. 安装配置Apache3. 安装配置Tomcat4. 启动服务并测试 一.Apache安装与配置 1.Apache解压在D盘根目录下建立一个文件夹Apache Gro ...

  2. 算法笔记-- 二进制集合枚举子集 && 求子集和 && 求父集和

    枚举子集: 复杂度:O(2^k) )&s); 用sos dp求解子集和以及父集和 子集和: ; i <= k; i--) { ; mask < (<<k); mask+ ...

  3. MongoDB基本操作(包括插入、修改、子节点排序等)

    一.基本操作 1.新增文章 db.article.insert({title:"今天天气很好",content:"我们一起去春游",_id:1}) 2.新增一条 ...

  4. jenkins配置QQ邮箱自动发送RF测试构建结果通知邮件

    声明:转载请注明出处,谢谢 首先确认QQ邮箱SMTP服务器的地址和端口号.如下图所示,请谨记,JENKINS全局邮箱配置需要使用: 步骤1:开启QQ邮箱的smtp服务:登陆QQ邮箱-设置-账户-开启P ...

  5. HDU - 1575——矩阵快速幂问题

    HDU - 1575 题目: A为一个方阵,则Tr A表示A的迹(就是主对角线上各项的和),现要求Tr(A^k)%9973.  Input数据的第一行是一个T,表示有T组数据. 每组数据的第一行有n( ...

  6. java线程自带队列的使用以及线程阻塞

    java线程,设置队列的大小实现队列阻塞 public class QueueThreads { private static int nThreads = 4;//Runtime.getRuntim ...

  7. tcp滑动窗口详解(2)

    http://blog.csdn.net/yujun00/article/details/636495 ARQ与滑动窗口概念  滑动窗口协议,是TCP使用的一种流量控制方法.该协议允许发送方在停止并等 ...

  8. UVa 11100 - The Trip, 2007 难度: 0

    题目 https://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem&a ...

  9. Cordova 6.5 -Android环境搭建笔记

    (Vue+Vue-cli+VueRouter+Webpack 构建单页面应用推荐看下面二个 https://lvyongbo.gitbooks.io/vue-loader/content/http:/ ...

  10. 指导手册04:运行MapReduce

    指导手册04:运行MapReduce   Part 1:运行单个MapReduce任务 情景描述: 本次任务要求对HDFS目录中的数据文件/user/root/email_log.txt进行计算处理, ...