How to determine the Opera browser using JavaScript
Asked Answered
R

6

25

I want to determine whether the browser of the client machines is Opera using JavaScript, how to do that?

Regulate answered 4/1, 2010 at 8:49 Comment(5)
Why do you need to detect Opera? And, from your question, it seems that you want to detect users without JS... which is kinda impossible using JS.Mood
i need to call one js function only if there is browser is opera thats whay i am here......Regulate
Whenever possible, try to detect the problem and not the browser. I admit that this is sometimes hard :(Beeman
@Avinash: the reason J-P asked the question is that we didn't know why you're checking browser and after that response, we still don't. if you're checking because you want to know that a certain feature is supported (which is quite often why one checks for a specific browser), you should try to always check for that feature rather than the browser. If you're thinking "function x only exists in opera, so i'll only call that when the user runs opera", well, what happens if that function is removed in later versions of opera? rather: check if function x exists, use function xSoniferous
Hi Avinash, would you consider changing the accepted answer? Opera changed their userAgent string, the solution on that answer ain't working anymore...Gilligan
S
4

The navigator object contains all the info you need. This should do:

navigator.userAgent.indexOf("Opera");
Soniferous answered 4/1, 2010 at 8:52 Comment(7)
You should use feature detection where ever possible. See @S.Mark's answer.Physiological
I agree that you should use feature detection wherever possible, but this is still a correct answer to the explicit question of how to determine if a client is running opera. If the question was how to determine if this opera-specific function exists then checking for that function would be preferable. S.Mark's suggestion, while quite convenient (I upvoted it, too), is hardly feature detection at all. It relies on an object that's only present in opera, and checks for that, yes, but it doesn't check for the specific feature (unknown to us) that underlies the opera-check-requirement.Soniferous
Justin... The navigator string is designed for browser detection. Using feature-detection to detect browsers is even worse than using plain browser detection.Mood
This method doesn't work anymore, because Opera switched to the render-engine of Chrome. That means navigator.userAgent delivers something like this: "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/28.0.1500.95 Safari/537.36 OPR/15.0.1147.153" Note, that there is no "Opera", so the result is always -1. Either identify Opera by feature detection or use the method of @Zack Katz below. https://mcmap.net/q/524063/-how-to-determine-the-opera-browser-using-javascriptGuttle
Doesn't work anymore. Use: isOpera() {return (navigator.userAgent.indexOf("OPR") !== -1)};Westmorland
No longer valid!Stoss
Your reply is not useful as of 2021. Whether i run your code snippet in Opera, or Chrome, i get -1.Pellmell
B
40

Now that Opera uses the Chrome rendering engine, the accepted solution no longer works.

The User Agent string shows up like this:

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/28.0.1500.52 Safari/537.36 OPR/15.0.1147.132

The only identifier for Opera is the OPR part.

Here's the code I use, which should match the old Opera or the new Opera. It makes the Opera var a boolean value (true or false):

var Opera = (navigator.userAgent.match(/Opera|OPR\//) ? true : false);

Bercy answered 2/7, 2013 at 21:32 Comment(1)
Or? /Opera|OPR\//.test(navigator.userAgent)Mastoiditis
G
18
if(window.opera){
    //do stuffs, for example
    alert(opera.version()); //10.10 
}

No kidding, there is an object opera in opera browser.

You may think, object opera is overridable, but navigator is overridable too.

UPDATE:

To get more accurate result, you could do like

if (window.opera && opera.toString() == "[object Opera]"){
    //do stuffs, tested on opera 10.10
}

And I noticed, Opera have both addEventListener and attachEvent, so there is also another way like

if (window.addEventListener && window.attachEvent){
    //do stuffs, tested on opera 10.10
}
Gat answered 4/1, 2010 at 8:57 Comment(7)
@Justin, this isn't feature detection. If anything, it's feature-based browser detection. See nczonline.net/blog/2009/12/29/… ... Also window.opera && Object.toString.call(window.opera) == "[object Opera]" would be a more solid check.Mood
Thanks J-P, but Object.toString.call(window.opera) does not work in my opera 10.10, so I updated mine to working one.Gat
Sorry @S.Mark, I should have written Object.prototype.toString.call(window.opera)Mood
@J-P: in what cases is it desirable to use Object.prototype.toString.call rather than calling toString on the object? (given that we've checked for null immediately before that) Is it in case window.opera should implement its own toString function?Soniferous
@David, yep, exactly that. It's not really necessary -- just makes the check a little more reliable.Mood
Opera 16 doesn't have window.opera any moreAscanius
(window.addEventListener && window.attachEvent) isn't a good test for Opera since the condition is also fulfilled by IE9.Fitzpatrick
C
9

The above answers no longer work in the new Opera 30. Since Opera now use Chromium. Please use the below:

var isChromium = window.chrome,
    isOpera = window.navigator.userAgent.indexOf("OPR") > -1 || window.navigator.userAgent.indexOf("Opera") > -1;
if(isChromium !== null && isOpera == true) {
   // is Opera (chromium)
} else { 
   // not Opera (chromium) 
}

The new Opera 30 release now fully uses Chromium and also changed their userAgent to OPR

Carley answered 24/7, 2015 at 11:23 Comment(1)
Works great as of 2021, unlike the answer above yours, which does not work!Pellmell
G
7

In Prototype.js, we use this inference:

var isOpera = Object.prototype.toString.call(window.opera) == '[object Opera]';

This essentially checks that window.opera object exists and its internal [[Class]] value is "Opera". This is a more solid test than just checking for window.opera existence, since there's much less chance of some unrelated global opera variable getting in the way and resulting in false positives.

Speaking of unrelated global variable, remember that in MSHTML DOM, for example, elements can be resolved by id/name globally; this means that presence of something like <a name="opera" href="...">foo</a> in a markup will result in window.opera referencing that anchor element. There's your false positive...

In other words, test [[Class]] value, not just existence.

And of course always think twice before sniffing for browser. Oftentimes there are better ways to solve a problem ;)

P.S. There's a chance of future versions of Opera changing [[Class]] of window.opera, but that seems to be unlikely.

Gorrono answered 4/1, 2010 at 14:38 Comment(0)
S
4

The navigator object contains all the info you need. This should do:

navigator.userAgent.indexOf("Opera");
Soniferous answered 4/1, 2010 at 8:52 Comment(7)
You should use feature detection where ever possible. See @S.Mark's answer.Physiological
I agree that you should use feature detection wherever possible, but this is still a correct answer to the explicit question of how to determine if a client is running opera. If the question was how to determine if this opera-specific function exists then checking for that function would be preferable. S.Mark's suggestion, while quite convenient (I upvoted it, too), is hardly feature detection at all. It relies on an object that's only present in opera, and checks for that, yes, but it doesn't check for the specific feature (unknown to us) that underlies the opera-check-requirement.Soniferous
Justin... The navigator string is designed for browser detection. Using feature-detection to detect browsers is even worse than using plain browser detection.Mood
This method doesn't work anymore, because Opera switched to the render-engine of Chrome. That means navigator.userAgent delivers something like this: "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/28.0.1500.95 Safari/537.36 OPR/15.0.1147.153" Note, that there is no "Opera", so the result is always -1. Either identify Opera by feature detection or use the method of @Zack Katz below. https://mcmap.net/q/524063/-how-to-determine-the-opera-browser-using-javascriptGuttle
Doesn't work anymore. Use: isOpera() {return (navigator.userAgent.indexOf("OPR") !== -1)};Westmorland
No longer valid!Stoss
Your reply is not useful as of 2021. Whether i run your code snippet in Opera, or Chrome, i get -1.Pellmell
C
-1

do you mind using jQuery?

then you can use jQuery.browser (see documnentation)

But the jQuery-guys recommend not to use this.

We recommend against using this property, please try to use feature detection instead (see jQuery.support)

Edit:

For Mootools: use window.opera (see documentation)

Contexture answered 4/1, 2010 at 8:55 Comment(5)
i am using mootools 1.2 , so how to do that in mootools1.2 ?Regulate
I edited my post, but imho this can be found very easy with google (like I did)Contexture
-1 Why suggest something that even the makers suggest against?Physiological
because that was the Avinash asked for, how to detect the user is using opera or not.Contexture
@Justin: The makers don't suggest against using jQuery.browser to find out what browser the client is running, they suggest against using jQuery.browser to check for specific feature support. The method does exactly what the OP requested; Natrium provided an answer that delivered what was asked for, while noting that there are times when it is not desirable to do what was asked for (we don't have enough info on what Avinash is working on to know whether or not an explicit browser-check is agreeable in that scenario). I'd remove the downvote if I were you, this is quite valid.Soniferous

© 2022 - 2024 — McMap. All rights reserved.