CODEWITHSUNDEEP
javascriptphphtml
CrazyMatt
CrazyMatt

Reputation: 521

How do I tell if a user is using Brave as their browser?

I have been messing around with the Brave browser (https://www.brave.com/), an I cannot figure out how to determine how if a user is using Brave. I used a simple document to output the user agent:

<script>document.write(navigator.userAgent);</script>

and I get:

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.108 Safari/537.36

which doesn't really help me in my situation. Does anyone know how to determine anyone using Brave in PHP or JavaScript? Thanks!

Upvotes: 36

Views: 23198

Answers (12)

Le Phenix 47
Le Phenix 47

Reputation: 126

You can use the isBrave method built in to the Brave browser from the navigator object:

async function isUsingBrave() {
  const isBrave = await navigator.brave?.isBrave();

  return isBrave || false;
}

async function check() {
  const usesBrave = await isUsingBrave()
  console.log({
    usesBrave
  })
}

check()

Upvotes: 0

eloyesp
eloyesp

Reputation: 3285

Following some comments, it is enough to check if window.brave is defined. See this comment.

Upvotes: 0

MonkeyMagix
MonkeyMagix

Reputation: 707

I am used this bit of code as when I looked in the window object for window.google or window.googletag or window.Brave they were no longer there. So I looked in the window object and they no longer existed.

const keys = Object.keys(window);

console.log(keys);

So the three window objects that have been written about to detect Brave no longer work.

I also tried the duckduckgo.com method but that doesn't mention brave at all I literally took the code from this page >

https://api.duckduckgo.com/?q=useragent&format=json

and tried both AJAX and just pasting it in the browser address bar and it doesn't return Brave it returns (and I am in Brave now) this >

{"Abstract":"","AbstractSource":"Wikipedia","AbstractText":"","AbstractURL":"https://en.wikipedia.org/wiki/UserAgent","Answer":"Your user agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.99 Safari/537.36","AnswerType":"useragent","Definition":"","DefinitionSource":"","DefinitionURL":"","Entity":"","Heading":"UserAgent","Image":"","ImageHeight":0,"ImageIsLogo":0,"ImageWidth":0,"Infobox":"","Redirect":"","RelatedTopics":[],"Results":[],"Type":"E","meta":{"attribution":null,"blockgroup":null,"created_date":null,"description":"Wikipedia","designer":null,"dev_date":null,"dev_milestone":"live","developer":[{"name":"DDG Team","type":"ddg","url":"http://www.duckduckhack.com"}],"example_query":"nikola tesla","id":"wikipedia_fathead","is_stackexchange":null,"js_callback_name":"wikipedia","live_date":null,"maintainer":{"github":"duckduckgo"},"name":"Wikipedia","perl_module":"DDG::Fathead::Wikipedia","producer":null,"production_state":"online","repo":"fathead","signal_from":"wikipedia_fathead","src_domain":"en.wikipedia.org","src_id":1,"src_name":"Wikipedia","src_options":{"directory":"","is_fanon":0,"is_mediawiki":1,"is_wikipedia":1,"language":"en","min_abstract_length":"20","skip_abstract":0,"skip_abstract_paren":0,"skip_end":"0","skip_icon":0,"skip_image_name":0,"skip_qr":"","source_skip":"","src_info":""},"src_url":null,"status":"live","tab":"About","topic":["productivity"],"unsafe":0}}

So that didn't work and other sites that do Browser sniffing don't show Brave either just Chrome or Netscape e.g paste that user-agent:

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.99 Safari/537.36

into the box on this site >>

https://webbrowsertools.com/useragent/?method=normal&verbose=false

and there are 3 methods of detection, the navigator object, and two different JavaScript files platform.js and ua-parser.js. None of them get Brave.

Nor does this page > https://www.iplocation.net/ (which uses Request headers to get the user-agent) or > https://whichbrowser.net/ (which supposedly uses a complex method to detect the real browser you are using but just shows Chrome)

I tried many other sites like those that either the Request headers or the Navigator object and none worked.

Also when I test for plugins OR mimetypes I get a list of plugins back and I also get a length of 2 for MimeTypes and their details if I want them so that method doesn't work anymore either.

Therefore I used this function from > http://blog.strictly-software.com/2022/01/testing-for-brave-browser.html

I know that with extensions and injected code we could easily add properties to the window or navigator object, if we couldn't then user-agent switchers wouldn't exist.

This function seems to try to future proof by a) hoping one day Brave will have it's own User-Agent like it used to, not to long back I remember seeing Brave in the user-agent string. b) Also by hoping like one answer said that a Brave property would be returned to the window object e.g window.Brave as it is no longer there.

