how to detect an adblocker

DIY
read time ~6 min
  1. 1. How it works
  2. 2. Implementation
    1. 2.1. In the web page
    2. 2.2. In the javascript
    3. 2.3. Log adblocker visit
    4. 2.4. Take action
  3. 3. Does it work?
  4. 4. Conclusion
  5. 5. Bibliography

Around 25% of browsers are filtering advertisments with an adblocker, this value is lower on mobile but increase rapidly. Within the content filtered are also included most of the analytics engine like the one proposed by Bing and Google. This means that the statistics and analyses performed with these tools are not totally accurate, the impact is not really on ratio which should be accurate even with 75% of the traffic, but impact is more on population since some user profiles are massively using adblocking systems.

Wouldn’t it be interesting to know how much visits on your site are not included in the analytics you observe?

This article details how to gather this number. You probably have already encountered some sites encouraging you to suppress you adblocking solution in order to read the content, this is not the approach here which focuses only on knowing the part of your readers who are using such system, regardless of the fact you may propose some ads on your pages.

How it works

The simple principle is to simulate on your page the fact that some ads are proposed to the reader by loading a specific javascript file that will be filtered by the adblocking system. Based on the fact this file is effectively loaded by the browser (no adblocker installed) or filtered out (adblocker installed), you could perform some actions.
To gather the statistics on the adblocker users, a specific content (not filtered) is loaded and you will be able to estimate statistics from your server log files.

Implementation

The files used in this example are:

  • test.html: the page that will be visited
  • adframe.js: the javascript file that could be filtered out by the adblocker
  • admsg.html: the file used as a tracker of filtered visit

In the web page

You need to insert 2 specific parts:

test.html
1
2
3
4
<script type="text/javascript">
var adblock = true;
</script>
<script type="text/javascript" src="adframe.js"></script>
  • line 2: set a variable that estimates the browser is using an adblocker
  • line 4: ask the browser to load a javascript content on your site that match most of the adblocker filters

If the browser uses an adblocker, the line 4 will not be executed

In the javascript

adframe.js
1
adblock = false;
  • line 1: set the variable back to false, if this script is executed, this means no adblocker is used on the browser

Log adblocker visit

Since we would like to count the visit using adblocking system, let’s load a page on our site that will add a hit in our server log file. If you don’t have access to your log file, you are using multiple servers for load handling or are hosted in the cloud with no access to server logs, you will have to call an API that is able to store this hit in a specific back-end system.

At the end of the page:

test.html
1
2
3
4
5
6
7
8
9
10
11
<script>
function adbDefaultAction() {
if (!adblock) { return; }
const reqad = new XMLHttpRequest();
reqad.open("GET", "/admsg.html", true);
reqad.send(null);
}
adbDefaultAction();
</script>
  • line 5: if browser has an adblocker, we get a specific page, here /admsg.html in order to get log on the web server

Take action

If you want a specific action, like modifying the content of your page for visits with adblocking system, you could use a callback of the specific tracker page load.

test.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
function adbDefaultAction() {
if (!adblock) { return; }
const reqad = new XMLHttpRequest();
reqad.onreadystatechange = function() {
if (reqad.readyState == XMLHttpRequest.DONE
&& reqad.status == 200) {
document.getElementById("adblocked").innerHTML = reqad.responseText;
}
}
reqad.open("GET", "/admsg.html", true);
reqad.send(null);
}

Here we change the content of a specific span zone (#adblocked) in the page by the content of the tracker page once loaded. This is performed asynchronously once the content of the page is loaded.

Does it work?


Conclusion

Adblocking is not a bad thing if your site is not relying on this kind of content, but knowing how much your visitors are using such tool can help you in your analytics. If you are proposing ads on some pages of your site, you will probably go for specific solution and add-on available on your CMS to perform specific action.

Bibliography

Photo John Westrock

Alexandre Chauvin Hameau

2019-01-05T10:48:24