Comment détecter Adblock sur mon site Web?

370

Je voudrais pouvoir détecter si l'utilisateur utilise un logiciel de blocage publicitaire lors de sa visite sur mon site Web. S'ils l'utilisent, je veux afficher un message leur demandant de le désactiver afin de soutenir le projet, comme le fait ce site Web .

Si vous accédez à ce site et que votre navigateur dispose d'une sorte de logiciel adblock activé, le site au lieu d'afficher les annonces réelles affiche une petite bannière indiquant aux utilisateurs que les revenus publicitaires sont utilisés pour héberger le projet et qu'ils devraient envisager de désactiver Adblock .

Je veux le faire sur mon site Web, j'utilise des annonces Adsense dessus, comment puis-je faire cela?

Jmlevick
la source
2
doublon possible du logiciel Detecting AdBlocking?
416E64726577
5
Pour les utilisateurs à la recherche d'une solution la plus récente, sachez qu'une solution complète enfichable est disponible sur github.com/sitexw/BlockAdBlock
yeaske
5
Certaines personnes n'aiment tout simplement pas être analysées et annoncées sur le Web. Certains sites que j'ai visités, nous disant que les revenus soutiennent leur projet, sont tellement embourbés dans les publicités que cela devient ridicule.
Paul
7
Maintenant que les sites le font de plus en plus (et en abusent, et nous mentent sur le fait que leurs annonces ne sont pas intrusives, et nous forcent à mettre sur liste blanche tout leur site juste pour entrer ...) - Y a-t-il des extensions ou des astuces que nous pouvons utiliser pour les empêcher de détecter que nous utilisons AdBlock +? - Cela ne me dérange pas de voir quelques bannières ciblées ici ou là, mais le cliquetis et les pop-ups vidéo plein écran constants ne sont pas mon truc les gars.
BrainSlugs83
1
S'il vous plaît voir ma solution, c'est simple et propre. Pure JS, pas de demandes supplémentaires, pas de bibliothèques ou plugins externes ou tout autre BS.
Cumulo Nimbus

Réponses:

410

Ma solution n'est pas spécifique à un certain réseau publicitaire et est très légère. Je l'ai en production depuis quelques années. AdBlock bloque toutes les URL contenant le mot "annonces". Voici donc ce que j'ai fait:

J'ai ajouté un petit fichier js à mon webroot avec le nom ads.js

Ceci est la seule ligne de code dans ce fichier

var canRunAds = true;

Puis quelque part dans ma page:

<html>
  <head>
    <script src="/js/ads.js"></script>
  </head>
  <body>
    <script>
      if( window.canRunAds === undefined ){
        // adblocker detected, show fallback
        showFallbackImage();
      }
    </script>
  </body>
</html>

Des fichiers comme ads.js sont bloqués par au moins ces adblockers sur Chrome:

  • AdBlock
  • Adblock Plus
  • Adblock Pro
  • Ghostery

Mise à jour du 2019-02-15:

Ajout de Ghostery dans la liste ci-dessus car l'extension bloque désormais également les demandes à ads.js. Très utile. Est-ce à dire que Ghostery nous aide en fait à nous, les développeurs, à détecter le blocage des publicités avec leur extension?

Ne fonctionne pas avec:

Blaireau de confidentialité

Horaire
la source
1
pouvez-vous donner le lien complet de js/ads.jss'il vous plaît? comme je suis dans blogueur, j'ai dû télécharger .jsquelque part (comme: Google Drive) et le lien dans ce cas ne contient pas ads. Il serait vraiment utile de donner le lien de votre fichier.
Deb
91
Le fichier contient uniquement les mots "var canRunAds = true;" alors créez-le vous-même.
timing
5
Certains bloqueurs de publicités semblent ne pas bloquer le fichier ads.js, comme pour moi, un simple adblock pour chrome.
Mgamerz
2
ABP pour chrome réagit bien, donc tout fonctionne correctement!
Maxime Lafarie
9
Vous pouvez également essayer d'exécuter une demande ajax sur une URL bloquée par un adblocker. S'il réussit, il n'y a pas d'adblocker, s'il échoue, il y a un adblocker.
SethWhite
138

Pas une réponse directe, mais je mettrais le message derrière l'annonce à charger ... plutôt qu'en essayant de le détecter, cela s'afficherait quand l'annonce ne le fait pas.

mavrck
la source
5
Les utilisateurs peuvent toujours bloquer ces avis d'annonces bloqués à l'aide d'Adblock: c'est le seul défaut que je connaisse.
Anderson Green
25
Cela peut être facile, mais ce n'est pas la bonne façon de le faire, si votre mise en page est déformée ou que l'annonce se charge lentement, l'utilisateur peut apercevoir une erreur qui ne le concerne pas. Sachez également qu'Adblock prend des mesures pour bloquer les messages importuns destinés aux utilisateurs d'ABP. Si vous souhaitez demander à l'utilisateur de débloquer, faites-le via un message masquable simple qui se trouve en dehors de la mise en page (ne repousse pas les autres éléments). Regardez duckduckgo.com/?q=foo+bar avec adblock activé.
Xeevis
1
@Xeevis - que cherche-je? - Je pense qu'AdBlock + bloque déjà tout ce que fait duckduckgo.
BrainSlugs83
101

