I have simply embedded google maps <iframe> tag in index.html file and hosted via VS code extension(live-server) in chromium based(brave) browser. It shows an error
GET https://maps.googleapis.com/maps/api/mapsjs/gen_204?csp_test=true net::ERR_BLOCKED_BY_CLIENT
Index.html file:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<iframe
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3532.8031834368167!2d85.3199904754433!3d27.69247732614716!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x39eb195a08b6c09f%3A0xd8e71fb76f30976d!2sMaitighar%20Mandala!5e0!3m2!1sen!2snp!4v1711688211048!5m2!1sen!2snp"
width="600"
height="450"
style="border: 0"
allowfullscreen=""
loading="lazy"
referrerpolicy="no-referrer-when-downgrade"
></iframe>
</body>
</html>
Tried resolving it looking at Stackoverflow 2014 questions, Getting "net::ERR_BLOCKED_BY_CLIENT" error on some AJAX calls and I am getting Failed to load resource: net::ERR_BLOCKED_BY_CLIENT with Google chrome.
These discussion gives me an idea that the error arises due to ad-blocker extension. Since brave has in-built ad-blocking shield. I turned it OFF for localhost and it turned out no errors in console.
How to avoid these errors while embedding Google maps and YouTube videos?