Ebit banner with Error 404 and infinite loop with Adblock attached
Hello, I am trying to implement the ebit banner in the WooCommerce virtual store. I added lines of codes that ebit sent me but when I make it run, 2 errors appeared.
I decided to create an empty page in html and put only the banner Code:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<a id="bannerEbit"></a>
<script type="text/javascript" id="getSelo" src="https://imgs.ebit.com.br/ebitBR/selo-ebit/js/getSelo.js?93414"></script>
</body>
</html>I can see the banner image in the browser but when I see the console, it shows an error message
GET https://empresa.ebit.com.br/bitrate/banners/b1934145.gif 404 ()
1- would anyone know the what could it be or if this error would influence the store?
2- when I use Adblock, I don't know right what happens but it starts to drive another error (below) and goes into infinite looping. Is there any way around this situation?
GET https://www.ebitempresa.com.br/bitrate/banners/banner.gif?storeId=93414 net::ERR_BLOCKED_BY_CLIENT
Already searched the forum How to detect if the user uses AdBlock and make a decision based on the answer? but I couldn't solve my problem. :/
2 answers
As said, the error shown in the console could be a bug in the eBit script or some kind of control they do when calling the file .gif (?).
If you use <a id="seloEbit"></a> instead of <a id="bannerEbit"></a>, the error disappears by displaying the eBit stamp, but it doesn't show The banner, but that's not what you want. Just to explain.
If you put the two tags, it will show the stamp and banner:
<a id="seloEbit"></a>
<a id="bannerEbit"></a>
Regarding Ad blockers, to avoid infinite looping, you you can use the fuckadblock .
Leave only the tag <a id="bannerEbit"></a> in the place where you want it to display the banner and do not put the script <script type="text/javascript" id="getSelo" src="https://imgs.ebit...., it will be inserted by the code. Just enter the code below (see comments in the code):
<script>
document.addEventListener("DOMContentLoaded", function(){
function adBlockNotDetected() {
//Gera o Banner do Ebit caso não tenha bloqueador ativado
var s = document.createElement("script");
s.type = "text/javascript";
s.src = "https://imgs.ebit.com.br/ebitBR/selo-ebit/js/getSelo.js?93414";
s.id = "getSelo";
document.body.appendChild(s);
}
function adBlockDetected() {
// faz alguma coisa caso tenha bloqueador ativado
console.log("Anúncios bloqueados");
}
if(typeof fuckAdBlock !== 'undefined' || typeof FuckAdBlock !== 'undefined') {
adBlockDetected();
} else {
var importFAB = document.createElement('script');
importFAB.onload = function() {
fuckAdBlock.onDetected(adBlockDetected)
fuckAdBlock.onNotDetected(adBlockNotDetected);
}
importFAB.onerror = function() {
adBlockDetected();
}
importFAB.src = 'https://cdnjs.cloudflare.com/ajax/libs/fuckadblock/3.2.1/fuckadblock.min.js';
document.head.appendChild(importFAB);
}
});
</script>
Say:
If there is an ad blocker enabled, you can enter a default banner in the
<a id="bannerEbit"></a>tag so that it does not stay empty. Just enter a code that inserts an image into the functionadBlockDetected() {...}.
This is not a programming problem, it is a BUG in the script - https://imgs.ebit.com.br/ebitBR/selo-ebit/js/getSelo.js, which is trying to get to the GIF when there is an error in the download, the script will think that it was an error in the download, and / or failing to connect-and it is trying to download the GIF files, the problem is in this line:
var a=new Image;a.src=null!=ebitBannerParameters?"https://www.ebitempresa.com.br/bitrate/banners/b1"+ebitNumEmp+"5"+t+".gif?"+ebitBannerParameters.value:"https://www.ebitempresa.com.br/bitrate/banners/b1"+ebitNumEmp+"5"+t+".gif",a.style.border="0px",a.onerror=function(){a.src=null!=ebitBannerParameters?"https://www.ebitempresa.com.br/bitrate/banners/banner"+t+".gif?storeId="+ebitNumEmp+"&"+ebitBannerParameters.value:"https://www.ebitempresa.com.br/bitrate/banners/banner"+t+".gif?storeId="+ebitNumEmp}
Adjusting the code for better visibility:
var a=new Image;
a.src=null!=ebitBannerParameters ? "https://www.ebitempresa.com.br/bitrate/banners/b1"+ebitNumEmp+"5"+t+".gif?"+ebitBannerParameters.value :
"https://www.ebitempresa.com.br/bitrate/banners/b1"+ebitNumEmp+"5"+t+".gif",
a.style.border="0px",
a.onerror=function(){
a.src=null!=ebitBannerParameters ? "https://www.ebitempresa.com.br/bitrate/banners/banner"+t+".gif?storeId="+ebitNumEmp+"&"+ebitBannerParameters.value :
"https://www.ebitempresa.com.br/bitrate/banners/banner"+t+".gif?storeId="+ebitNumEmp
}
So see, when the Adblock blocks this image, then onerror is fires, in the onerror again it is tried to set the .src of new Image, but as obviously the adblock is still blocking this then it will enter again the onerror, and this will remain until deactivating the adblock, ie at this time will be trying to load in loop/loop the image, until it succeeds. It's not something we can solve, it's failure in getSelo.js.
To conclude there is nothing we can do, only the administrator of the ebit site can solve.
Just for the record
FuckBlockandBlockAdBlockare the same script, they do not change at all, only the name, the Author created BlockAdBlock only to prevent those who were to use the script did not go through some embarrassment with client or people, but the script is in fact the same:
Still yes you can try using https://pt.stackoverflow.com/a/87992/3635 before loading .js, so for example:
<script src="blockAdBlock.js"></script>
<script>
//Detect se o documento carregou
document.addEvent('DOMContentLoaded', function() {
//Se não detectar o adblock aplica o ebit
function adBlockNotDetected() {
var ebit = document.createElement("script");
ebit.src = "https://imgs.ebit.com.br/ebitBR/selo-ebit/js/getSelo.js?93414";
document.body.appendChild(ebit);
}
//Se detectar o adblock
function adBlockDetected() {
alert('AdBlock está ativado');
}
if(typeof blockAdBlock=== 'undefined') {
alert("blockAdBlock não foi carregado");
} else {
blockAdBlock.onDetected(adBlockDetected);
blockAdBlock.onNotDetected(adBlockNotDetected);
blockAdBlock.on(true, adBlockDetected);
blockAdBlock.on(false, adBlockNotDetected);
blockAdBlock.on(true, adBlockDetected).onNotDetected(adBlockNotDetected);
}
blockAdBlock.setOption('checkOnLoad', false);
blockAdBlock.setOption({
debug: true,
checkOnLoad: false,
resetOnEnd: false
});
});
</script>