Develop Reference

Alert when page opened not in Chrome

I'm trying to get an alert to pop up when the user opens my webpage in a browser other than Chrome. I have this:
if (/what to put here to make the below show only if the browser is not Google Chrome?/) {
alert( "Please use Google Chrome to access this site.\nSome key features do not work in browsers other than Chrome." );
}
Found this here as a possible condition: navigator.userAgent.search("Chrome"), but can't make it work. Please advise. :-)

As the comments above point out by referencing questions you can test for chrome in the userAgent. But you would want to reverse that:
let notChrome = !/Chrome/.test(navigator.userAgent)
let alertMessage = "Please use Google Chrome to access this site.\nSome key features do not work in browsers other than Chrome."
if(notChrome) alert(alertMessage)
This will solve the problem unless the user is spoofing their userAgent. This is unusual though. To fully check you should also check for a feature chrome has AND the userAgent:
let notChrome = !/Chrome/.test(navigator.userAgent) && !("webkitAppearance" in document.body.style)
let alertMessage = "Please use Google Chrome to access this site.\nSome key features do not work in browsers other than Chrome."
if(notChrome) alert(alertMessage)

This should to it.
var isChrome = !!window.chrome; // "!!" converts the object to a boolean value
console.log(isChrome); // Just to visualize what's happening
/** Example: User uses Firefox, therefore isChrome is false; alert get's triggered */
if (isChrome !== true) {
alert("Please use Google Chrome to access this site.\nSome key features do not work in browsers other than Chrome.");
}

Detect if the user is navigating through the safari mobile browser on iphone

I am trying to detect if the user is navigating my website from safari browser on the iphone using jquery / javascript.
I am able to detect the IOS Environment using the user agent string
/iphone/i.test(navigator.userAgent.toLowerCase())
But this detects the Apple Webkit Environment i.e. it is same for all the browsers on the device. Can anyone suggest any different approach.

UPDATED:
Try this, for detecting Safari browser in an iPhone:
var isSafari = !!navigator.userAgent.match(/Version\/[\d\.]+.*Safari/);
It identifies Safari 3.0+ and distinguishes it from Chrome.
JsFiddle

Since the other answer doesn't include detection of an iPhone, including that part.
var isIphone = /(iPhone)/i.test(navigator.userAgent);
var isSafari = !!navigator.userAgent.match(/Version\/[\d\.]+.*Safari/);
if(isIphone && isSafari){
//do something
}
If you want to detect a particular iOS version and above, say iOS 7.0 and above then you can use the below code. It detects iOS version 7-19(for upcoming versions).
var isIphone= /(iPhone)*(OS ([7-9]|1[0-9])_)/i.test(navigator.userAgent);

var isFirefox = navigator.userAgent.indexOf("FxiOS") != -1;
var isChrome = navigator.userAgent.indexOf("CriOS") != -1;
var isEdge = navigator.userAgent.indexOf("EdgiOS") != -1;
var isOpera = navigator.userAgent.indexOf("OPT") != -1;
if (!isFirefox && !isChrome && !isEdge && !isOpera){
console.log("Only display in Safari")
} else {
console.log("Only display in Firefox/Chrome/Edge/Opera")
}
Hi, this way worked for me to detect only safari in ios mobile. The value FxiOs, CriOs, etc, I get from the userAgent value.

Detect if any kind of IE (MSIE) [duplicate]

This question already has answers here:
Internet Explorer 11 detection
(12 answers)
Closed 8 years ago.
I dont want to allow users to access my site with Microsoft Internetexplorer (ANY VERSION).
What I´ve found so far was to detect if it´s lower or equal version 10.
A very annoing thing: Internetexplorer >v10 doesn´t admit to be a InternetExplorer.
What i´ve found and tried so far:
if(navigator.appVersion.indexOf("MSIE")!=-1){
alert("You use IE. That´s no good.");
}
or
if ( $.browser.msie ) {
alert( $.browser.version );
}
and
http://msdn.microsoft.com/en-us/library/ie/ms537509%28v=vs.85%29.aspx
I would use any solution if it is in javascript, jquery or php if there is one.