It checks for a Mozilla specific property on the Window object first to rule that out before doing some positive tests for Brave with various fallbacks.

As most modern browsers apart from FireFox are based on Chromium now, Chrome, Edge, Brave, Opera it rules out those by a user-agent regex test as a last resort. However, the first two branches should detect whether it is Brave or not.

For some reason even though perfectly indented in my page when I post inside the code section it kept missing off the top and bottom lines, so that is why the function and ending } are not indented properly

function IsBrave(ua){

var isBrave = false;

// user-agent may or may not be passed in if not get current navigator agent
ua = (ua === null || ua === undefined) ? ua = window.navigator.userAgent : ua;

ua = ua.toLowerCase();

// make sure not it's not Mozilla by looking for a Moz specific property on the window object
if("mozInnerScreenX" in window){        
    return isBrave;
}else{
    // everything in JavaScript is over writable we could do this to pass the next test 
    // but then where would we stop as every object even window/navigator can be overwritten or changed...?
    // window.chrome="mozilla";
    // window.webkitStorageInfo = "mozilla";

    // make sure its chrome and webkit
    if("chrome" in window && "webkitStorageInfo" in window){
        // it looks like Chrome and has webkit
        if("brave" in navigator && "isBrave" in navigator.brave){
            isBrave = true;
        // test for Brave another way the way the framwwork Prototype checks for it
        }else if(Object.prototype.toString.call(navigator.brave) == '[object Brave]'){
            isBrave = true;         
        // have they put brave back in window object like they used to
        }else if("Brave" in window){
            isBrave = true;         
        // hope one day they put brave into the user-agent
        }else if(ua.indexOf("brave") > -1){
            isBrave = true;
        // make sure there is no mention of Opera or Edge in UA
        }else if(/chrome|crios/.test(ua) && /edge?|opera|opr\//.test(ua) && !navigator.brave){
            isBrave = false;            
        }
    }

    return isBrave;

}

Of course, it is not perfect but it is working for me, the site also has a one-liner if you don't want all the fallbacks and future-proofing.

var w=window,n=w.navigator; // shorten key objects
let isBrave = !("mozInnerScreenX" in w) && ("chrome" in w && "webkitStorageInfo" in w && "brave" in n && "isBrave" in n.brave) ? true : false;

I updated it so that the 2nd test for Brave was the Prototype test as the other way I was doing was just a repeat of the 1st in a different manner. Also I was testing the fall through if the objects didn't exist and changing navigator.brave.IsBrave() to IsBraver() was causing an error but doing it the "isBraver" in navigator.brave way I could fall through to the 2nd branch without an error.

Upvotes: 0

Andre DeCarlo
Andre DeCarlo

Reputation: 191

There is a way to check if the user is using brave without any api calls. I created the below function that returns false or True if its Brave

function isBrave() {
  if (window.navigator.brave != undefined) {
    if (window.navigator.brave.isBrave.name == "isBrave") {
      return true;
    } else {
      return false;
    }
  } else {
    return false;
  }
}

document.getElementById("ans").innerHTML = isBrave();
Is this Brave? <span id="ans"></span>

Upvotes: 19

Wntiv Senyh
Wntiv Senyh

Reputation: 39

Brave has a class Brave, which is created and added to navigator as navigator.brave upon page load. It has one method which returns a promise: Brave.prototype.isBrave() Using these three you can create a check for brave browser (something like this):

var isBrave = false;
if(window.Brave&&navigator.brave&&navigator.brave.isBrave){
    isBrave = 'probable';//or some other value, as you wish
    navigator.brave.isBrave().then(function(r){
        if(r)isBrave = true;
    });
}

Upvotes: 3

Daniel
Daniel

Reputation: 4735

As of April 2020, you can use this detection method to get a boolean answer to whether the user is using Brave or not:

(navigator.brave && await navigator.brave.isBrave() || false)

Upvotes: 36

Daniel
Daniel

Reputation: 4735

Brave doesn’t have its own User-Agent, as pointed out in other answers. However, you can quite easily fingerprint it to differentiate it from Google Chrome. The current release, version 0.23.19, has at least 40 unique characteristics that can tell it apart from other browsers. I go into more detail on that in this article. However, this is a riddiculous sulution. Please just ask Brave to restore their own User-Agent string.

Upvotes: 3

Blaž Bagić
Blaž Bagić

Reputation: 21

2020. Updated solution:

Chrome now adds a new key to the window object: googletag, as opposed to the old one: google

This is the working code now:

const ua = window.navigator.userAgent.toLowerCase();
const isChrome = /chrome|crios/.test(ua) && ! /edge|opr\//.test(ua)
const isBrave = isChrome && ! window.googletag;

Upvotes: 2

pragmethik
pragmethik

Reputation: 182

Kohjah Breese's solution isn't working to detect Brave on Android (e.g. Chrome is detected as Brave). But as he said "If you search DuckDuckGo for [what's my user agent] they will return Brave." Then you can use the API of Duckduckgo to know if they browser is Brave : 

var request = new XMLHttpRequest()

request.open('GET', 'https://api.duckduckgo.com/?q=useragent&format=json', true)

request.onload = function () {
  var data = JSON.parse(this.response)
  var isBrave = data['Answer'].includes('Brave');
  if(isBrave){
    console.log( isBrave );
  }
}

request.send()

Upvotes: 11

Kohjah Breese
Kohjah Breese

Reputation: 4136

Brave appears has some different objects in the window object. I'm not sure how contiguous these are across Brave versions, but I noted two in the window.navigator object that are blanked out: plugins and mimeTypes. Since Brave is meant to be a privacy browser I think it's a good chance these will remain blanked. So my check is to check the length of those.

Please note that you also need to check for the browser being desktop first; it doesn't seem you can detect the Brave Mobile browser; and the below code will pick up many mobile browsers

var agent = navigator.userAgent.toLowerCase();
var isChrome = /chrome|crios/.test(agent) && ! /edge|opr\//.test(agent);
var isBrave = isChrome && window.navigator.plugins.length === 0 && window.navigator.mimeTypes.length === 0;
if(isBrave)
    console.log( isBrave );

If you search DuckDuckGo for [what's my user agent] they will return Brave. If you open the attached JS files you will find an elaborate browser detection that can detect Brave.

Upvotes: 8

user10616833
user10616833

Reputation:

Brave has the same user agent as Chrome. But Chrome itself add a lot (1768 as for now) of chrome-specific properties to window object. One of them is window.google. So detecting Brave is pretty simple (as for now):

const ua = window.navigator.userAgent.toLowerCase();
const isChrome = /chrome|crios/.test(ua) && ! /edge|opr\//.test(ua)
const isBrave = isChrome && ! window.google;

So brave, lol.

Upvotes: 6

Federkun
Federkun

Reputation: 36934

The "Brave" in the user agent was removed in the 0.9 version.

From the changelog:

Removed Brave from the User Agent HTTP header to reduce fingerprinting.

Upvotes: 16

Related Questions