http://thepcspy.com/read/how_to_block_adblock/

Avec jQuery:

function blockAdblockUser() {
    if ($('.myTestAd').height() == 0) {
        window.location = 'http://example.com/AdblockNotice.html';
    }
}

$(document).ready(function(){
    blockAdblockUser();
});

Bien sûr, vous devez disposer d'une page de destination pour AdblockNotice.html, et la classe .myTestAd doit refléter vos conteneurs d'annonces réels. Mais cela devrait fonctionner.

ÉDITER

Comme le recommande TD_Nijboer, une meilleure façon est d'utiliser le sélecteur :hidden(ou :visible, comme je l'utilise ci-dessous) pour que cela display: nonesoit également vérifié:

function blockAdblockUser() {
    if ($('.myTestAd').filter(':visible').length == 0) {
        // All are hidden, or "not visible", so:
        // Redirect, show dialog, do something...
    } else if ($('.myTestAd').filter(':hidden').length > 0) {
        // Maybe a different error if only some are hidden?
        // Redirect, show dialog, do something...
    }
}

Bien sûr, les deux peuvent être combinés en un seul ifbloc si vous le souhaitez.

Notez que visibility: hiddencela ne sera pas capturé non plus (où l'espace de mise en page reste, mais l'annonce n'est pas visible). Pour vérifier cela, un autre filtre peut être utilisé:

$('.myTestAd').filter(function fi(){
    return $(this).css('visibility') == 'hidden';
})

Ce qui vous donnera un tableau d'éléments publicitaires qui sont "invisibles" (tout étant supérieur à 0un problème, en théorie).

Jared Farrish
la source
16
La redirection dans ce cas est une mauvaise idée. Si votre service de publicité tombe en panne, tous les visiteurs pourraient être redirigés vers cette page. Je recommanderais également d'utiliser l'événement onload de fenêtre plutôt que le document prêt.
Andy E
1
une meilleure façon de détecter serait $ ('. myTestAd'). is (": hidden"); comme le manuel le spécifie, il détecte également si la largeur / hauteur est 0 et si display = none.
TD_Nijboer
6
Redirecting in this case is a bad idea. If your advertising service goes down, all visitors could be redirected to that page.En effet. Sans compter qu'ils jetteraient simplement ensemble un script simple pour vaincre la contre-mesure. En outre, pensez-vous vraiment qu'en étant agressifs et puissants, les utilisateurs seront motivés à désactiver leurs bloqueurs de publicités? Non, tout ce qu'il accomplirait serait de les énerver et de les aigrir contre votre site. La plupart des sites choisissent simplement d'afficher un message plutôt que d'être hostiles.
Synetech
Cela ne fonctionne pas pour moi dans Chrome. Dans l'événement DOMReady, l'annonce semble toujours visible.
nwellnhof
3
S'il vous plaît, n'empêchez pas les utilisateurs d'entrer sur votre site, car ils ont désactivé les publicités - cela ne fait qu'intensifier la course aux armements. - Si vous nous demandez gentiment de les activer, nous pourrions le faire - si vous essayez de nous forcer, nous arrêterons simplement d'aller sur votre site, ou nous signalerons un bogue sur notre adblocker et obtiendrons il a corrigé pour votre site. - C'est le type de comportement exact dont les adblockers existent pour protéger les utilisateurs.
BrainSlugs83
93

Pas de demandes supplémentaires. Pas de bibliothèques externes. JavaScript simple et simple:

var adBlockEnabled = false;
var testAd = document.createElement('div');
testAd.innerHTML = '&nbsp;';
testAd.className = 'adsbox';
document.body.appendChild(testAd);
window.setTimeout(function() {
  if (testAd.offsetHeight === 0) {
    adBlockEnabled = true;
  }
  testAd.remove();
  console.log('AdBlock Enabled? ', adBlockEnabled)
}, 100);

  • Vous créez un élément avec la classe adsbox (comme défini comme un élément amovible dans le fichier de définition d'AdBlock Plus)
  • Vous l'ajoutez au document et après un court instant vous lisez son offsetHeight
  • Si AdBlock est installé, l'élément n'aura aucune hauteur.

Grâce à la publication de Christian Heilmann , je pense que c'est de loin la meilleure solution pour détecter AdBlock.

Cumulo Nimbus
la source
5
Pour éviter les problèmes, vous pouvez l'ajouter testAd.style.display = 'absolute'et le déplacer hors de l'écran
Gerald
4
bonne solution, mais pour ceux qui souffrent du délai de <div id="detect" class="ads ad adsbox doubleclick ad-placement carbon-ads" style="background-color:red;height:300px;width:300px;position: absolute;left:0;top:0;">&nbsp;</div><div id="detect" class="ads ad adsbox doubleclick ad-placement carbon-ads" style="height:1px;width:1px;position: absolute;left:-999px;top:-999px;">&nbsp;</div>
100 ms,
2
@Gerald Bon point. mais AFAIK, absolutec'est une positionvaleur.
Em Seven
puis-je simplement ajouter, je n'ai obtenu cette solution que lorsque je l'ai ajoutée dans une window.onloadfonction
Peter Cullen
Notez que cela ne fonctionne pas pour AdBlock pour Firefox
Eda190
42

La plupart des annonces sont chargées dynamiquement en javascript. Je viens d'utiliser l'événement onerror pour détecter si le script publicitaire pouvait être chargé ou non. Semble fonctionner.

Exemple avec GoogleAds:

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js" onerror="adBlockFunction();"></script>

Cela peut également être utilisé sur d'autres éléments pour voir si un bloqueur de publicité bloque le contenu. Cette méthode peut produire des faux positifs si les éléments distants n'existent pas ou ne peuvent pas être atteints.

JonMayer
la source
1
C'est l'une des meilleures façons de vérifier si l'annonce est chargée ou non .. parce que charger manuellement votre propre script en s'appuyant sur le bloqueur pour bloquer celui-ci va parfois échouer ..
MaZZly
Cela semble être la meilleure solution pour les scripts chargés dynamiquement.
Carca
Je ne sais pas si quelque chose a changé depuis que cela a été écrit, mais je ne parviens pas à déclencher une erreur avec le plug-in Chrome Fair Adblock by STANDS.
Melchester
en mars 2018, toujours la meilleure solution, simple et définitive
Daniel Vukasovich
comme dit ci-dessus, cela ne fonctionne pas avec adblocker équitable, il vaut mieux vérifieroffsetHeight
cieunteung
17

Pour détecter si l'utilisateur bloque les publicités, tout ce que vous avez à faire est de trouver une fonction dans l'annonce javascript et d'essayer de la tester. Peu importe la méthode utilisée pour bloquer l'annonce. Voici à quoi cela ressemble pour les annonces Google Adsense:

if(!window.hasOwnProperty('google_render_ad') || window.google_render_ad === undefined) { 
    //They're blocking ads, display your banner
}

Cette méthode est décrite ici: http://www.metamorphosite.com/detect-web-popup-blocker-software-adblock-spam

Beau
la source
9
google_render_ad est désormais indéfini à tout moment, typeof (window.google_jobrunner)! = 'object' fonctionne pour moi.
Dmitrii Korotovskii
4
Comme ce n'est pas du code que vous contrôlez, je pense que c'est une mauvaise idée de s'appuyer sur cela, car un refactor de la bibliothèque fera que votre script détectera le bloc d'annonces pour tous les utilisateurs.
Patrick Forget
1
typeofest une surcharge si vous vérifiez la propriété de l'objet. Utilisez simple === undefined.
Robo Robok
12

Ma solution la plus simple avec jquery est:

$.ajax({
    url: "/scripts/advertisement.js", // this is just an empty js file
    dataType: "script"
}).fail(function () {
    // redirect or display message here
});

advertisement.js ne contient rien. Lorsque quelqu'un utilise adblock, il échoue et la fonction est appelée.

Luca Steeb
la source
10

Je sais qu'il y a déjà suffisamment de réponses, mais comme cette question se pose sur Google, recherchez "détecter adblock" sur le sujet, je voulais fournir un aperçu au cas où vous n'utilisez pas adsense .

Plus précisément, avec cet exemple, vous pouvez détecter si la liste Adblock par défaut fournie par Firefox Adblock est utilisée. Il profite que dans cette liste de blocage il y a un élément bloqué avec l'ID CSS #bottomAd. Si j'inclus un tel élément dans la page et teste sa hauteur, je sais si le blocage publicitaire est actif ou non:

<!-- some code before -->
<div id="bottomAd" style="font-size: 2px;">&nbsp;</div>
<!-- some code after -->

Le reste se fait via le suspect jQuery habituel:

$(document).ready( function() {
  window.setTimeout( function() {
    var bottomad = $('#bottomAd');
    if (bottomad.length == 1) {
      if (bottomad.height() == 0) {
        // adblocker active
      } else {
        // no adblocker
      }
    }      
  }, 1);
}

Comme on peut le voir, j'utilise setTimeoutavec au moins un délai d'attente de 1 ms. J'ai testé cela sur différents navigateurs et la plupart du temps, vérifiant directement l'élément en readyretournant toujours 0; que l'adblocker soit actif ou non. J'avais deux idées à ce sujet: soit le rendu n'était pas encore fait, soit Adblock n'avait pas encore démarré. Je n'ai pas pris la peine d'enquêter davantage.

marque
la source
J'aime beaucoup cette réponse car elle n'implique pas de faire des demandes supplémentaires. Y a-t-il des inconvénients à cette approche au lieu de fausses demandes ads.js?
JeroenVdb
Au lieu de tester la longueur et la hauteur, ne pouvez-vous pas simplement utiliser if ($ ("# bottomAd"). Is (': hidden')) ...?
Evan Langlois
@EvanLanglois, je sais que vous l'avez posée il y a deux ans, mais votre question m'a réellement intéressé alors je suis allé plonger pour en savoir plus. Apparemment, la .is(":hidden")vérification dépend de la hauteur et de la largeur de zéro. Si vous définissez simplement la hauteur à 0, mais que le div occupe toujours une largeur, il n'est pas considéré comme "masqué" par jQuery. Donc, si vous pouvez dire, cela .is(":hidden")dépend quelque peu de la façon dont l'adblocker décide de redimensionner / masquer le contenu.
Spencer D
10

Mon conseil est: ne le faites pas!

Tout scénario dans lequel vous traitez les gens comme des "malfaiteurs" va les amener à riposter.

Voici ma proposition.

Mettez un petit message discret en haut de la page (que les publicités soient bloquées ou non) avec le texte I *totally* respect your right to block adset un lien vers une autre page / fenêtre contextuelle intituléeRead more ... .

Sur l'autre page, indiquez clairement que vous comprenez que c'est leur ordinateur et qu'ils sont libres d'utiliser le blocage des publicités.

Assurez - vous aussi clairement d'une manière non accusatoire que l'utilisation de ces bloqueurs pour vous rend plus difficile de livrer un excellent contenu ( ce qui explique pourquoi en détail) et que, si vous préférez l'annonce de blocage de ne pas se produire sur votre site, c'est totalement leur décision. Concentrez-vous sur les avantages de désactiver le blocage.

Ceux qui s'opposent avec véhémence aux publicités l'ignoreront, mais vous n'avez jamais eu la chance de les convaincre de toute façon. Ceux qui sont indifférents pourraient bien être influencés par votre appel, car vous ne faites pas tout ce que je veux, ou je vais prendre ma balle et rentrer à la maison, ce qui devrait être le domaine exclusif des enfants de cinq ans.

N'oubliez pas que personne ne vous a tenu un pistolet sur la tête et vous a forcé à mettre vos affaires sur le net. Traitez votre lectorat / utilisateurs avec respect et vous constaterez probablement qu'un bon nombre d'entre eux vous rendront la pareille.

paxdiablo
la source
1
Que diriez-vous "Il semble que vous utilisez un bloqueur de publicités. C'est cool! Nous aussi :) S'il vous plaît soutenir X en parlant de nous à vos amis!"
ADTC
3
heh essayez de monétiser quelque chose de cette façon ... les annonces sont un moyen de paiement normal, donc l'utilisateur doit payer
dev1223
qu'en est-il de ma mise en page cassée lorsque le bloc publicitaire est activé?
godblessstrawberry
5
Si un site Web m'oblige à désactiver mon bloqueur de publicités, je continue. Ils perdent, et je m'en fiche. Je viens de récupérer une copie en cache de Google.
RayfenWindspear
1
@Tallboy, il n'y a pas d'éthique dans ma réponse. Il n'y a que la réalité des publics que vous essayez de cibler. Et, bien que vos intentions puissent être telles que décrites, une relecture de la question vous montrera que c'était spécifiquement pour demander à l'utilisateur d'autoriser les annonces, pas de nettoyer la mise en page ou autre. C'était la question à laquelle je répondais, pas une autre question envisagée une demi-décennie plus tard :-)
paxdiablo
9

Ils utilisent le fait que le code d'annonce de Google crée un iframe avec l'id "iframe". Donc, tant que vous n'avez pas déjà quelque chose sur votre page avec cet ID, cela fonctionnera aussi pour vous.

<p id="ads">
<script type="text/javascript"><!--
google_ad_client = "their-ad-code-here";
/* 160x600, droite */
google_ad_slot = "their-ad-code-here";
google_ad_width = 160;
google_ad_height = 600;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

</p>

<script type="text/javascript"><!--
if(document.getElementsByTagName("iframe").item(0) == null)
{
    document.write("<div style='width:160px; height:600px; padding-top: 280px; margin-left:5px;border:1px solid #000000; text-align:center; font-family:century gothic, arial, helvetica, sans serif;padding-left:5px;padding-right:5px;'>Advertising seems to be blocked by your browser.<br /><br /><span style='font-size:10px'>Please notice that advertising helps us to host the project.<br /><br />If you find these ads intrusive or inappropriate, please contact me.</span><img src='http://www.playonlinux.com/images/abp.jpg' alt='Adblock Plus' /></div>");
}
--></script>
Robbie
la source
9

Ajoutez simplement un petit script sur votre site:

var isAdsDisplayed = true;

Avec le nom adsbygoogle.js

Ensuite, procédez comme suit:

<script src="/js/adsbygoogle.js"></script>
<script>
if(window.isAdsDisplayed === undefined ) {
  // AdBlock is enabled. Show message or track custom data here
}
</script>

Trouvé cette solution ici

druss
la source
C'est un homme génial, merci beaucoup 💓
Jodyshop
8

J'ai remarqué que les commentaires précédents utilisent google adsense comme objet à tester. Certaines pages n'utilisent pas adsense, et l'utilisation du bloc adsense comme test n'est pas vraiment une bonne idée. Parce que le bloc adsense peut nuire à votre référencement. Voici un exemple de détection de classe bloquée simple par adblocker:

Html:

<div class="ad-placement" id="ablockercheck"></div>
<div id="ablockermsg" style="display: none"></div>

Jquery:

$(document).ready(function()
{
   if(!$("#ablockercheck").is(":visible"))
   {
     $("#ablockermsg").text("Please disable adblocker.").show();
   }
});

"ablockercheck" est un identifiant qui bloque adblocker. Donc, en vérifiant s'il est visible, vous pouvez détecter si adblocker est activé.

Roman Losev
la source
7

AdBlock semble bloquer le chargement des fichiers JavaScript AdSense (etc). Donc, si vous utilisez une version asynchrone des annonces AdSense, vous pouvez vérifier s'il adsbygoogles'agit d'un Array. Cela doit être vérifié après quelques secondes car le script asynchrone est ... asynchrone. Voici un aperçu :

window.setTimeout(function(){
    if(adsbygoogle instanceof Array) {
        // adsbygoogle.js did not execute; probably blocked by an ad blocker
    } else {
        // adsbygoogle.js executed
    }
}, 2000);

Pour clarifier, voici un exemple de ce à quoi ressemble le code des annonces asynchrones AdSense:

<!-- this can go anywhere -->
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

<!-- this is where the ads display -->
<ins class="adsbygoogle" ...></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Notez qu'il adsbygoogleest initialisé en tant que tableau. La adsbygoogle.jsbibliothèque change ce tableau en Object {push: ...}lors de son exécution. La vérification du type de variable après un certain temps peut vous dire si le script a été chargé.

Salman A
la source
Cela fonctionnera la plupart du temps, mais que se passe-t-il si un utilisateur a une connexion lente (pensez aux appareils mobiles)?
Luca Steeb
6

Cette approche que j'utilise sur mon site, vous la trouverez peut-être utile. À mon avis, c'est la solution la plus simple .

AdBlocker bloque des classes spécifiques et des éléments html, en inspectant ces sélecteurs de toutes les annonces bloquées dans la console du développeur (ils sont tous répertoriés), vous pouvez voir quels éléments seront toujours bloqués.

Par exemple, inspectez simplement cette page de questions sur stackoverflow et vous verrez un tas d'annonces bloquées.

Par exemple, tout élément avec bottom-adclasse est automatiquement bloqué.

  1. J'ai créé un élément div non vide avec la bottom-adclasse: <div class="bottom-ad" style="width: 1px; height: 1px;">HI</div>
  2. Après le chargement de la page, vérifiez simplement si cet élément est masqué. J'ai utilisé jQuery, mais n'hésitez pas à utiliser javascript: $('.bottom-ad').css('display') == "none"ou encore mieux en utilisant$('.bottom-ad').is(':visible')

Si la valeur est true, AdBlocker est actif.

NGix
la source
6

Vous n'avez pas besoin d'une demande HTTP supplémentaire, vous pouvez simplement calculer la hauteur d'un faux ajout.

À propos, voici une liste complète correspondant aux éléments que les adblockers évitent de rendre.

window.adBlockRunning = function() {
    return (getComputedStyle(document.getElementById("detect"))["display"] == "none") ? true : false;
  }()

console.log(window.adBlockRunning);
#detect {
  height: 1px;
  width: 1px;
  position: absolute;
  left: -999em;
  top: -999em
}
<div id="detect" class="ads ad adsbox doubleclick ad-placement carbon-ads"></div>

vorillaz
la source
6

le moyen le plus sûr est d'envelopper vos annonces à l'intérieur <div>et de vérifier la hauteur

<div id="check-ab">
/* your ads code */
</div>

setTimeout(function(){
  if(document.getElementById("check-ab").offsetHeight === 0){
    console.log("ads blocked");
  }
  else{
    console.log("ads running");
  }
}, 100);

cela fonctionne avec adblock plus et le pare-feu bluehell.

uingtea
la source
6

Un moyen efficace de vérifier s'il y a un bloc publicitaire: vérifiez simplement s'il y a un bloc publicitaire activé en essayant de déclencher l'URL des annonces Google. Si oui, exécutez callback_has_adblock, sinon, exécutez callback_no_adblock. Cette solution coûte une demande de plus mais au moins elle fonctionne:

var hasAdBlock = function (callback_has_adblock, callback_no_adblock) {

    $.getScript( "https://pagead2.googlesyndication.com/pagead/show_ads.js" )
        .done(function( script, textStatus ) {
            callback_no_adblock();
        })
        .fail(function( jqxhr, settings, exception ) {
            callback_has_adblock();
    });
};

Cette solution fonctionne pour toutes sortes d'annonces, pas seulement pour google adsense.

John Skoumbourdis
la source
certains adblockers bloquent jQuery, alors le script ne s'exécute pas car "$ n'est pas défini". Mieux vaut utiliser des js purs.
NYX
3

Malgré l'âge de cette question, je l'ai récemment trouvée très utile et ne peux donc que supposer qu'il y en a d'autres encore. Après avoir regardé ici et ailleurs, j'ai supposé que les trois principales vérifications côté client pour détecter indirectement un bloqueur de publicités étaient de vérifier les div/ imgbloqués, les iframes bloqués et les ressources bloquées (fichiers javascript).

C'est peut-être exagéré ou paranoïaque, mais cela couvre les systèmes de blocage des publicités qui ne bloquent qu'un ou deux de la sélection et peuvent donc ne pas avoir été couverts si vous n'aviez effectué qu'une seule vérification.

Sur la page où vous exécutez les vérifications, ajoutez: (J'utilise jQuery)

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="advertisement.js"></script>
<script type="text/javascript" src="abds.js"></script>

et ajoutez les éléments suivants ailleurs sur la page:

<div id="myTestAd"><img src="http://placehold.it/300x250/000000/ffffff.png&text=Advert" /></div>

J'ai utilisé un div avec un nom d'appât ainsi qu'une image hébergée en externe avec le texte "Advert" et dans les dimensions utilisées par AdSense (merci à placehold.it!).

En advertisement.jsvous devriez ajouter quelque chose au document que nous pouvons vérifier plus tard. Bien qu'il semble que vous fassiez la même chose qu'avant, vous vérifiez en fait le fichier ( advertisement.js) lui-même en cours de chargement, pas la sortie.

$(document).ready(
{

    $("body").append("<div id=\"myTestAd2\">check</div>");

});

Et puis le script de détection du bloqueur de publicité qui combine tout

$(document).ready(function()
{
    var ifr = '<iframe id="adServer" src="http://ads.google.com/adserver/adlogger_tracker.php" width="300" height="300"></iframe>';
    $("body").append(ifr);
});

$(window).on("load",function()
{

    var atb = $("#myTestAd");
    var atb2= $("#myTestAd2");
    var ifr = $("#adServer");

    setTimeout(function()
    {

        if( (atb.height()==0) ||
            (atb.filter(":visible").length==0) ||
            (atb.filter(":hidden").length>0) ||
            (atb.is("hidden")) ||
            (atb.css("visibility")=="hidden") ||
            (atb.css("display")=="none") ||
            (atb2.html()!="check") ||
            (ifr.height()!=300) ||
            (ifr.width()!=300) )
        {
            alert("You're using ad blocker you normal person, you!");
        }

    },500);

});

Lorsque le document est prêt , c'est-à-dire que le balisage est chargé, nous ajoutons également l'iframe au document. Ensuite, lorsque la fenêtre est chargée , c'est-à-dire le contenu incl. images etc. est chargé, nous vérifions:

  • Les dimensions et la visibilité du premier test div.
  • Que le contenu du deuxième test div est "check", comme il l'aurait été s'il advertimsent.jsn'était pas bloqué.
  • Les dimensions (et je suppose que la visibilité, car un objet caché n'a pas de hauteur ou de largeur?) De l'iframe

Et les styles:

div#myTestAd, iframe#adServer
{
    display: block;
    position: absolute;
    left: -9999px;
    top: -9999px;
}

div#myTestAd2
{
    display: none;
}

J'espère que cela t'aides

Luke S
la source
3

Si vous utilisez le nouveau code AdSense, vous pouvez effectuer une vérification facile, sans recourir à des vérifications de contenu ou CSS.

Placez vos annonces comme d'habitude dans votre balisage:

<ins class="adsbygoogle" style="display: block;"
   data-ad-client="ca-pub-######"
   data-ad-slot="#######"
   data-ad-format="auto"></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>

Ensuite, vous appelez le code adsense en bas de votre page (notez que vous n'utilisez pas le "async"drapeau lors de l'appel du adsbygoogle.jsscript):

<script src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

Ajoutez ensuite ce petit extrait de code ci-dessous:

<script>
if (!adsbygoogle.loaded) {
   // do something to alert the user
}
</script>

AdSense crée / définit toujours le drapeau adsbygoogle.loadedà truequand les annonces sont chargées, vous pouvez placer le contrôle dans une fonction setTimeout pour retarder la vérification de quelques secondes.

Troy Morehouse
la source
2
Cela dépend bien sûr de la façon dont les annonces ont été bloquées. Si votre logiciel de blocage des publicités empêche complètement le chargement d'AdSense, cela fonctionnera. Mais si votre logiciel de blocage des publicités fait quelque chose comme définir la propriété d'affichage CSS sur "none" ou la hauteur du div respectif sur 0, cela peut ne pas fonctionner.
2015 à 14h22
Vrai. Je ne pense pas qu'il existe un moyen facile d'attraper 100% de tous les blocs publicitaires, mais au moins vous pouvez en attraper certains.
Troy Morehouse
3

La plupart des adblocker annulent la requête HTTP vers l'élément ads.jset le font 0px, mais adblocker a parfois supprimé le DOM , et certaines réponses ci-dessus échouent car elles ne vérifient pas l'existence de l'élément.

L'utilisation setTimeout()est une bonne pratique car sans elle, le script fera la course avec adblocker.

Le script ci-dessous vérifiera si dom existe / a été supprimé et vérifie offsetHeightsi un élément existe.

setTimeout(function() {
  var a = document.querySelector('.showads'),
    b = a ? (a.offsetHeight ? false : true) : true;
  console.log('ads blocked?', b)
}, 200); // don't too fast or will make the result wrong.
<div class="ads showads">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</div>

cieunteung
la source
2

Toutes les réponses ci-dessus sont valides, mais la plupart ne fonctionneront pas pour le blocage des publicités au niveau DNS.

Bloqueurs de publicités au niveau DNS (comme pi-hole ) renvoient essentiellement NXDOMAIN (le domaine n'existe pas) pour une liste des domaines de blocage des publicités (par exemple, telemetry.microsoft.com "n'existera pas" quand il le fera).

Il existe plusieurs façons de contourner cela:

Méthode A : demande d'annonces par adresse IP et non par domaine.

Cette méthode est un peu gênante car il faudrait garder une trace des adresses IP. Cela sera problématique si votre code n'est pas bien entretenu ou mis à jour régulièrement.

Méthode B : bloquez toutes les demandes qui échouent, même si le client signale NXDOMAIN.

Ce sera très ennuyeux pour les utilisateurs s'il s'agit d'un NXDOMAIN "légitime".

Kot
la source
1
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>var adb=true;</script>
<script src="./getbanner.cfm?"></script>
<script>
$(document).ready(function(){if(adb)alert('AdBlock!');});
</script>

et dans le fichier getbanner.cfm:

adb = false;

Je pense que c'est le moyen le plus simple de détecter un bloc publicitaire.

mikas
la source
autres fichiers bloqués: easylist-downloads.adblockplus.org/easylist.txt c'est le filtre AdBlock par défaut
mikas
adb semble être truetoujours
Deb
1

C'est ce qui a fonctionné pour moi:

function isAdBlocked() {
     return (typeof(window.google_jobrunner) === "undefined") ? true : false;
}

$(document).ready(function(){
    if(isAdBlocked()) {
       alert('Y U NO LIKE ADS?');
    }
});
jesal
la source
Je viens d'essayer ceci; ne marche pas. Renvoie toujours true même si aucun logiciel de blocage des publicités n'est installé.
ecnepsnai
Gardez à l'esprit que cela ne fonctionnera que sur une page où vous utilisez AdSense. Sinon, il retournera toujours vrai, car c'est la bonne réponse - window.google_jobrunner ne sera détecté dans aucune des pages. Seuls ceux qui utilisent Google AdSense. Vous pouvez réellement voir ce code fonctionner sur mon site: ruddl.com
jesal
Il est intéressant de noter que votre méthode utilise le même message que celui utilisé par HowToGeek . Pour mémoire, l'affichage d'une boîte de message ne fait qu'ennuyer et aigrir les utilisateurs contre votre site; la plupart des sites choisissent d'afficher un message sur la page (HTG essaie de faire les deux, mais seule la fenêtre contextuelle agaçante fonctionne).
Synetech
1

Je sais que c'est déjà répondu, mais j'ai regardé l'exemple de site suggéré, et je vois qu'ils le font comme ceci:

<script type="text/javascript">
if(document.getElementsByTagName("iframe").item(0) == null) {
    document.write("<div style="width: 160px; height: 600px; padding-top: 280px; margin-left: 5px; border: 1px solid #666666; color: #FFF; background-color: #666; text-align:center; font-family: Maven Pro, century gothic, arial, helvetica, sans-serif; padding-left: 5px; padding-right: 5px; border-radius: 7px; font-size: 18px;">Advertising seems to be blocked by your browser.<br><br><span style="font-size: 12px;">Please notice that advertising helps us to host the project.<br><br>If you find these ads intrusive or inappropriate, please contact me.</span><br><img src="http://www.playonlinux.com/images/abp.png" alt="Adblock Plus"></div>");
};
</script>
John
la source
1

Pas besoin de délais d'attente et de reniflement DOM. Essayez simplement de charger un script à partir de réseaux publicitaires populaires et voyez si le bloqueur de publicité a intercepté la demande HTTP.

/**
 * Attempt to load a script from a popular ad network. Ad blockers will intercept the HTTP request.
 *
 * @param {string} url
 * @param {Function} cb
 */
function detectAdBlockerAsync(url, cb){
    var script = document.createElement('script');

    script.onerror = function(){
        script.onerror = null;
        document.body.removeChild(script);
        cb();
    }

    script.src = url;
    document.body.appendChild(script);
}

detectAdBlockerAsync('http://ads.pubmatic.com/AdServer/js/gshowad.js', function(){
    document.body.style.background = '#c00';
});
rodrigo-silveira
la source
1

Je viens de créer mon propre "plugin" pour résoudre ce problème et cela fonctionne très bien:

adBuddy + jsBuddy:

ADBuddy JSBuddy GitHub

J'ai ajouté la compatibilité mobile et la détection de jsBlocking entre autres ... (Comme une superposition qui est montrée aux utilisateurs leur demandant de désactiver l' adBlocking / jsBlocking logiciel ); Le rend également réactif et convivial.

Il est sous- traité sous la licence Coffeeware .

Jmlevick
la source
Appréciez l'effort, mais ne semble pas fonctionner avec adblock ... au moins au moment d'écrire ce commentaire.
arunskrish
cela fonctionne avec adBlock, un site où j'ai implémenté ce plugin est calyphrox.net, où n'importe qui peut en effet vérifier que le plugin fonctionne.
Jmlevick
3
Le lien est mort ... pouvons-nous supprimer cela?
Evan Langlois
2
Veuillez mettre à jour les liens, cela en fait une mauvaise réponse.
Yazan Rawashdeh
0

Je comprends votre tension et vous pouvez vérifier si l'élément a été créé par le script ou si l'élément est masqué. Et si nous parlons de blocage des publicités, vous ne pouvez compter que sur la visibilité de l'élément, pas sur la présence de l'élément.

L'élément créé avec un script tiers ne sera jamais présent, si le script n'est pas accessible pour le moment (erreur DNS, erreur de serveur Web distant, préchargement de page Web hors ligne, etc.), et vous obtiendrez toujours un faux positif.

Toutes les autres réponses avec vérifications sont correctes, mais gardez cela à l'esprit.

Eir Nym
la source
0

timing's la réponse est bien pensée mais ne fonctionne plus, j'ai donc mis à jour le nom du fichier js en "adsense" de "ads" et cela fonctionne comme un charme!

Voici le code, peut-être que cela aidera quelqu'un:

<html>
      <head>
            <script src="/adsense.js"></script>
      </head>
             <body>
                   <script>
                           if( window.adblockDetecter === undefined ){
                           // Do anithing, adblocker detected!
                           alert('Adblocker Detected!');}
                   </script>
            </body>
</html>

Dans le fichier Js mettez juste cette ligne: var adblockDetecter = true;

eclipseR
la source
0

Maintenant, il y a une meilleure façon de le faire en utilisant un simple script JS appelé AdBlock Detector
Voici comment l'utiliser:
Ajoutez ceci à votre <head>section:

<script type="text/javascript">
window.onload = function() {
var iframe = document.createElement('iframe'),
    randomDomain = Math.floor(Math.random() * (10000 - 100 + 1)) + 100,
    iframeLoaded = true;

iframe.src = "http://"+ randomDomain +".com/ads.html";
iframe.height = ".1px";
iframe.width = ".1px";
iframe.id = 'some-ad';
iframe.onload = function() {iframeLoaded = false;};

document.body.appendChild(iframe);

setTimeout(function() { 
    var someAd = document.getElementById('some-ad');
    if(!iframeLoaded ||
       someAd == null || 
       someAd.style.display == "none" || 
       someAd.style.display == "hidden" || 
       someAd.style.visibility == "hidden" || 
       someAd.offsetHeight == 0)
        document.getElementById('ab-message').style.display = 'block';
    someAd.remove();
}, 500);
};
</script>`<br>

Vous pouvez maintenant utiliser l' ab-messageID où vous voulez afficher un message aux utilisateurs AdBlock:

<div id="ab-message" style="display: none">Your message here!</div>

Notez le style en ligne ajouté pour le masquer à l'origine (bien sûr, vous pouvez également le faire à partir de votre propre fichier CSS).
Notez également que cela prend 500 ms, c'est parce qu'il doit attendre que l'adblocker fasse son travail ou cela ne fonctionnera pas.

Une petite explication du fonctionnement de ce script

Tout d'abord, il ajoute un iframe avec une source de lien généré aléatoirement. (Il est généré de manière aléatoire car certains blocs publicitaires sont intelligents, à un moment donné, ils réalisent qu'un lien est faux).
Ensuite, il exécute plusieurs vérifications sur cette iframe (si elle a été chargée avec succès ou si son style a été modifié). Si l'un de ces tests est vrai, il affiche alors l' ab-messageélément pour bloquer les utilisateurs.

Ce script fonctionne pour la plupart (sinon la totalité) des bloqueurs de publicités.

SUPPLÉMENTAIRE

Aucun point, vraiment, n'aurait pu créer un résumé, mais à la place, j'ai créé un projet Github, mais quand même, vérifiez-le et lancez-le si cela vous a aidé.
abDetector: Détecteur AdBlock JavaScript simple vanille.
Prendre plaisir.

Nick Rameau
la source
Mauvaise solution. Un fichier .js externe est facilement bloqué.
Bangkokian
@Bangkokian Il suffit de copier et de le référencer (et sa licence) dans votre message montrant le fichier javascript ou index.js (ou autre).
BlueEyesWhiteDragon
1
@BlueEyesWhiteDragon Vous avez raison. Mais ce n'est pas du tout la réponse originale de Troy. Il a maintenant été édité à 100% pour afficher un script en ligne. Mon commentaire demeure. Sa réponse originale était spécifiquement d'utiliser un script externe. stackoverflow.com/posts/34738388/revisions
Bangkokian
@Bangkokian exactement, j'ai oublié de mentionner que grâce à votre commentaire j'ai édité ma réponse pour suivre les directives SO et en ai fait un script en ligne. Je vous remercie.
Nick Rameau
0

Vous pouvez vérifier cela, cela pourrait aider à détecter-adblocker

C'est une implémentation de réponse temporelle

Ajoutez ceci avant n'importe quel script dans la balise head:

<head>
    <title></title>
    <meta/>

    <!--adBlocker detection code - START-->
    <script src="//adblocker.fortiapp.com/ads.js"></script>
    <script>
        (function (i, o, g, r) {
            i[o] = (typeof i[o] == typeof undefined) ? g : r
        })(window, 'adblocker', true, false);
    </script>
    <!--adBlocker detection code - END-->

    // Other scripts

</head>

Ensuite, utilisez-le plus tard:

if (adblocker) {
    // the add blocker is enabled
}else{
    // ad blocker is not enabled
}
Mustafa Dwekat
la source
Ça ne marche pas. Cela montre toujours que l'annonce est bloquée.
Himanshu Aggarwal
vérifiez la valeur window.adblockerdans la console de votre navigateur si elle retourne truealors adblocker est activé sinon il reviendra falsevous pouvez vérifier la documentation complète detect-adblocker
Mustafa Dwekat