This works for me to detect any Version of the IE 5-11 (Internet Explorer) (Aug/05/2014):
if (navigator.appName == 'Microsoft Internet Explorer' || !!(navigator.userAgent.match(/Trident/) || navigator.userAgent.match(/rv:11/)) || (typeof $.browser !== "undefined" && $.browser.msie == 1))
{
alert("Please dont use IE.");
}

This is because each release of Internet Explorer updates the user-agent string.
MSIE tokens have been removed in Internet Explorer 11 and $.browser uses navigator.userAgent to determine the platform and it is removed in jQuery 1.9.
You can use following code to determine the browser with pure java-script.
var isIE = !!navigator.userAgent.match(/Trident/g) || !!navigator.userAgent.match(/MSIE/g);
if(isIE){
alert("IE");
}
else{
alert("Not IE");
}
Thanks!

if you are not interessted wich version of ie the user currently use you can try get it work with detecting if the browser supports the Conditional Compilation Statements
http://msdn.microsoft.com/en-us/library/7kx09ct1%28v=vs.80%29.aspx
if(/*#cc_on!#*/false)
{
// You use IE. That´s no good.
alert("oh my god");
}

You can use conditional compilation
, e.g.
<script>
var isIE = false;
/*#cc_on isIE = true; #*/
</script>
But note that IE11 doesn't observe this in Standards Mode. User Agent sniffing is generally a bad idea, but as IE becomes more standards-compliant, it also becomes harder to detect (hopefully also meaning less need to)

For IE> 10 which is currently IE 11, user-agent carries something in Browser's HTTP request headers
Mozilla/5.0 (Windows NT 6.3; WOW64; Trident/7.0; rv:11.0) like Gecko
You can put a check on "rv:11.0" for version 11. Let me know if you need code for this.

I've found (maybe in SO) in the past this script and it worked for me (IE 10 too)
<![if IE]>
<script type='text/javascript'>
if(/*#cc_on!#*/false)
var bIsIE = 1;
</script>
<![endif]>
and then
if (typeof (bIsIE) != 'undefined')
{
//IE :(
}
else
{
//NOT IE :)
}

How can I check webRTC datachannel compatibility using JavaScript in client side?

WebRTC datachannel works only in Firefox nightly. How can I check it in client side?
Code is shown as follows;
if (/Firefox[\/\s](\d+\.\d+)/.test(navigator.userAgent)){ //test for Firefox/x.x or Firefox x.x (ignoring remaining digits);
var ffversion=new Number(RegExp.$1) // capture x.x portion and store as a number
if (ffversion>=5)
document.write("You're using FF 5.x or above")
else if (ffversion>=4)
document.write("You're using FF 4.x or above")
else if (ffversion>=3)
document.write("You're using FF 3.x or above")
else if (ffversion>=2)
document.write("You're using FF 2.x")
else if (ffversion>=1)
document.write("You're using FF 1.x")
}
else
document.write("n/a")

You can simply test if the browser currently supports the features you're going to use. For example:
if (!window.mozRTCPeerConnection)
// error, browser doesn't support it
If you're interested, here an interesting article: Hello Chrome, it’s Firefox calling!
You basically can implement the same feature in Chrome just using webkit prefix instead of moz.

There's a Chrome RTCDataChannel demo now at simpl.info/dc.
This isn't very robust or complete, but you could create a webkitRTCPeerConnection object and then check if it has a createDataChannel member:
try { // or if (webkitRTCPeerConnection) {...}
var pc = new webkitRTCPeerConnection(null);
if (pc && pc.createDataChannel) {
var dc = pc.createDataChannel("sendDataChannel", {reliable: false});
if (!!dc) {
// doSomething()
}
}
} catch (e) {
// try some other instantiation
}

Check the webrtcsupport package. It seems to be cross-browser (Chrome & FF).
https://www.npmjs.org/package/webrtcsupport
If you don't wanna use the NPM package, the main logic can be found here.
https://github.com/HenrikJoreteg/webrtcsupport/blob/master/index-browser.js

Using JavaScript
var prefix;
var version;
if (window.mozRTCPeerConnection || navigator.mozGetUserMedia) {
prefix = 'moz';
version = parseInt(navigator.userAgent.match(/Firefox\/([0-9]+)\./)[1], 10);
} else if (window.webkitRTCPeerConnection || navigator.webkitGetUserMedia) {
prefix = 'webkit';
version = navigator.userAgent.match(/Chrom(e|ium)/) && parseInt(navigator.userAgent.match(/Chrom(e|ium)\/([0-9]+)\./)[2], 10);
}
if(prefix == 'moz' || prefix == 'webkit' && version > 41){
console.log("Browser Support WebRTC")
} else {
console.log("This Browser Not Support WebRTC")
}

