Hello friends, In this article, we learn about Adblock.
What is Adblock?
- Adblockers don’t block ads – they block internet requests that transfer content into the browser.
- Ad blockers use filtering rules to dam or hide contents on an online page.
- While a webpage is loading, the ad blocker appearance at the site’s scripts and compares them with a listing of websites and scripts it absolutely was designed to dam. If it finds any, it blocks them.
How to add an Adblock extension?
Step: 1
You have to open your google chrome web store.
Step: 2
After that, you have to search Adblock in the search box and click on Adblock.
Step: 3
Next, you have to click the Add to Chrome button.
Now we are creating a simple demo for detecting Adblock on a page using jQuery.
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="alert alert-success" id="success" style="display:none;">
<strong>No AdBlock is used on this page.!</strong>
</div>
<div class="alert alert-danger" id="danger" style="display:none;">
<strong>AdBlock is enabled on this page.!</strong>
</div>
</body>
</html>
<script>
async function detectAdBlock() {
let adBlockEnabled = false
const googleAdUrl = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'
try {
await fetch(new Request(googleAdUrl)).catch(_ => adBlockEnabled = true)
} catch (e) {
adBlockEnabled = true
} finally {
<!-- console.log(`AdBlock Enabled: ${adBlockEnabled}`) -->
if(!adBlockEnabled){
$('#success').show();
}
else{
$('#danger').show();
}
}
}
detectAdBlock()
</script>
Output:
On this page, I have not used AdBlock.
On this page, I have used AdBlock.
Conclusion
In this article, we have learned about what is Adblock, how to add Adblock in our chrome, and how to detect Adblock with the help of jQuery.
Also, check What Is Serilog In .NET Core?
