js浏览器和浏览器插件检测的方法总结（二）

最新推荐文章于 2023-07-31 10:43:29 发布

free_live_zyx

最新推荐文章于 2023-07-31 10:43:29 发布

阅读量1k

点赞数

分类专栏： javascript ASP.NET 文章标签：浏览器 string adobe chrome firefox mozilla

ASP.NET 同时被 2 个专栏收录

51 篇文章 0 订阅

订阅专栏

javascript

18 篇文章 0 订阅

订阅专栏

首次面对题目所示的需求的时候，头脑中没有任何概念，于是搜索，所有的中文结果都不是很满意。所幸老外的几篇文章还是很有参考价值，虽然最终没有解决我的问题，但是我还是把这几篇文章的内容作了抽取和整理，于是有了本文。主要内容如下：

1.1 浏览器检测

（参考：http://www.quirksmode.org/js/detect.html）

对于浏览器的类型和版本的检测，通常我们使用navigator.userAgent属性，但是它不能适用于所有的浏览器，有时还需要使用navigator.vendor、window.opera或者navigator.appVersion属性。这两个属性这里不做详细的说明，我们先看下面的一段代码：

var BrowserDetect = {
 
    init: function () {
 
           this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
 
           this.version = this.searchVersion(navigator.userAgent)
 
                  || this.searchVersion(navigator.appVersion)
 
                  || "an unknown version";
 
           this.OS = this.searchString(this.dataOS) || "an unknown OS";
 
    },
 
    searchString: function (data) {
 
           for (var i=0;i<data.length;i++)   {
 
                  var dataString = data[i].string;
 
                  var dataProp = data[i].prop;
 
                  this.versionSearchString = data[i].versionSearch || data[i].identity;
 
                  if (dataString) {
 
                        if (dataString.indexOf(data[i].subString) != -1)
 
                               return data[i].identity;
 
                  }
 
                  else if (dataProp)
 
                        return data[i].identity;
 
           }
 
    },
 
    searchVersion: function (dataString) {
 
           var index = dataString.indexOf(this.versionSearchString);
 
           if (index == -1) return;
 
           return parseFloat(dataString.substring(index+this.versionSearchString.length+1));
 
    },
 
    dataBrowser: [{
 
                  string: navigator.userAgent,
 
                  subString: "Chrome",
 
                  identity: "Chrome"
 
           },
 
{
 
                  prop: window.opera,
 
                  identity: "Opera",
 
                  versionSearch: "Version"
 
           },
 
（略。。。）
 
]
 
};

名为dataBrowser的数组是我们需要检测的浏览器对象，每个对象包含多个属性用来帮助代码从navigator.userAgent或者window.opera或者navigator.vendor属性中提前浏览器类别和版本信息。每个对象包含的属性说明如下：

1) string和subString。告诉程序在string属性中搜索subString的内容，从而确定浏览器类型。

2) prop。使用window.opera来判断浏览器类型。

3) identity。浏览器类型标识字符串。

4) versionSearch。用来检测浏览器版本的值，如果没有该值，使用identity属性替代。

完整代码如下（更多解释内容，可参考我给出的英文链接）：

1) string和subString。告诉程序在string属性中搜索subString的内容，从而确定浏览器类型。

2) prop。使用window.opera来判断浏览器类型。

3) identity。浏览器类型标识字符串。

4) versionSearch。用来检测浏览器版本的值，如果没有该值，使用identity属性替代。

完整代码如下（更多解释内容，可参考我给出的英文链接）：

