PJAX 与 Google AdSense 二者不可兼得

前言

前段时间，我在主题中集成了 PJAX 技术，网站的性能立马有了显著的提升，关键是集成起来并不复杂，效果却立竿见影，因此，还专门写了篇文章进行推荐。

然而，在前两天集成 Google AdSense 的时候却遇到了问题，自动广告启用了好几天，一直显示不出来，一开始我还以为是自己的问题，想着再等等，后来各种搜索后才知道，原来是它俩不、兼、容。

一开始还比较懵逼，资料查多了，才发现国内外都有很多和AJAX、PJAX 、React、Vue、Angular、SPA等如何接入 Google AdSense 相关的帖子和文章，下面列几个，感兴趣的可以详细看一下：

总之，这个问题已经被大家一遍又一遍讨论十几年了，我想有些朋友应该也遇到过类似的情况，明明 Google AdSense 审核通过了，也投放了，但广告始终显示不出来。这很可能就是因为你的网站，或者你使用的主题中用到了与上面类似的页面无刷新技术。

究其原因也很简单，除了 Google AdSense 本身不支持（这个上面的帖子中有相应的答复）以外，每一次广告的渲染，除了需要添加 ins 节点之外，还需要执行一次下面的 JS 代码，以触发广告显示：

<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

但浏览器渲染界面时，直接执行后台异步返回的 JS 代码显然是不安全的，浏览器自身默认也不支持这么做。

其实似乎并不存在完美的解决方案，至少我还没有找到，网上能找到的解决方案总结起来就一个，就是等整个界面加载完成或 PJAX 请求完成后，动态的添加广告节点，然后执行脚本触发广告渲染。下面是带有解决方案的几篇文章：

他们的做法本质是一样的，但有的说解决了，有的说没解决。从理论上讲，这种方案应该是可行的，所以，我也尝试了。然而，遗憾的是，正如第一篇文章中说的那样，虽然没报错了，但只有第一个广告有效，后面的都不生效，如果每个页面最多只有一个广告，那么这种方法似乎还行，但这明显属于钻了空子。

理论可行，实际不可行，究其原因，只能是谷歌不支持了，强行这么做，可能还违反了谷歌的政策条款，得不偿失。仔细一想，谷歌不支持也没毛病，说明谷歌考虑问题还是很严谨的，如果这都能行的话，那我都能想到一百种方式后台悄悄刷广告了。

其实，我也没有特别好的方案，因为从根上就不兼容，我能有什么办法？直接弃用 PJAX 是不可能的，但放弃 Google AdSense 又不甘心，牛皮已经吹出去了，左右都是打脸。

最后，我采取了一个折中的方案：只在进入文章详情页时刷新页面，其它情况依然保持局部刷新。这样做的优点是，既成功集成了 Google AdSense ，又不会导致用户体验明显下降，毕竟用户最常用的功能，如翻页、搜索、分类、标签、页面切换等，都还是 PJAX 实现的。

缺点是：

总之就是，广告展示的几率比直接禁掉 PJAX 少很多，但我个人已经知足了，大家觉得有没有必要做个开关，让使用主题的人可以选择是否完全禁用 PJAX 呢？

当然，如果你压根就不想要广告，那整个问题就变得简单了，直接不配置谷歌广告就可以了，这时又回到最初的极速模式了！

好了，这就是我处理 Google AdSense 和 PJAX 兼容问题的整个心路历程，虽然，最后的解决方案依然不尽完美，但这毕竟是一个很典型的问题，很多人也遇到过，所以，还是记录一下，希望对大家有点用处。