The top answer is not right.
if (window.RTCDataChannel) {
// the browser support dataChannel
} else {
// the browser does not support dataChannel
}
If browser support RTCPeerConnection, it not means also support for RTCDataChannel。Such as Edge, createDataChannel on instance of RTCPeerConnection will throw an exception.

Surprised no one mentions checking the prototype.
You can check if createDataChannel exists by doing this:
if (!window.RTCPeerConnection.prototype.createDataChannel) {
// Data Channels not supported
}

I just figured out. Thanks for all your help.
http://mozilla.github.com/webrtc-landing/

Another package that checks for WebRTC support is DetectRTC https://github.com/muaz-khan/DetectRTC

What is the correct way to detect Opera using jQuery?

Amazon.com recently updated their javascript, and it's causing problems with some Opera browsers.
Their browser detection code looks like so, but it's faulty:
function sitbReaderIsCompatibleBrowser() {
if (typeof(jQuery) == 'undefined') {
return false;
} else {
var version = jQuery.browser.version || "0";
var splitVersion = version.split('.');
return (
(jQuery.browser.msie && splitVersion[0] >= 6) // IE 6 and higher
|| (jQuery.browser.mozilla && (
(splitVersion[0] == 1 && splitVersion[1] >= 8) // Firefox 2 and higher
|| (splitVersion[0] >= 2)
))
|| (jQuery.browser.safari && splitVersion[0] >= 500) // Safari 5 and higher
|| (jQuery.browser.opera && splitVersion[0] >= 9) // Opera 5 and higher
);
}
}
Nothing obviously wrong jumps out at me with this code, but I've never used jQuery before so I don't know.
Even though this code looks like it's attempting to let Opera users through, when I visit the page with Opera 9.64 I get an "unsupported browser" message. If I change Opera's settings to report itself as Firefox, the page works perfectly! With that in mind, I'm pretty sure it's a problem with the script and not the browser.
Any jQuery experts have a suggestion?
You can replicate the behavior by visiting any book on Amazon and clicking the "look inside this book" link.

Prior to jQuery 1.3, you could use jQuery.browser:
if( $.browser.opera ){
alert( "You're using Opera version "+$.browser.version+"!" );
}
From version 1.3, you should use jQuery.support instead.
Main reason for this is that should should avoid checking for browsers, as features may change from version to version, making your code obsolete in no time.
You should always try to use feature detection instead. This will allow you to see if current browser supports the feature you're trying to use, regardless the browser brand, version, etc.

There is a special window.opera object which is present in all Opera 5+ browsers. So something as simple as:
if (window.opera && window.opera.buildNumber) {
// we are in Opera
}
would be enough.

I check for Opera like this:
if (/Opera/.test (navigator.userAgent)) // do something
Why would you want jQuery?

It is much better to detect javascript capabilities rather than browser userAgent.
ie DOM, XmlHttpRequest, eventing model (event.target vs event.srcElement), ActiveX, Java etc
By focusing on the API functions that you will require, rather than a target browser you will create a more robust set of scripts, and inevitably less special casing.
This link here at opera will probably tell you more

A very simple way from Opera themselves:
if (window.opera) {
//this browser is Opera
}
Source: http://my.opera.com/community/openweb/idopera/

The main reason why Amazon fails on Opera is because the send different code from the server side already... If you visit the same page with Firefox and then save that page and reopen it in Opera it works fine...
But they promised to fix that sometime in January...

I think this way is the best
if ( window.opera.version() == 12) {
}
This example check if opera version is 12. Very useful when I have problems with font-face in Opera.

I don't know for sure ( i never really check for opera anyway) but if the built-in jQuery functionality doesn't detect opera, may be a bug with the jQuery which needs to be fixed. I would suspect if that's the case, it should get resolved fairly quickly.

In current HTML5 times, you can also check for browser features instead often.
if (!window.FormData) { alert("xmlhttprequest L2 FormData interface not available"); }