var BrowserDetect = {
 
       init: function () {
 
              this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
 
              this.version = this.searchVersion(navigator.userAgent)
 
                    || this.searchVersion(navigator.appVersion)
 
                    || "an unknown version";
 
              this.OS = this.searchString(this.dataOS) || "an unknown OS";
 
       },
 
       searchString: function (data) {
 
              for (var i=0;i<data.length;i++)   {
 
                    var dataString = data[i].string;
 
                    var dataProp = data[i].prop;
 
                    this.versionSearchString = data[i].versionSearch || data[i].identity;
 
                    if (dataString) {
 
                           if (dataString.indexOf(data[i].subString) != -1)
 
                                  return data[i].identity;
 
                    }
 
                    else if (dataProp)
 
                           return data[i].identity;
 
              }
 
       },
 
       searchVersion: function (dataString) {
 
              var index = dataString.indexOf(this.versionSearchString);
 
              if (index == -1) return;
 
              return parseFloat(dataString.substring(index+this.versionSearchString.length+1));
 
       },
 
       dataBrowser: [
 
              {
 
                    string: navigator.userAgent,
 
                    subString: "Chrome",
 
                    identity: "Chrome"
 
              },
 
              {      string: navigator.userAgent,
 
                    subString: "OmniWeb",
 
                    versionSearch: "OmniWeb/",
 
                    identity: "OmniWeb"
 
              },
 
              {
 
                    string: navigator.vendor,
 
                    subString: "Apple",
 
                    identity: "Safari",
 
                    versionSearch: "Version"
 
              },
 
              {
 
                     prop: window.opera,
 
                    identity: "Opera",
 
                    versionSearch: "Version"
 
              },
 
              {
 
                    string: navigator.vendor,
 
                    subString: "iCab",
 
                    identity: "iCab"
 
              },
 
              {
 
                    string: navigator.vendor,
 
                    subString: "KDE",
 
                    identity: "Konqueror"
 
              },
 
              {
 
                    string: navigator.userAgent,
 
                    subString: "Firefox",
 
                    identity: "Firefox"
 
              },
 
              {
 
                    string: navigator.vendor,
 
                    subString: "Camino",
 
                    identity: "Camino"
 
              },
 
              {             // for newer Netscapes (6+)
 
                    string: navigator.userAgent,
 
                    subString: "Netscape",
 
                    identity: "Netscape"
 
              },
 
              {
 
                    string: navigator.userAgent,
 
                    subString: "MSIE",
 
                    identity: "Explorer",
 
                    versionSearch: "MSIE"
 
              },
 
              {
 
                    string: navigator.userAgent,
 
                    subString: "Gecko",
 
                    identity: "Mozilla",
 
                    versionSearch: "rv"
 
              },
 
              {             // for older Netscapes (4-)
 
                    string: navigator.userAgent,
 
                    subString: "Mozilla",
 
                    identity: "Netscape",
 
                    versionSearch: "Mozilla"
 
              }
 
       ],
 
       dataOS : [
 
              {
 
                    string: navigator.platform,
 
                    subString: "Win",
 
                    identity: "Windows"
 
              },
 
              {
 
                    string: navigator.platform,
 
                    subString: "Mac",
 
                    identity: "Mac"
 
              },
 
              {
 
                       string: navigator.userAgent,
 
                       subString: "iPhone",
 
                       identity: "iPhone/iPod"
 
           },
 
              {
 
                    string: navigator.platform,
 
                    subString: "Linux",
 
                    identity: "Linux"
 
              }
 
       ]
 
 
 
};
 
BrowserDetect.init();

1.2 浏览器插件检测

主要参考文章：http://www.matthewratzloff.com/blog/2007/06/26/detecting-plugins-in-internet-explorer-and-a-few-hints-for-all-the-others/

对于浏览器插件的检测，情况要略微复杂，包括插件是否安装和插件版本的检测，本文只讨论IE、Firefox和Chrome浏览器。在IE浏览器中，插件是作为ActiveXObject存在的，必须创建ActiveXObject对象才能检测插件是否安装；在Firefox和Chrome中，可以使用navigator.plugins属性来枚举安装的插件。对于插件的版本检测，在IE中，可以使用对应的ActiveXObject对象的GetVersions()方法来获取版本信息；在Firefox中，navigator.plugins['插件标识'].version的方法来获取版本；在Chrome中，却没有统一的方法来获取插件版本，有的插件根本无法获取版本信息。

下面是获取浏览器Pdf插件版本信息的代码：

