1. 程式人生 > >JS判斷各種各種瀏覽器型別和版本

JS判斷各種各種瀏覽器型別和版本

直接引用這個js
比如

import { Browser } from './browser.js' 	
log(Browser.client.name+" "+Browser.client.version);
//browser.js
var Browser=Browser || (function(window){
	var document = window.document,
		navigator = window.navigator,
		agent = navigator.userAgent.toLowerCase(),
		//IE8+支援.返回瀏覽器渲染當前文件所用的模式
		//IE6,IE7:undefined.IE8:8(相容模式返回7).IE9:9(相容模式返回7||8)
		//IE10:10(相容模式7||8||9)
		IEMode = document.documentMode,
		//chorme
		chrome = window.chrome || false,
		System = {
			//user-agent
			agent : agent,
			//是否為IE
			isIE : /msie/.test(agent),
			//Gecko核心
			isGecko: agent.indexOf("gecko")>0 && agent.indexOf("like gecko")<0,
			//webkit核心
			isWebkit: agent.indexOf("webkit")>0,
			//是否為標準模式
			isStrict: document.compatMode === "CSS1Compat",
			//是否支援subtitle
			supportSubTitle:function(){
				return "track" in document.createElement("track");
			},
			//是否支援scoped
			supportScope:function(){
				return "scoped" in document.createElement("style");
			},
			//獲取IE的版本號
			ieVersion:function(){
				try {
				   return agent.match(/msie ([\d.]+)/)[1] || 0;
				} catch(e) {
				   console.log("error");
				   return IEMode;
				}
			},
			//Opera版本號
			operaVersion:function(){
				try {
					if(window.opera) {
						return agent.match(/opera.([\d.]+)/)[1];
					} else if(agent.indexOf("opr") > 0) {
						return agent.match(/opr\/([\d.]+)/)[1];
					}
				} catch(e) {
					console.log("error");
					return 0;
				}
			},
			//描述:version過濾.如31.0.252.152 只保留31.0
			versionFilter:function(){
				if(arguments.length === 1 && typeof arguments[0] === "string") {
					var version = arguments[0];
						start = version.indexOf(".");
					if(start>0){
						end = version.indexOf(".",start+1);
						if(end !== -1) {
							return version.substr(0,end);
						}
					}
					return version;
				} else if(arguments.length === 1) {
					return arguments[0];
				}
				return 0;
			}
		};

	try {
		//瀏覽器型別(IE、Opera、Chrome、Safari、Firefox)
		System.type = System.isIE?"IE":
			window.opera || (agent.indexOf("opr") > 0)?"Opera":
			(agent.indexOf("chrome")>0)?"Chrome":
			//safari也提供了專門的判定方式
			window.openDatabase?"Safari":
			(agent.indexOf("firefox")>0)?"Firefox":
			'unknow';

		//版本號
		System.version = (System.type === "IE")?System.ieVersion():
			(System.type === "Firefox")?agent.match(/firefox\/([\d.]+)/)[1]:
			(System.type === "Chrome")?agent.match(/chrome\/([\d.]+)/)[1]:
			(System.type === "Opera")?System.operaVersion():
			(System.type === "Safari")?agent.match(/version\/([\d.]+)/)[1]:
			"0";

		//瀏覽器外殼
		System.shell=function(){
			//遨遊瀏覽器
			if(agent.indexOf("maxthon") > 0) {
				System.version = agent.match(/maxthon\/([\d.]+)/)[1] || System.version ;
				return "傲遊瀏覽器";
			}
			//QQ瀏覽器
			if(agent.indexOf("qqbrowser") > 0) {
				System.version = agent.match(/qqbrowser\/([\d.]+)/)[1] || System.version ;
				return "QQ瀏覽器";
			}

			//搜狗瀏覽器
			if( agent.indexOf("se 2.x")>0) {
				return '搜狗瀏覽器';
			}

			//Chrome:也可以使用window.chrome && window.chrome.webstore判斷
			if(chrome && System.type !== "Opera") {
				var external = window.external,
					clientInfo = window.clientInformation,
					//客戶端語言:zh-cn,zh.360下面會返回undefined
					clientLanguage = clientInfo.languages;

				//獵豹瀏覽器:或者agent.indexOf("lbbrowser")>0
				if( external && 'LiebaoGetVersion' in external) {
					 return '獵豹瀏覽器';
				}
				//百度瀏覽器
				if (agent.indexOf("bidubrowser")>0) {
					System.version = agent.match(/bidubrowser\/([\d.]+)/)[1] ||
						agent.match(/chrome\/([\d.]+)/)[1];
					return "百度瀏覽器";
				}
				//360極速瀏覽器和360安全瀏覽器
				if( System.supportSubTitle() && typeof clientLanguage === "undefined") {
					//object.key()返回一個數組.包含可列舉屬性和方法名稱
					var storeKeyLen = Object.keys(chrome.webstore).length,
						v8Locale = "v8Locale" in window;
					return storeKeyLen > 1? '360極速瀏覽器':'360安全瀏覽器';
				}
				return "Chrome";
			}
			return System.type;
		};

		//瀏覽器名稱(如果是殼瀏覽器,則返回殼名稱)
		System.name = System.shell();
		//對版本號進行過濾過處理
		System.version = System.versionFilter(System.version);

	} catch(e) {
		console.log("error");
	}
	return {
		client:System
	};

})(window);

export default Browser