Problems with QQ Browser & How To Detect QQ Browser

QQ Browser
QQ Browser

Tencent QQ is one of the biggest software/internet companies of China. They started as instant messaging service and since then have spread out into almost every field of internet business. One of the field where they have significant user-base is QQ mobile browser.

QQ Browser is a Chromium based browser, so it looks and feels like Google Browser in most parts and have some more features that they have built over. Mobile QQ Browser has penetration of 48.3% in 2015 in Chinese markets, and this is highly distressing. Not just because it is insecure, which is obviously expected from any tech giants originating from China, but also because it is not up to date and repeatedly enrages developers and is hindering progress of web development.

One of the flaws of Mobile QQ Browser is <video> tag not rendering correctly which ignores the z-index completely and it is set to highest level/or it is completely floating above the HTML code.

So, it is important to detect Mobile QQ Browser when you need to overlay over whole website or something related to video.

function isItQQ() {     
  var cV = navigator.userAgent.match(/Chrom(e|ium)\/([0-9]+)\./);
      cV = cV ? parseInt(cV[2], 10) : false;
  var qq = navigator.userAgent.match(/Mobile\/\w{5,}\sQQ\/(\d+[\.\d]+)/);
  var width = window.innerWidth < 780;

  if(((cV<45) || qq) && width){
      return true;
  }else{
      return false;
  }
}

Since, Mobile QQ Browser uses Chrome 37 and sometimes navigator.userAgent contains the string "MobileQQ". So the above function checks both and also checks the width of the screen just to be sure that it is indeed mobile.

Be the first to comment

Leave a Reply

Your email address will not be published.


*