var PdfDetect = {
 
    GetInfo: function (explorerName) {
 
        this.pdfVersion = this.searchPdf(explorerName);
 
    },
 
    searchPdf: function (explorerName) {
 
        explorerName = explorerName.toLowerCase();
 
        if (explorerName != 'explorer' && navigator.plugins.length > 0) {
 
            var version = 0;
 
            if (navigator.plugins['Adobe Acrobat'] || navigator.plugins['Adobe PDF Plug-in']) {
 
                if (explorerName == 'chrome') {
 
                    //  version = navigator.plugins[i].name.match(/([\d.]+)/) + "<br />"
 
                    version = 8; //chrome浏览器无法有效检测pdf版本
 
                }
 
                else {
 
                    version = navigator.plugins['Adobe PDF Plug-in'] ? 
 
                    navigator.plugins['Adobe Acrobat'].version : 
 
                    navigator.plugins['Adobe Acrobat'].version;
 
                }
 
            }
 
            return version;
 
        }
 
        else {
 
            var contol = null;
 
            try {
 
 
 
                // AcroPDF.PDF is used by version 7 and later
 
                control = new ActiveXObject('AcroPDF.PDF');
 
            } catch (e) {
 
                return 0;
 
            }
 
            if (!control) {
 
                try {
 
                    // PDF.PdfCtrl is used by version 6 and earlier
 
                    control = new ActiveXObject('PDF.PdfCtrl');
 
                } catch (e) {
 
                    return 0;
 
                }
 
            }
 
            if (control) {
 
                isInstalled = true;
 
                version = control.GetVersions().split(',');
 
                version = version[0].split('=');
 
                version = parseFloat(version[1]);
 
                return version;
 
            }
 
            return 0;
 
        }
 
    }

在上面的代码中，我们可以看到，在IE6和早期版本的浏览器中使用control = new ActiveXObject('PDF.PdfCtrl')来创建Pdf插件对象，在更新版本的IE浏览器中使用control = new ActiveXObject('AcroPDF.PDF')来创建Pdf对象，然后使用

version = control.GetVersions().split(',');
 
                version = version[0].split('=');
 
                version = parseFloat(version[1]);

来获取Pdf版本。在Firefox和Chrome中，使用navigator.plugins['Adobe Acrobat'] || navigator.plugins['Adobe PDF Plug-in']来判断是否安装了Pdf插件。在Firefox中，使用

version = navigator.plugins['Adobe PDF Plug-in'] ? 
 
                    navigator.plugins['Adobe Acrobat'].version : 
 
                    navigator.plugins['Adobe Acrobat'].version;

来检测Pdf插件的版本信息。

在chrome中，我没有检测Pdf插件的版本。

检测Flash Player插件的代码如下：

var isInstalled = false;
 var version = null;
 if (window.ActiveXObject) {
 var control = null;
 try {
 control = new ActiveXObject('ShockwaveFlash.ShockwaveFlash');
 } catch (e) {
 return;
 }
 if (control) {
 isInstalled = true;
 version = control.GetVariable('$version').substring(4);
 version = version.split(',');
 version = parseFloat(version[0] + '.' + version[1]);
 }
 } else {
 //在Firefox和Chrome中使用navigator.plugins["Shockwave Flash"]检测//Flash Player。}

其他插件的检测，参考我给出的英文链接。

原文连接：http://www.cnblogs.com/xuanhun/archive/2012/04/08/2437670.html

free_live_zyx

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js浏览器和浏览器插件检测的方法总结（二）

首次面对题目所示的需求的时候，头脑中没有任何概念，于是搜索，所有的中文结果都不是很满意。所幸老外的几篇文章还是很有参考价值，虽然最终没有解决我的问题，但是我还是把这几篇文章的内容作了抽取和整理，于是有了本文。主要内容如下：1.1 浏览器检测（参考：http://www.quirksmode.org/js/detect.html）对于浏览器的类型和版本的检测，通常我们使用navi
复制链接

扫一扫

专栏目录