H5和PC端的页面需要加载Google Adsense的广告并显示。微信小程序环境下不加载广告,因为微信小程序环境下加载Adsense代码会提示「域名非法」的问题导致整个H5页面无法在小程序里打开。
分析发现,Google Adsense的代码,是需要引入JS文件的,引入Adsense的JS代码后,就会自动执行并iframe一个页面,这个页面访问的域名因为没有在小程序后台添加到业务域名(也没有办法添加)。所以必须判断微信小程序环境,发现是微信小程序环境就不引入adsense的js代码。这样才能规避微信小程序下页面提示「域名非法」而无法打开的问题。
<ins class="adsbygoogle" style="display:block; text-align:center;" data-ad-layout="in-article" data-ad-format="auto" data-ad-client="ca-pub-6518549715186400" data-ad-slot="3773431114" data-full-width-responsive="false"></ins> <script src="//res.wx.qq.com/open/js/jweixin-1.3.2.js"></script> <script> function dynamicLoadJs(url, callback) { var head = document.getElementsByTagName('head')[0]; var script = document.createElement('script'); script.type = 'text/javascript'; script.src = url; script.crossorigin = 'anonymous'; if (typeof (callback) == 'function') { script.onload = script.onreadystatechange = function () { if (!this.readyState || this.readyState === "loaded" || this.readyState === "complete") { callback(); script.onload = script.onreadystatechange = null; } }; } head.appendChild(script); } function showAdGoogle() { var ua = navigator.userAgent.toLowerCase(); var isInMp = false; //引入的js文件地址 let url = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-6518549715186400'; dynamicLoadJs(url, function () { (adsbygoogle = window.adsbygoogle || []).push({}); }); } if (ua.match(/MicroMessenger/i) == "micromessenger") { wx.miniProgram.getEnv((res) => { if (res.miniprogram) { isInMp = true; } else { showAdGoogle(); } }) } else { showAdGoogle(); } </script>
微信小程序里可以愉快的打开相关页面而不提示错误了。H5和PC端正常加载和使用Adsense广告