브라우저의 버전을 검출하려면 어떻게 해야 합니까?
웹사이트를 방문하는 사용자가 Firefox 3 또는 4를 가지고 있는지 탐지할 수 있는 코드를 찾아다녔습니다.제가 찾은 것은 브라우저의 종류를 감지하는 코드뿐이며 버전은 찾지 못했습니다.
이런 브라우저 버전은 어떻게 인식하나요?
브라우저가 말하는 내용을 확인하고 이 정보를 사용하여 여러 브라우저를 기록하거나 테스트할 수 있습니다.
navigator.sayswho= (function(){
var ua= navigator.userAgent;
var tem;
var M= ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
if(/trident/i.test(M[1])){
tem= /\brv[ :]+(\d+)/g.exec(ua) || [];
return 'IE '+(tem[1] || '');
}
if(M[1]=== 'Chrome'){
tem= ua.match(/\b(OPR|Edge)\/(\d+)/);
if(tem!= null) return tem.slice(1).join(' ').replace('OPR', 'Opera');
}
M= M[2]? [M[1], M[2]]: [navigator.appName, navigator.appVersion, '-?'];
if((tem= ua.match(/version\/(\d+)/i))!= null) M.splice(1, 1, tem[1]);
return M.join(' ');
})();
console.log(navigator.sayswho); // outputs: `Chrome 62`
이것은 Kennebec의 대답에 대한 개선이다.
function get_browser() {
var ua=navigator.userAgent,tem,M=ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
if(/trident/i.test(M[1])){
tem=/\brv[ :]+(\d+)/g.exec(ua) || [];
return {name:'IE',version:(tem[1]||'')};
}
if(M[1]==='Chrome'){
tem=ua.match(/\bOPR|Edge\/(\d+)/)
if(tem!=null) {return {name:'Opera', version:tem[1]};}
}
M=M[2]? [M[1], M[2]]: [navigator.appName, navigator.appVersion, '-?'];
if((tem=ua.match(/version\/(\d+)/i))!=null) {M.splice(1,1,tem[1]);}
return {
name: M[0],
version: M[1]
};
}
var browser=get_browser(); // browser.name = 'Chrome'
// browser.version = '40'
console.log(browser);
이렇게 하면 암호의 모호함으로부터 자신을 보호할 수 있습니다.
다음은 2019년 5월 현재 브라우저 탐지를 처리하는 몇 가지 주요 라이브러리입니다.
Bowser by Lancedikson - 3,761★s - 최종 갱신일 : 2019년 5월 26일 - 4.8KB
var result = bowser.getParser(window.navigator.userAgent);
console.log(result);
document.write("You are using " + result.parsedResult.browser.name +
" v" + result.parsedResult.browser.version +
" on " + result.parsedResult.os.name);
<script src="https://unpkg.com/bowser@2.4.0/es5.js"></script>
*크롬 기반 가장자리 지원
Platform.js by bestiejs - 2,250★s - 최종 갱신일 : 2018년 10월 30일 - 5.9KB
console.log(platform);
document.write("You are using " + platform.name +
" v" + platform.version +
" on " + platform.os);
<script src="https://cdnjs.cloudflare.com/ajax/libs/platform/1.3.5/platform.min.js"></script>
jQuery Browser by gabceb - 504★s - 최종 갱신일 2015년 11월 23일 - 1.3KB
console.log($.browser)
document.write("You are using " + $.browser.name +
" v" + $.browser.versionNumber +
" on " + $.browser.platform);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-browser/0.1.0/jquery.browser.min.js"></script>
darcyclarke - 522★s - 최종 갱신일 2015년 10월 26일 - 2.9KB
var result = detect.parse(navigator.userAgent);
console.log(result);
document.write("You are using " + result.browser.family +
" v" + result.browser.version +
" on " + result.os.family);
<script src="https://cdnjs.cloudflare.com/ajax/libs/Detect.js/2.2.2/detect.min.js"></script>
QuicksMode에 의한 브라우저 검출(아카이브) - 최종 갱신일 2013년 11월 14일 - 884B
console.log(BrowserDetect)
document.write("You are using " + BrowserDetect.browser +
" v" + BrowserDetect.version +
" on " + BrowserDetect.OS);
<script src="https://kylemit.github.io/libraries/libraries/BrowserDetect.js"></script>
주의사항:
- WhichBrowser - 1,355★s - 2018년 10월 2일 최종 업데이트
- Modernizr - 23,397★s - 2019년 1월 12일 최종 갱신 - 사료용 말을 먹이려면 기능 감지가 모든 사용 스타일의 질문을 유도해야 합니다.브라우저 검출은 실제로는 개별 브라우저용으로 커스터마이즈된 이미지, 다운로드 파일 또는 명령을 제공하기 위한 것입니다.
상세 정보
이는 Kennebec(K)의 답변과 Hermann Ingjaldsson(H)의 답변을 결합한 것이다.
- 원래 답변의 최소 코드를 유지합니다. (K)
- Microsoft Edge(K)와 연동
- 새 변수/개체를 만드는 대신 네비게이터 개체를 확장합니다. (K)
- 브라우저 버전과 이름을 독립된 하위 개체로 구분합니다. (H)
navigator.browserSpecs = (function(){
var ua = navigator.userAgent, tem,
M = ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
if(/trident/i.test(M[1])){
tem = /\brv[ :]+(\d+)/g.exec(ua) || [];
return {name:'IE',version:(tem[1] || '')};
}
if(M[1]=== 'Chrome'){
tem = ua.match(/\b(OPR|Edge)\/(\d+)/);
if(tem != null) return {name:tem[1].replace('OPR', 'Opera'),version:tem[2]};
}
M = M[2]? [M[1], M[2]]: [navigator.appName, navigator.appVersion, '-?'];
if((tem = ua.match(/version\/(\d+)/i))!= null)
M.splice(1, 1, tem[1]);
return {name:M[0], version:M[1]};
})();
console.log(navigator.browserSpecs); //Object { name: "Firefox", version: "42" }
if (navigator.browserSpecs.name == 'Firefox') {
// Do something for Firefox.
if (navigator.browserSpecs.version > 42) {
// Do something for Firefox versions greater than 42.
}
}
else {
// Do something for all other browsers.
}
bowser JavaScript 라이브러리는 이 기능을 제공합니다.
if (bowser.msie && bowser.version <= 6) {
alert('Hello China');
}
잘 유지되고 있는 것 같아요.
사용방법 : http://www.quirksmode.org/js/detect.html
alert(BrowserDetect.browser); // will say "Firefox"
alert(BrowserDetect.version); // will say "3" or "4"
jQuery 1.9.1 이상에서는 다음 명령어가 삭제되었기 때문에 스스로 솔루션을 찾고 있었습니다.$.browser기능성.나에게 맞는 작은 기능을 생각해 냈어요어떤 브라우저인지 확인하려면 글로벌 변수(내 변수 _browser라고 부릅니다)가 필요합니다.저는 jsfiddle을 써서 어떻게 사용할 수 있는지 설명했습니다.물론 _browser 테스트를 추가하는 것만으로 다른 브라우저로 확장할 수 있습니다.foo. 여기서 foo는 브라우저 이름입니다.인기 있는 것만 했어요.
_browser = {};
function detectBrowser() {
var uagent = navigator.userAgent.toLowerCase(),
match = '';
_browser.chrome = /webkit/.test(uagent) && /chrome/.test(uagent) &&
!/edge/.test(uagent);
_browser.firefox = /mozilla/.test(uagent) && /firefox/.test(uagent);
_browser.msie = /msie/.test(uagent) || /trident/.test(uagent) ||
/edge/.test(uagent);
_browser.safari = /safari/.test(uagent) && /applewebkit/.test(uagent) &&
!/chrome/.test(uagent);
_browser.opr = /mozilla/.test(uagent) && /applewebkit/.test(uagent) &&
/chrome/.test(uagent) && /safari/.test(uagent) &&
/opr/.test(uagent);
_browser.version = '';
for (x in _browser) {
if (_browser[x]) {
match = uagent.match(
new RegExp("(" + (x === "msie" ? "msie|edge" : x) + ")( |\/)([0-9]+)")
);
if (match) {
_browser.version = match[3];
} else {
match = uagent.match(new RegExp("rv:([0-9]+)"));
_browser.version = match ? match[1] : "";
}
break;
}
}
_browser.opera = _browser.opr;
delete _browser.opr;
}
detectBrowser();
console.log(_browser)
현재 브라우저가 Opera인지 확인하려면 다음과 같이 하십시오.
if (_browser.opera) { // Opera specific code }
편집 IE11 및 Opera/Chrome의 포맷 수정 및 검출 수정, 결과에서 browserResult로 변경.다음 순서는_browser키는 문제가 되지 않습니다.jsFiddle 링크가 갱신되었습니다.
2015/08/11 편집 Internet Explorer 12(EDGE)의 새로운 테스트 케이스가 추가되어 작은 regexp 문제가 수정되었습니다.jsFiddle 링크가 갱신되었습니다.
function BrowserCheck()
{
var N= navigator.appName, ua= navigator.userAgent, tem;
var M= ua.match(/(opera|chrome|safari|firefox|msie|trident)\/?\s*(\.?\d+(\.\d+)*)/i);
if(M && (tem= ua.match(/version\/([\.\d]+)/i))!= null) {M[2]=tem[1];}
M= M? [M[1], M[2]]: [N, navigator.appVersion,'-?'];
return M;
}
어레이가 반환됩니다.첫 번째 요소는 브라우저 이름이고 두 번째 요소는 문자열 형식의 완전한 버전 번호입니다.
에서는, 「Javascript」의 「Javascript」의 「의 매칭을 할 수 .navigator.userAgent파이어폭스:
var uMatch = navigator.userAgent.match(/Firefox\/(.*)$/),
ffVersion;
if (uMatch && uMatch.length > 1) {
ffVersion = uMatch[1];
}
ffVersion 되다undefined츠요시
jQuery는 이 문제를 잘 처리할 수 있습니다(jQuery.browser).
var ua = $.browser;
if ( ua.mozilla && ua.version.slice(0,3) == "1.9" ) {
alert( "Do stuff for firefox 3" );
}
편집: Joshua가 아래의 코멘트에서 기술한 바와 같이 jQuery.browser 속성은 버전 1.9 이후 jQuery에서 지원되지 않습니다(자세한 내용은 jQuery 1.9 릴리즈 노트를 참조하십시오).jQuery 개발팀은 UI를 Modernizr 라이브러리로 수정하는 것과 같은 보다 완벽한 접근 방식을 사용할 것을 권장합니다.
New Edge Chromium용 Fz2 & kennebec 업데이트입니다.
function get_browser() {
var ua=navigator.userAgent,tem,M=ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
if(/trident/i.test(M[1])){
tem=/\brv[ :]+(\d+)/g.exec(ua) || [];
return {name:'IE',version:(tem[1]||'')};
}
if(M[1]==='Chrome'){
tem=ua.match(/\bEdg\/(\d+)/)
if(tem!=null) {return {name:'Edge(Chromium)', version:tem[1]};}
tem=ua.match(/\bOPR\/(\d+)/)
if(tem!=null) {return {name:'Opera', version:tem[1]};}
}
M=M[2]? [M[1], M[2]]: [navigator.appName, navigator.appVersion, '-?'];
if((tem=ua.match(/version\/(\d+)/i))!=null) {M.splice(1,1,tem[1]);}
return {
name: M[0],
version: M[1]
};
}
var browser=get_browser(); // browser.name = 'Edge(Chromium)'
// browser.version = '86'
console.log(browser);
navigator.userAgent-Firefox/xxx.xxx.xxx.
<script type="text/javascript">
var version = navigator.appVersion;
alert(version);
</script>
헤르만 잉잘드슨의 답변을 바탕으로 버전 검출기를 작성했지만 더 강력해져서 이름/버전 데이터가 포함된 개체를 반환합니다.주요 브라우저를 커버하고 있지만 모바일 브라우저와 마이너 브라우저는 별로 신경 쓰지 않습니다.
function getBrowserData(nav) {
var data = {};
var ua = data.uaString = nav.userAgent;
var browserMatch = ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*([\d\.]+)/i) || [];
if (browserMatch[1]) { browserMatch[1] = browserMatch[1].toLowerCase(); }
var operaMatch = browserMatch[1] === 'chrome';
if (operaMatch) { operaMatch = ua.match(/\bOPR\/([\d\.]+)/); }
if (/trident/i.test(browserMatch[1])) {
var msieMatch = /\brv[ :]+([\d\.]+)/g.exec(ua) || [];
data.name = 'msie';
data.version = msieMatch[1];
}
else if (operaMatch) {
data.name = 'opera';
data.version = operaMatch[1];
}
else if (browserMatch[1] === 'safari') {
var safariVersionMatch = ua.match(/version\/([\d\.]+)/i);
data.name = 'safari';
data.version = safariVersionMatch[1];
}
else {
data.name = browserMatch[1];
data.version = browserMatch[2];
}
var versionParts = [];
if (data.version) {
var versionPartsMatch = data.version.match(/(\d+)/g) || [];
for (var i=0; i < versionPartsMatch.length; i++) {
versionParts.push(versionPartsMatch[i]);
}
if (versionParts.length > 0) { data.majorVersion = versionParts[0]; }
}
data.name = data.name || '(unknown browser name)';
data.version = {
full: data.version || '(unknown full browser version)',
parts: versionParts,
major: versionParts.length > 0 ? versionParts[0] : '(unknown major browser version)'
};
return data;
};
그런 다음 다음과 같이 사용할 수 있습니다.
var brData = getBrowserData(window.navigator || navigator);
console.log('name: ' + brData.name);
console.log('major version: ' + brData.version.major);
// etc.
이를 위해 navigator.appVersion 또는 navigator.userAgent Try 값을 확인해야 합니다.
console.log(navigator.appVersion)
var nVer = navigator.appVersion;
var nAgt = navigator.userAgent;
var browserName = navigator.appName;
var fullVersion = ''+parseFloat(navigator.appVersion);
var majorVersion = parseInt(navigator.appVersion,10);
var nameOffset,verOffset,ix;
// In Opera, the true version is after "Opera" or after "Version"
if ((verOffset=nAgt.indexOf("Opera"))!=-1) {
browserName = "Opera";
fullVersion = nAgt.substring(verOffset+6);
if ((verOffset=nAgt.indexOf("Version"))!=-1)
fullVersion = nAgt.substring(verOffset+8);
}
// In MSIE, the true version is after "MSIE" in userAgent
else if ((verOffset=nAgt.indexOf("MSIE"))!=-1) {
browserName = "Microsoft Internet Explorer";
fullVersion = nAgt.substring(verOffset+5);
}
// In Chrome, the true version is after "Chrome"
else if ((verOffset=nAgt.indexOf("Chrome"))!=-1) {
browserName = "Chrome";
fullVersion = nAgt.substring(verOffset+7);
}
// In Safari, the true version is after "Safari" or after "Version"
else if ((verOffset=nAgt.indexOf("Safari"))!=-1) {
browserName = "Safari";
fullVersion = nAgt.substring(verOffset+7);
if ((verOffset=nAgt.indexOf("Version"))!=-1)
fullVersion = nAgt.substring(verOffset+8);
}
// In Firefox, the true version is after "Firefox"
else if ((verOffset=nAgt.indexOf("Firefox"))!=-1) {
browserName = "Firefox";
fullVersion = nAgt.substring(verOffset+8);
}
// In most other browsers, "name/version" is at the end of userAgent
else if ( (nameOffset=nAgt.lastIndexOf(' ')+1) <
(verOffset=nAgt.lastIndexOf('/')) )
{
browserName = nAgt.substring(nameOffset,verOffset);
fullVersion = nAgt.substring(verOffset+1);
if (browserName.toLowerCase()==browserName.toUpperCase()) {
browserName = navigator.appName;
}
}
// trim the fullVersion string at semicolon/space if present
if ((ix=fullVersion.indexOf(";"))!=-1)
fullVersion=fullVersion.substring(0,ix);
if ((ix=fullVersion.indexOf(" "))!=-1)
fullVersion=fullVersion.substring(0,ix);
majorVersion = parseInt(''+fullVersion,10);
if (isNaN(majorVersion)) {
fullVersion = ''+parseFloat(navigator.appVersion);
majorVersion = parseInt(navigator.appVersion,10);
}
document.write(''
+'Browser name = '+browserName+'<br>'
+'Full version = '+fullVersion+'<br>'
+'Major version = '+majorVersion+'<br>'
+'navigator.appName = '+navigator.appName+'<br>'
+'navigator.userAgent = '+navigator.userAgent+'<br>'
)
데모를 보려면 여기를 클릭하십시오.http://jsfiddle.net/hw4jM/3/
브라우저 및 브라우저 버전 검출
이 코드 스니펫은 MDN의 기사에 근거하고 있습니다.MDN에서는 브라우저 이름을 검출하는 데 사용할 수 있는 다양한 키워드에 대해 간단한 힌트를 제공하고 있습니다.
Edge나 UCBrowser 등의 브라우저를 검출하기 위해 몇 가지 변경을 가했습니다.
getBrowser = () => {
const userAgent = navigator.userAgent;
let browser = "unkown";
// Detect browser name
browser = (/ucbrowser/i).test(userAgent) ? 'UCBrowser' : browser;
browser = (/edg/i).test(userAgent) ? 'Edge' : browser;
browser = (/googlebot/i).test(userAgent) ? 'GoogleBot' : browser;
browser = (/chromium/i).test(userAgent) ? 'Chromium' : browser;
browser = (/firefox|fxios/i).test(userAgent) && !(/seamonkey/i).test(userAgent) ? 'Firefox' : browser;
browser = (/; msie|trident/i).test(userAgent) && !(/ucbrowser/i).test(userAgent) ? 'IE' : browser;
browser = (/chrome|crios/i).test(userAgent) && !(/opr|opera|chromium|edg|ucbrowser|googlebot/i).test(userAgent) ? 'Chrome' : browser;;
browser = (/safari/i).test(userAgent) && !(/chromium|edg|ucbrowser|chrome|crios|opr|opera|fxios|firefox/i).test(userAgent) ? 'Safari' : browser;
browser = (/opr|opera/i).test(userAgent) ? 'Opera' : browser;
// detect browser version
switch (browser) {
case 'UCBrowser': return `${browser}/${browserVersion(userAgent,/(ucbrowser)\/([\d\.]+)/i)}`;
case 'Edge': return `${browser}/${browserVersion(userAgent,/(edge|edga|edgios|edg)\/([\d\.]+)/i)}`;
case 'GoogleBot': return `${browser}/${browserVersion(userAgent,/(googlebot)\/([\d\.]+)/i)}`;
case 'Chromium': return `${browser}/${browserVersion(userAgent,/(chromium)\/([\d\.]+)/i)}`;
case 'Firefox': return `${browser}/${browserVersion(userAgent,/(firefox|fxios)\/([\d\.]+)/i)}`;
case 'Chrome': return `${browser}/${browserVersion(userAgent,/(chrome|crios)\/([\d\.]+)/i)}`;
case 'Safari': return `${browser}/${browserVersion(userAgent,/(safari)\/([\d\.]+)/i)}`;
case 'Opera': return `${browser}/${browserVersion(userAgent,/(opera|opr)\/([\d\.]+)/i)}`;
case 'IE': const version = browserVersion(userAgent,/(trident)\/([\d\.]+)/i);
// IE version is mapped using trident version
// IE/8.0 = Trident/4.0, IE/9.0 = Trident/5.0
return version ? `${browser}/${parseFloat(version) + 4.0}` : `${browser}/7.0`;
default: return `unknown/0.0.0.0`;
}
}
browserVersion = (userAgent,regex) => {
return userAgent.match(regex) ? userAgent.match(regex)[2] : null;
}
console.log(getBrowser());
브라우저, 브라우저 버전, OS 버전, OS 버전을 검출하기 위한 스크립트를 ASP 코드로 작성했습니다.ASP에서 이 작업을 하게 된 이유는 로그 데이터베이스에 데이터를 저장하고 싶기 때문입니다.그래서 나는 브라우저 서버를 탐지해야 했다.
코드는 다음과 같습니다.
on error resume next
ua = lcase(Request.ServerVariables("HTTP_USER_AGENT"))
moz = instr(ua,"mozilla")
ffx = instr(ua,"firefox")
saf = instr(ua,"safari")
crm = instr(ua,"chrome")
max = instr(ua,"maxthon")
opr = instr(ua,"opera")
ie4 = instr(ua,"msie 4")
ie5 = instr(ua,"msie 5")
ie6 = instr(ua,"msie 6")
ie7 = instr(ua,"msie 7")
ie8 = instr(ua,"trident/4.0")
ie9 = instr(ua,"trident/5.0")
if moz>0 then
BrowserType = "Mozilla"
BrVer = mid(ua,moz+8,(instr(moz,ua," ")-(moz+8)))
end if
if ffx>0 then
BrowserType = "FireFox"
BrVer = mid(ua,ffx+8)
end if
if saf>0 then
BrowserType = "Safari"
BrVerPlass = instr(ua,"version")
BrVer = mid(ua,BrVerPlass+8,(instr(BrVerPlass,ua," ")-(BrVerPlass+8)))
end if
if crm>0 then
BrowserType = "Chrome"
BrVer = mid(ua,crm+7,(instr(crm,ua," ")-(crm+7)))
end if
if max>0 then
BrowserType = "Maxthon"
BrVer = mid(ua,max+8,(instr(max,ua," ")-(max+8)))
end if
if opr>0 then
BrowserType = "Opera"
BrVerPlass = instr(ua,"presto")
BrVer = mid(ua,BrVerPlass+7,(instr(BrVerPlass,ua," ")-(BrVerPlass+7)))
end if
if ie4>0 then
BrowserType = "Internet Explorer"
BrVer = "4"
end if
if ie5>0 then
BrowserType = "Internet Explorer"
BrVer = "5"
end if
if ie6>0 then
BrowserType = "Internet Explorer"
BrVer = "6"
end if
if ie7>0 then
BrowserType = "Internet Explorer"
BrVer = "7"
end if
if ie8>0 then
BrowserType = "Internet Explorer"
BrVer = "8"
if ie7>0 then BrVer = BrVer & " (in IE7 compability mode)"
end if
if ie9>0 then
BrowserType = "Internet Explorer"
BrVer = "9"
if ie7>0 then BrVer = BrVer & " (in IE7 compability mode)"
if ie8>0 then BrVer = BrVer & " (in IE8 compability mode)"
end if
OSSel = mid(ua,instr(ua,"(")+1,(instr(ua,";")-instr(ua,"("))-1)
OSver = mid(ua,instr(ua,";")+1,(instr(ua,")")-instr(ua,";"))-1)
if BrowserType = "Internet Explorer" then
OSStart = instr(ua,";")
OSStart = instr(OSStart+1,ua,";")
OSStopp = instr(OSStart+1,ua,";")
OSsel = mid(ua,OSStart+2,(OSStopp-OSStart)-2)
end if
Select case OSsel
case "windows nt 6.1"
OS = "Windows"
OSver = "7"
case "windows nt 6.0"
OS = "Windows"
OSver = "Vista"
case "windows nt 5.2"
OS = "Windows"
OSver = "Srv 2003 / XP x64"
case "windows nt 5.1"
OS = "Windows"
OSver = "XP"
case else
OS = OSSel
End select
Response.write "<br>" & ua & "<br>" & BrowserType & "<br>" & BrVer & "<br>" & OS & "<br>" & OSver & "<br>"
'Use the variables here for whatever you need........
이 페이지에는 appString 및 appVersion 속성을 마지막 수단으로만 사용하는 꽤 괜찮은 스니펫이 있는 것 같습니다.이것은 특정 브라우저에서는 신뢰할 수 없다고 주장하기 때문입니다.페이지의 코드는 다음과 같습니다.
var nVer = navigator.appVersion;
var nAgt = navigator.userAgent;
var browserName = navigator.appName;
var fullVersion = ''+parseFloat(navigator.appVersion);
var majorVersion = parseInt(navigator.appVersion,10);
var nameOffset,verOffset,ix;
// In Opera 15+, the true version is after "OPR/"
if ((verOffset=nAgt.indexOf("OPR/"))!=-1) {
browserName = "Opera";
fullVersion = nAgt.substring(verOffset+4);
}
// In older Opera, the true version is after "Opera" or after "Version"
else if ((verOffset=nAgt.indexOf("Opera"))!=-1) {
browserName = "Opera";
fullVersion = nAgt.substring(verOffset+6);
if ((verOffset=nAgt.indexOf("Version"))!=-1)
fullVersion = nAgt.substring(verOffset+8);
}
// In MSIE, the true version is after "MSIE" in userAgent
else if ((verOffset=nAgt.indexOf("MSIE"))!=-1) {
browserName = "Microsoft Internet Explorer";
fullVersion = nAgt.substring(verOffset+5);
}
// In Chrome, the true version is after "Chrome"
else if ((verOffset=nAgt.indexOf("Chrome"))!=-1) {
browserName = "Chrome";
fullVersion = nAgt.substring(verOffset+7);
}
// In Safari, the true version is after "Safari" or after "Version"
else if ((verOffset=nAgt.indexOf("Safari"))!=-1) {
browserName = "Safari";
fullVersion = nAgt.substring(verOffset+7);
if ((verOffset=nAgt.indexOf("Version"))!=-1)
fullVersion = nAgt.substring(verOffset+8);
}
// In Firefox, the true version is after "Firefox"
else if ((verOffset=nAgt.indexOf("Firefox"))!=-1) {
browserName = "Firefox";
fullVersion = nAgt.substring(verOffset+8);
}
// In most other browsers, "name/version" is at the end of userAgent
else if ( (nameOffset=nAgt.lastIndexOf(' ')+1) <
(verOffset=nAgt.lastIndexOf('/')) )
{
browserName = nAgt.substring(nameOffset,verOffset);
fullVersion = nAgt.substring(verOffset+1);
if (browserName.toLowerCase()==browserName.toUpperCase()) {
browserName = navigator.appName;
}
}
// trim the fullVersion string at semicolon/space if present
if ((ix=fullVersion.indexOf(";"))!=-1)
fullVersion=fullVersion.substring(0,ix);
if ((ix=fullVersion.indexOf(" "))!=-1)
fullVersion=fullVersion.substring(0,ix);
majorVersion = parseInt(''+fullVersion,10);
if (isNaN(majorVersion)) {
fullVersion = ''+parseFloat(navigator.appVersion);
majorVersion = parseInt(navigator.appVersion,10);
}
document.write(''
+'Browser name = '+browserName+'<br>'
+'Full version = '+fullVersion+'<br>'
+'Major version = '+majorVersion+'<br>'
+'navigator.appName = '+navigator.appName+'<br>'
+'navigator.userAgent = '+navigator.userAgent+'<br>'
)
헤르만의 대답에 대한 저만의 구현도 추가했습니다.OS검출이 필요했기 때문에 추가했습니다.ES5-ify에 필요한 ES6 코드도 포함되어 있습니다(트랜스필러가 있기 때문에).
detectClient() {
let nav = navigator.appVersion,
os = 'unknown',
client = (() => {
let agent = navigator.userAgent,
engine = agent.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [],
build;
if(/trident/i.test(engine[1])){
build = /\brv[ :]+(\d+)/g.exec(agent) || [];
return {browser:'IE', version:(build[1] || '')};
}
if(engine[1] === 'Chrome'){
build = agent.match(/\bOPR\/(\d+)/);
if(build !== null) {
return {browser: 'Opera', version: build[1]};
}
}
engine = engine[2] ? [engine[1], engine[2]] : [navigator.appName, nav, '-?'];
if((build = agent.match(/version\/(\d+)/i)) !== null) {
engine.splice(1, 1, build[1]);
}
return {
browser: engine[0],
version: engine[1]
};
})();
switch (true) {
case nav.indexOf('Win') > -1:
os = 'Windows';
break;
case nav.indexOf('Mac') > -1:
os = 'MacOS';
break;
case nav.indexOf('X11') > -1:
os = 'UNIX';
break;
case nav.indexOf('Linux') > -1:
os = 'Linux';
break;
}
client.os = os;
return client;
}
반품:Object {browser: "Chrome", version: "50", os: "UNIX"}
해결해야 할 문제를 위해 작성한 이 코드를 공유하고 싶습니다.그것은 대부분의 주요 브라우저에서 테스트되었고, 저에게는 매력적으로 작용합니다!
이 코드는 다른 답변과 매우 비슷해 보이지만 최근 놓친 jquery의 브라우저 오브젝트를 사용할 수 있도록 수정되었습니다.물론 위의 코드 조합이지만, 제 파트에서는 거의 개선되지 않았습니다.
(function($, ua){
var M = ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [],
tem,
res;
if(/trident/i.test(M[1])){
tem = /\brv[ :]+(\d+)/g.exec(ua) || [];
res = 'IE ' + (tem[1] || '');
}
else if(M[1] === 'Chrome'){
tem = ua.match(/\b(OPR|Edge)\/(\d+)/);
if(tem != null)
res = tem.slice(1).join(' ').replace('OPR', 'Opera');
else
res = [M[1], M[2]];
}
else {
M = M[2]? [M[1], M[2]] : [navigator.appName, navigator.appVersion, '-?'];
if((tem = ua.match(/version\/(\d+)/i)) != null) M = M.splice(1, 1, tem[1]);
res = M;
}
res = typeof res === 'string'? res.split(' ') : res;
$.browser = {
name: res[0],
version: res[1],
msie: /msie|ie/i.test(res[0]),
firefox: /firefox/i.test(res[0]),
opera: /opera/i.test(res[0]),
chrome: /chrome/i.test(res[0]),
edge: /edge/i.test(res[0])
}
})(typeof jQuery != 'undefined'? jQuery : window.$, navigator.userAgent);
console.log($.browser.name, $.browser.version, $.browser.msie);
// if IE 11 output is: IE 11 true
navigator.sayswho= (function(){
var ua= navigator.userAgent, tem,
M= ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
if(/trident/i.test(M[1])){
tem= /\brv[ :]+(\d+)/g.exec(ua) || [];
return 'IE '+(tem[1] || '');
}
if(M[1]=== 'Chrome'){
tem= ua.match(/\b(OPR|Edge)\/(\d+)/);
if(tem!= null) return tem.slice(1).join(' ').replace('OPR', 'Opera');
}
M= M[2]? [M[1], M[2]]: [navigator.appName, navigator.appVersion, '-?'];
if((tem= ua.match(/version\/(\d+)/i))!= null) M.splice(1, 1, tem[1]);
return M.join(' ');
})();
console.log(navigator.sayswho); // outputs: `Chrome 62`
이를 사용하여 실제 브라우저 버전의 de Name과 번호(int)를 가져옵니다.
function getInfoBrowser() {
var ua = navigator.userAgent, tem,
M = ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
if (/trident/i.test(M[1])) {
tem = /\brv[ :]+(\d+)/g.exec(ua) || [];
return { name: 'Explorer', version: parseInt((tem[1] || '')) };
}
if (M[1] === 'Chrome') {
tem = ua.match(/\b(OPR|Edge)\/(\d+)/);
if (tem != null) { let app = tem.slice(1).toString().split(','); return { name: app[0].replace('OPR', 'Opera'), version: parseInt(app[1]) }; }
}
M = M[2] ? [M[1], M[2]] : [navigator.appName, navigator.appVersion, '-?'];
if ((tem = ua.match(/version\/(\d+)/i)) != null) M.splice(1, 1, tem[1]);
return {
name: M[0],
version: parseInt(M[1])
};
}
function getBrowser(){
let info = getInfoBrowser();
$("#i-name").html(info.name);
$("#i-version").html(info.version);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" onclick="getBrowser();" value="Get Info Browser"/>
<hr/>
Name: <span id="i-name"></span><br/>
Version: <span id="i-version"></span>
이 실행은
Chrome ; Firefox ; Safari ; Internet Explorer ( > = 9 ) ; Opera ; Edge
나를 위해.
angular를 사용하는 PWA 어플리케이션의 경우 index.html의 body 섹션에 브라우저가 지원되는지 여부를 체크하기 위해 코드를 넣을 수 있습니다.
<body>
<div id="browser"></div>
<script>
var operabrowser = true;
operabrowser = (navigator.userAgent.indexOf('Opera Mini') > -1);
if (operabrowser) {
txt = "<p>Browser not supported use different browser...</p>";
document.getElementById("browser").innerHTML = txt;
}
</script>
</body>
여기서는 @kennebec 스니펫보다 호환성이 우수합니다.
는 브라우저 이름과 버전을 반환합니다(72.0.3626.96이 아닌 72).
Safari, Chrome, Opera, Firefox, IE, Edge, UCBrowser, 모바일에서도 테스트 완료.
function browser() {
var userAgent = navigator.userAgent,
match = userAgent.match(/(opera|chrome|crios|safari|ucbrowser|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [],
result = {},
tem;
if (/trident/i.test(match[1])) {
tem = /\brv[ :]+(\d+)/g.exec(userAgent) || [];
result.name = "Internet Explorer";
} else if (match[1] === "Chrome") {
tem = userAgent.match(/\b(OPR|Edge)\/(\d+)/);
if (tem && tem[1]) {
result.name = tem[0].indexOf("Edge") === 0 ? "Edge" : "Opera";
}
}
if (!result.name) {
tem = userAgent.match(/version\/(\d+)/i); // iOS support
result.name = match[0].replace(/\/.*/, "");
if (result.name.indexOf("MSIE") === 0) {
result.name = "Internet Explorer";
}
if (userAgent.match("CriOS")) {
result.name = "Chrome";
}
}
if (tem && tem.length) {
match[match.length - 1] = tem[tem.length - 1];
}
result.version = Number(match[match.length - 1]);
return result;
}
var ua = navigator.userAgent;
if (/Firefox\//.test(ua))
var Firefox = /Firefox\/([0-9\.A-z]+)/.exec(ua)[1];
나는 내 필요에 따라 이 글을 썼다.
가 모바일 기기인지, 레티나 디스플레이가 있는지 등의 정보를 얻을 수 있습니다.
var nav = {
isMobile:function(){
return (navigator.userAgent.match(/iPhone|iPad|iPod|Android|BlackBerry|Opera Mini|IEMobile/i) != null);
},
isDesktop:function(){
return (navigator.userAgent.match(/iPhone|iPad|iPod|Android|BlackBerry|Opera Mini|IEMobile/i) == null);
},
isAndroid: function() {
return navigator.userAgent.match(/Android/i);
},
isBlackBerry: function() {
return navigator.userAgent.match(/BlackBerry/i);
},
isIOS: function() {
return navigator.userAgent.match(/iPhone|iPad|iPod/i);
},
isOpera: function() {
return navigator.userAgent.match(/Opera Mini/i);
},
isWindows: function() {
return navigator.userAgent.match(/IEMobile/i);
},
isRetina:function(){
return window.devicePixelRatio && window.devicePixelRatio > 1;
},
isIPad:function(){
isIPad = (/ipad/gi).test(navigator.platform);
return isIPad;
},
isLandscape:function(){
if(window.innerHeight < window.innerWidth){
return true;
}
return false;
},
getIOSVersion:function(){
if(this.isIOS()){
var OSVersion = navigator.appVersion.match(/OS (\d+_\d+)/i);
OSVersion = OSVersion[1] ? +OSVersion[1].replace('_', '.') : 0;
return OSVersion;
}
else
return false;
},
isStandAlone:function(){
if(_.is(navigator.standalone))
return navigator.standalone;
return false;
},
isChrome:function(){
var isChrome = (/Chrome/gi).test(navigator.appVersion);
var isSafari = (/Safari/gi).test(navigator.appVersion)
return isChrome && isSafari;
},
isSafari:function(){
var isSafari = (/Safari/gi).test(navigator.appVersion)
var isChrome = (/Chrome/gi).test(navigator.appVersion)
return !isChrome && isSafari;
}
}
저는 다른 게시물에서 찾을 수 있는 내용을 바탕으로 자바스크립트 코드를 사용하고 있습니다.
var browserHelper = function () {
var self = {};
/// IE 6+
self.isIEBrowser = function () {
return /*@cc_on!@*/false || !!document.documentMode;
};
/// Opera 8.0+
self.isOperaBrowser = function () {
return (!!window.opr && !!opr.addons)
|| !!window.opera
|| navigator.userAgent.indexOf(' OPR/') >= 0;
};
/// Firefox 1.0+
self.isFirefoxBrowser = function () {
return typeof InstallTrigger !== 'undefined';
};
/// Safari 3.0+
self.isSafariBrowser = function () {
return /constructor/i.test(window.HTMLElement)
|| (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || (typeof safari !== 'undefined' && window['safari'].pushNotification));
};
/// Edge 20+
self.isEdgeBrowser = function () {
return !self.isIEBrowser() && !!window.StyleMedia;
};
/// Chrome 1 - 87
self.isChromeBrowser = function () {
return (!!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime))
|| (navigator.userAgent.indexOf("Chrome") > -1) && !self.isOperaBrowser();
};
/// Edge (based on chromium)
self.isEdgeChromiumBrowser = function () {
return self.isChromeBrowser() && (navigator.userAgent.indexOf("Edg") != -1);
};
/// Blink
self.isBlinkBasedOnBrowser = function () {
return (self.isChromeBrowser() || self.isOperaBrowser()) && !!window.CSS;
};
/// Returns the name of the navigator
self.browserName = function () {
if (self.isOperaBrowser()) return "Opera";
if (self.isEdgeBrowser()) return "Edge";
if (self.isEdgeChromiumBrowser()) return "Edge (based on chromium)";
if (self.isFirefoxBrowser()) return "Firefox";
if (self.isIEBrowser()) return "Internet Explorer";
if (self.isSafariBrowser()) return "Safari";
if (self.isChromeBrowser()) return "Chrome";
return "Unknown";
};
return self;
};
var bName = document.getElementById('browserName');
bName.innerText = browserHelper().browserName();
#browserName {
font-family: Arial, Verdana;
font-size: 1.2rem;
color: #ff8000;
text-align: center;
border: 2px solid #ff8000;
border-radius: .5rem;
padding: .5rem;
max-width: 25%;
margin: auto;
}
<div id="browserName"></div>
크롬 브라우저는 매우 간단합니다.
버전:navigator.userAgentData.brands[0].version
브라우저 이름:navigator.userAgentData.brands[0].brand
파이어폭스 버전을 입수했습니다.
let versionNumber = parseInt(window.navigator.userAgent.match(/Firefox\/([0-
9]+)\./)[1]);
언급URL : https://stackoverflow.com/questions/5916900/how-can-you-detect-the-version-of-a-browser
'programing' 카테고리의 다른 글
| MySQL의 여러 테이블에서 카운트(*) (0) | 2022.12.30 |
|---|---|
| JavaScript에서 yield 키워드는 무엇입니까? (0) | 2022.12.30 |
| Vuex 변환이 실행 중이지만 vue dev 도구에서 수동으로 커밋될 때까지 구성 요소가 업데이트되지 않음 (0) | 2022.12.30 |
| JavaScript 또는 jQuery를 사용하여 어레이 내에 있는 개체의 값을 변경하려면 어떻게 해야 합니까? (0) | 2022.12.30 |
| 키워드 vs ON 절 사용 - MYSQL (0) | 2022.12.30 |
