在启用CloudFlare以后,网站访问速度感觉稳定了不少,而且收录速度似乎更快了,在启用AMP之后,我也陆续将MIP支持了,但是出现一个问题就是MIP的规范要求<script>标签要么不能出现type,要么如果有type,其值必须为”text/javascript
“、”application/javascript
“,我在排查问题的时候发现MIP页面不符合规范,一看原来是<script>标签的type值有问题。如下图所示:
<script type="a850c044fbd65692abfffb84-text/javascript">
显然这个type的值是有问题的,可是我翻看源码并没有添加这个字段呢,于是我关闭WP-Rocket插件,发现依旧还有这个问题,那么我就猜测这个是CloudFlare造成了,通过缓存的配置、Page Rules等方式依旧没有解决,只能挨个尝试,最终发现原来是Rocket Loader的锅,查阅文档后得知,要想排除这个问题,需要在<script>标签上添加data-cfasync=”false”。于是将MIP模版的源码做了下修改,如下所示:
<script data-cfasync="false" src="https://c.mipcdn.com/static/v1/mip.js" type="text/javascript"></script><!--mip--> <script data-cfasync="false" src="https://c.mipcdn.com/static/v1/mip-share/mip-share.js" type="text/javascript"></script><!--分享组件 代码--> <script data-cfasync="false" src="https://c.mipcdn.com/static/v1/mip-stats-baidu/mip-stats-baidu.js" type="text/javascript"></script><!--百度统计--> <script data-cfasync="false" src="https://c.mipcdn.com/extensions/platform/v1/mip-cambrian/mip-cambrian.js" type="text/javascript"></script>
此时清除缓存,再次刷新页面,发现标签消失,通过MIP在线规则校验也成功通过了校验。
那么 Rocket Loader是干嘛的呢?查看说明,开启后可以加快包括js在内的页面加载速度,从而提高您的google rankpage 排名。但是开启后<script>的type会变成text/rocketscript,然后去下载一个叫rocket-loader.min.js的文件。如果对页面规范比较严格的想MIP或者AMP这种的,建议在<script>标签内加入data-cfasync=”false”。来解决这个问题,其他的吗还是建议开启吧。
本文的解决办法参考自How can I have Rocket Loader ignore specific JavaScripts?