[Edit]

JavaScript - detect if adblock is enabled (tested in 2024)

1 contributors

2 contributions

0 discussions

6 points

Created by:

Mikolaj

519

In this article, we would like to show how using JavaScript in simple way detect if some adblock is enabled in web broswer.

Note: the article contains solutions proposed and tested at 03:07 AM in 2023-01-01 (It was my New Year scarify for humanity - Root-ssh).

Problem overview

Edit

By default there is no any universal API that indicates ads are blocked or not.

There are tricks how test if adblock is not used:

check if ads scripts are loaded correctly,
example path:
- https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js
check if ads elements are mounted correctly in DOM (it requires multicase tests).

Note: many solutions that were working in the past stopped working, so they are not presented in the above solutions, so we focus on proper solutions only.

Example solution

Edit

In this section, you can find solution that works for:

Source code:

xxxxxxxxxx
 
var ADS_URL = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js';
​
function checkAdsBlocked(callback) {
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function () {
        if (xhr.readyState == XMLHttpRequest.DONE) {
            callback(xhr.status === 0 || xhr.responseURL !== ADS_URL);
        }
    };
    xhr.open('HEAD', ADS_URL, true);
    xhr.send(null);
}
​
​
// Usage example:
​
checkAdsBlocked(function(adsBlocked) {
    console.log('ads are blocked: ' + adsBlocked);
});

Auto running

Where truth of:

xhr.status === 0 means AdBlock is used,
xhr.responseURL !== ADS_URL means uBlock Origin is used.

ES6+ version

Edit

In this section, you can find above solution in ES6+ version.

xxxxxxxxxx
 
const REQUEST_URL = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js';
​
const REQUEST_CONFIG = {
    method: 'HEAD',
    mode: 'no-cors'
};
​
const checkAdsBlocked = (callback) => {
    fetch(REQUEST_URL, REQUEST_CONFIG)
        .then((response) => {
            callback(response.redirected);  // ads are blocked if request is redirected
        })                                  // (we assume the REQUEST_URL doesn't use redirections)
        .catch(() => {
            callback(true);                 // ads are blocked if request fails
        });                                 // (we do not consider connction problems)
};
​
​
// Usage example:
​
checkAdsBlocked((adsBlocked) => {
    console.log('ads are blocked: ' + adsBlocked);
});