js判斷是否可以打開本地軟件

Arno 發布于2019-08-23 12:16 / 3402人閱讀

摘要：判斷是否安裝插件最近遇到一個需求點擊一個按鈕，然后打開本地的軟件。所以需要判斷當前的電腦是否已經安裝指定軟件，如果已安裝，則打開軟件否則，彈出模態框，提示下載并安裝軟件。

js 判斷是否安裝插件

最近遇到一個需求：點擊一個按鈕，然后打開本地的軟件。類似一些網站打開 qq 一樣。但是后來遇到一個問題，如果本地沒有安裝這個指定的軟件，則無法打開。所以需要判斷當前的電腦是否已經安裝指定軟件，如果已安裝，則打開軟件；否則，彈出模態框，提示下載并安裝軟件。

剛開始的時候，一直在考慮如何使用 js 來判斷某個軟件是否安裝（可以被瀏覽器調用的軟件）。卻一直沒有頭緒。后來在各大網站找到一些方法：

ActiveXObject

navigator.plugins

但后來發現這些方法都無效，很是失望。

最后在 github 上找到了一個插件：
Custom Protocol Detection in Browser

使用方法參考里面的example即可。

基于插件原理的重構

在插件中有一個部分的原理是這樣的：
如果本地安裝了插件，當嘗試使用插件打開時，window后觸發blur事件；如果無法打開插件，則什么都不會發生。

根據這個原理，進行一個簡單的封裝。（其實也不算是封裝，只是簡單的把其中的原理展現出來而已）

這里使用的是es5代碼，主要是為了兼任低版本的瀏覽器，可以在理解其中的原理后，移植到相應的項目或者框架。

// dom部分

plugin 1

plugin 2

plugin 3

// js部分
var links = document.getElementsByClassName("link")
var readyToBlur = false
var hasPlugin = null
var timeout = 1000

window.addEventListener("blur", function () {
    if (readyToBlur) {
        hasPlugin = true
        console.log("has plugin")
    }
})

for (var i = 0; i < links.length; i++) {
    (function (id, win) {
        links[id].addEventListener("click", function () {
            readyToBlur = true
            hasPlugin = false
            window.location.href = links[id].getAttribute("data-link")
            var t = setTimeout(function () {
                win.readyToBlur = false
                !hasPlugin && onHasNoPlugin(links[id].innerText)
                clearTimeout(t)
            }, timeout)
        })
    })(i, window)
}

function onHasNoPlugin(pluginName) {
    console.log("no plugin: " + pluginName)
}

原理分析

打開本地插件/軟件（例如 qq）的方法基本是讓瀏覽器的 url 發生改變，一般有以下方法：

使用a標簽，并使用href屬性。plugin

window.location.href = "plugin:data"

window.open("plugin:data")

這里使用的是第二種方法。第一種不好做攔截，第三種無論是否安裝都會打開一個新的窗口。

當嘗試打開軟件時，開始監聽window的blur事件。在指定的時間內，如果觸發了blur事件，說明軟件已經安裝，修改hasPlugin標識；否則無操作。然后當時間到期時，移除監聽，并判斷hasPlugin的值，如果為false，則說明沒有安裝插件，執行相應的處理函數。

另外還需注意一點，這里設置的 timeout 是根據實際情況而定的，因為有一些軟件打開的速度可能很慢，不會像 qq 這樣的軟件一點擊就會馬上打開，所以這里把監聽的 timeout 設置為 1 秒。

2019-01-07 更新
如果需要強制將某個exe程序寫入注冊表，可以參考以下文章

Js調用exe程序方法

GPU云服務器云服務器本地磁盤是否可以擴容 js 判斷是否包含 js判斷是否當天 js判斷是否正數

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/98229.html

前端知識點總結——BOM

摘要：何時只要讓程序延遲執行一件事時如何件事啟動定時器讓程序等待毫秒后，自動執行一次，執行后自動停止停止定時器定時器原理定時器中的任務函數，必須等待主程序所有語句執行后，才能執行。將事件監聽對象加入到瀏覽器的監聽隊列中。前端知識點總結——BOM 1.BOM: Browser Object Model 什么是: 專門操作瀏覽器窗口的API 沒有標準, 導致瀏覽器兼容性問題包括: w...

BoYang 2019-08-22 14:55 評論0 收藏0
JavaScript 進階知識 - Ajax篇

摘要：注意事項以下版本要設置默認編碼，，否則程序可能無法正確顯示中文。組成部分協議是對請求和響應的報文內容進行了約束和規范。請求報文請求是由客戶端發起，其規范格式為請求行請求頭請求主體。 showImg(https://segmentfault.com/img/remote/1460000013696283?w=1920&h=1080); Ajax 前言前面我們已經學習了js基礎知識和一些...

Dongjie_Liu 2019-08-22 15:20 評論0 收藏0
JavaScript 進階知識 - Ajax篇

摘要：注意事項以下版本要設置默認編碼，，否則程序可能無法正確顯示中文。組成部分協議是對請求和響應的報文內容進行了約束和規范。請求報文請求是由客戶端發起，其規范格式為請求行請求頭請求主體。 showImg(https://segmentfault.com/img/remote/1460000013696283?w=1920&h=1080); Ajax 前言前面我們已經學習了js基礎知識和一些...

adie 2019-07-24 10:44 評論0 收藏0