Detectando AdBlock com o AngularJS

Fala pessoal!

Hoje publiquei no bower um módulo para AngularJS simples porém funcional que consegue detectar se o browser que está visitando sua página consegue exibir propagandas ou não, ou seja, se está usando alguma extensão que bloqueia anúncios.

Essa biblioteca é o angular-adblock-detector, seu código fonte está disponível no GitLab em https://gitlab.com/brunofin/angular-adblock-detector.

Instalando

Para começar a utilizar é simples, se você utiliza bower apenas rode o comando na raiz do seu projeto:

bower install angular-adblock-detector

Se você não usa bower, bom... Por que não? É simplesmente ótimo!

De qualquer forma, simplemente baixe o código fonte do GitLab, prefira baixar uma das tags e não o código master pois a tag é a versão que é distribuída pelo bower e deve ser mais estável, já que master é em desenvolvimento.

Assim que baixado, apenas copie o arquivo angular-adblock-detector.js para uma pasta de escolha no seu projeto e inclua o script no HTML:

<script type="application/javascript" src="angular-adblock-detector.js"></script>

 Utilizando

Para utilizar, adicione 'angular-adblock-detector' como dependência do seu módulo:

var app = angular.module('SampleApp', ['angular-adblock-detector']);

E utilize o método .detect() do serviço AdBlockDetector.
Este método retorna uma promise com callback tendo como único parâmetro um boolean adsblocked que será:

true: Quando algum tipo de Ad Block estiver em uso e ativado, e seus anúncios não podem ser exibidos;
false: Quando seus anúncios estão sendo exibidos sem problema.

Segue exemplo:

app.controller('AdBlockTestCtrl', ['$scope', 'AdBlockDetector', function($scope, AdBlockDetector) {
      AdBlockDetector.detect().then(function(adsblocked) {
        if (adsblocked) {
          // esse código vai rodar quando há AdBlock
        } else {
          // esse código vai rodar quando tudo estiver OK
        }
      });
  }]);

O serviço não irá tomar nenhuma ação caso algum Ad-Blocker seja detectado, apenas irá reportar a você. A ação caso detectado ou não fica à sua vontade, pois esta é a parte divertida.

No caso de detectar Ad-Block, minha sugestão seria implodir a GPU do usuário utilizando matéria negra. Também estou trabalhando num módulo que faça isso, então fique ligado e siga o blog para ficar atualizado!

O serviço foi testado para funcionar com:

• Adblock;
• AdBlock Plus;
• Privacy Badger;
• arquivo hosts.

Com essa vou ficando por aqui.

Qualquer problema que ocorra, existe a página de issues no GitLab que pode ser usada para reportar bugs.

Valeu!