网站建设

WordPress评论ajax动态加载,解决静态缓存下评论不更新问题

这是一个历史遗留问题,自从博客部署了PHP纯静态缓存之后,所有页面都是html静态内容了,而且在七牛CDN静态分离之后,速度更是达到极致! 不过也带来不少疑难问题,在之前写的《启用WP Super Cache纯代码版本之后的一些优化措施》一文中已经总结一些解决办法。其中为了解决用户无法看到最新回复的问题,我也想了多个办法,比如成功提交评论就会删除该页缓存、右下角集成清理缓存按钮等。在我多次改进之后,已经趋向于完美,而且这个php缓存优化也是张戈博客有偿服务最受欢迎的项目之一。 前不久,有朋友拿我的网站练手,用大量代理IP对我的博客进行DDos攻击,无奈之下博客临时转入到百度云加速。转入之后,如果把云加速的页面缓存也打开,那么就有了2层缓存:【CDN节点的html缓存】和【服务器的html缓存】。那么我之前写的ajax清理缓存以及评论删除缓存失去了效果,因为只能删除本地的html缓存,而CDN节点的缓存百度并未提供API控制接口,所以用户看到的还是缓存内容! 当然,不是强迫症的话,直接关闭百度的页面缓存就可以了!但这只是逃避问题,而没有解决问题!所以,本文就分享一下,强迫症是如何解决这个非必须问题的。 一、自动动态加载评论 这是我最初想到的、而且是老早就想实现一种方案:当静态的html页面加载时,评论部分实时从数据库动态拉取数据,由于是纯静态下的html页面,所以这个功能需要JS+Ajax来实现。 ①、php评论动态拉取接口代码 Ps:代码的原理就不赘述了,主要用到wp_list_comments内置函数,感兴趣的可以自行了解下。 以上代码保存为php文件,比如ajax-comments.php,保存到网站根目录,备用。 ②、Ajax评论请求代码 以上代码可以直接贴到网站的footer.php当中。如果你要添加到js文件中,请除去首尾的script标签,而且post_id值需要在外部通过php动态定义(搞不清的还是直接贴footer吧)! 特别说明下,2段代码中的【.commentlist】是指评论列表的class,比如知更鸟主题的评论列表的是<ol class="commentlist">评论列表</ol>,实际上请根据主题的评论列表class或ID来自行修改! 部署无误之后,每次页面加载都会动态去拉取一次最新的评论,并呈现给用户。 优点:每次打开页面用户都能看到最新评论; 缺点:每次打开页面都会动态拉取评论,降低了纯静态效果,拉取的评论分页有点误差(影响不大)。 二、手动动态刷新评论 这个方法灵感源自网络上流行的评论分页Ajax加载:点击评论的下一页,不会刷新整个页面,而是通过ajax拉取被点击那个分页的全部内容,然后找到评论部分并加载。 简单解释下原理: 比如,张戈博客的留言板,有100页评论,那么第99页的评论地址应该是:https://zhang.ge/liuyan/comment-page-99/,当点击【99】这个分页链接时,将触发ajax函数,先隐藏当前分页的所有评论,然后ajax拉取第99页的内容,然后将评论部分加载出来,实现不刷新页面来加载评论。 分析了这个过程,我们可以发现一个特征关键字,那就是分页地址后面的 comment-page-xx !这是个好东西,因为我可以在云加速和本地的缓存中排除这个关键词的缓存即可!也就说,浏览器直接访问带comment-page-xx这类关键词的地址,就略过缓存,加载动态内容! 因此,当我们部署了ajax评论分页,点击其他分页将会显示非缓存内容!但是这还不是我需要的,因为我想要当前页面也实现动态评论。也许聪明人会说,你点到其他评论分页,再点回来不就好了嘛? 确实,实现ajax评论分页后,我点到其他评论分页,然后再点回来,确实可以实现评论刷新,但是却用了2次点击! 好,下面我们换个角度,既然 comment-page-xx 是动态页面,那么comment-page-1肯定也是动态页面咯! 于是就有2种情况:第一种,文章评论数量还不够生成分页,那这时候只要拉取comment-page-1就可以了;第二种,评论已经存在分页,那么只要拉取这个comment-page-【页码】即可,所以ajax拉取之前,我们只要通过js判断来决定要拉取的目标地址即可。 那么,js如何判断评论是否有分页了呢?很简单,先分析下网页代码: 可以发现分页是有分页对应的class的,那么js只要判断这个class是否存在就好啦!而且我还可以发现当前的分页和其他分页的class还是不一样的:当前分页的class是【page-numbers current】,而 其他分页则是【page-numbers】,如以此来,我们还可以用js代码 $('.page-numbers.current').html() 获得当前分页的页码!!! 那问题就好解决了,我们只要先判断是否存在分页,然后根据不同情况抓取不同的目标地址即可! 下面开始分享代码: 使用方法很简单,把这个代码添加到主题已有的js中,然后在任意位置新增一个ID为refresh的html元素即可,比如: Ps:这个代码参考修改自:《WordPress Ajax 评论分页 | Kayo's Melody》,因此如果没看懂ajax评论分页,本文分享的也会看得稀里糊涂的,尤其是代码中的ID元素,不同主题是不一样的。 本文分享的方法和思路,如果不是真正需要,我想会看得很痛苦,因为我写的也很痛苦!很多地方不好解释,因为你没有需求,就可能看不懂!!但是,只要是我用心折腾过的功能,我都想分享出来,网络这个林子那么大,不可能就没有同样需求的人吧?!有时候,【解决思路】真心比【实现代码】来的更加难得! 这种看似很复杂的文章,实际上,光看文章是很费解的,个人建议结合自己的需求,然后对比张戈博客的页面源代码去参考,会更容易理解一些。 好了,废话说了够多了,还是那句话,文章是分享给真正有需要的人,没有需求,又说不出个甲乙丙丁的人,建议不要在本文浪费口水,说三道四比较好!
阅读全文
WEB应用

php平滑重启nginx,彻底清除WordPress的静态缓存

每一次分享技术文章,都是基于自己的痛点,基于自己的需求。这次也一样,所以分享具体方法之前,我先说一下我这次的需求与痛点: 一、需求痛点 在博客集成了代码版缓存功能之后,为了方便在前台清理页面缓存,我特意写了ajax清理缓存的功能(相关文章)。这个功能写好之后确实可以正常工作。 但是,为了让网站加载速度提升到极致,我还在nginx里面加了类似于WP Super Cache的mod_rewrite机制:当存在页面缓存时,会绕过PHP解析,而直接调取缓存在前台展示。 这样就发现了一个问题:当我在前台点击缓存清理后,后台的页面缓存文件确实是删除了,但是nginx却在内存里面缓存了一份!!从而导致一段时间内怎么刷新页面,展示的依然是缓存内容!这样一来,不管是我还是用户,点击前台这个清理按钮根本就不能实时看到效果,明显就鸡肋了! 我发现这个问题的做法是,点击按钮删除缓存,然后进入Linux系统去reload一下nginx,才能彻底刷新缓存!我勒个去,每次我调试代码的时候,真心能把人累死(虽然我可以关闭缓存功能,但是我就是要享受一下自己写的清理功能嘛!)。 需求都有了,怎能让技术成为瓶颈? 所以,根据以上需求,很容易得出一个解决方案:当点击前台清理按钮时,php先删除缓存文件,然后reload平滑重启nginx就可以实现彻底清除缓存了! 测试了半天,发现难点是php如何才能执行Linux命令。经过不断测试,终于搞定这个问题,下面开始分享! 二、执行权限 php执行Linux命令有几个前提条件: ①、php必须开放一些执行外部命令的函数,比如exec()、system()等; ②、必须赋予WEB启动帐号(比如www帐号)执行特殊命令(比如 .../nginx -s reload)的权限。 对于问题 ①: i. 修改php配置文件php.ini,先找到safe_mode配置,确认safe_mode=off,即关闭php安全模式(lnmp一键安装包默认已经是关闭的了); ii. 继续找到disable_functions配置,将其中的 exec 删除,即允许执行exec()函数; ii. 最后重载php-fpm或php即可生效,比如lnmp环境可以执行 service php-fpm reload命令。 Ps:开启exec函数存在被恶意注入的风险,不过我这种小博客就没什么好惧怕的,况且我的备份及防护都很完善! 对于问题②: 我们需要在Linux中赋予WEB帐号使用sudo执行指定命令的权限,在这个需求中,我们可以这样做: Ps:操作vim需要一定的Linux基础知识,不会的童鞋先脑补一下吧! 三、部署代码 ①、新增平滑重启nginx的脚本 ②、PHP代码 php执行这个脚本的代码很简单: Ps:实际上,使用 exec(/opt/reload_nginx.sh"") ; 也是完全可以的。多套了一层EscapeShellCmd是为了安全考虑(其实这里貌似没啥必要,算是掩耳盗铃吧!)。 既然知道php代码了,那么只要修改上次分享的缓存清理代码,如下新增26行和33行即可: Ps:若对以上代码有任何疑问,请务必参考上一篇相关文章。 全部完成之后,现在在前台使用缓存清理功能,将会先删除缓存文件,然后平滑重启nginx,从而真正实现在纯静态的前台实时清理缓存,显示最新内容! 四、写在最后 这篇教程算是我这种强迫症&发骚友学习实验之作,而且整个教程并未过多考虑安全问题。所以,如果不是和我这种既不在意被人攻击,又清楚个中原理的人,还是不建议做这种强迫症设置(实际上也就是解禁了exec函数存在隐患而已)! 总之,这篇文章分享的方案,还是有一定的参考价值的,根据本文思路,就可以实现在WEB界面任意操作服务器了,其实也就和大部分站长用的Linux系统面板差不多,希望能给有需要的人提供一些参考,有任何相关问题记得给我留言。
阅读全文
网站建设

启用WP Super Cache纯代码版本之后的一些优化措施

张戈博客在上个月28号启用了WP Super Cache代码版,几天下来,虽然小问题不断,但是总体感觉非常不错!不管是前台还是后台,速度都有质的提升,着实值得会折腾的人使用。 感兴趣的可以先看下28号的具体教程:《WP Super Cache静态缓存插件纯代码版(兼容多域名网站)》. 下面,简单的说一下启用此功能后遇到的一些问题的解决办法或细项优化。 ①、发表评论时并未删除缓存,导致无法显示最新评论; ②、若主题有登陆状态显示,那缓存之后,无论谁打开都显示已登录; ③、WordPress原生评论框已登录状态将带入缓存当中,效果同上; ④、管理员回复评论也会发送邮件给管理员(①、②项处理OK之后发现的问题); ⑤、无法保存评论者信息,这个是开启缓存之后的诟病,之前已分享过变相解决办法。 以上问题上一篇文章已有具体说明,下面是最新发现的问题: ⑥、居然会缓存评论填表信息; ⑦、缓存清理不够方便; ⑧、缓存没有时间戳; ⑨、发布/更新文章未删除缓存,导致无法显示最新内容; ⑩、开启缓存之后,首页加上index.php后缀仍然可以访问,从而造成收录重复; ⑾、会缓存不存在的页面(404),可能被搜索引擎抓取造成SEO影响(缓存之后会是200状态); ⑿、带补充 一、过滤用户信息 针对第⑥条: 今天,用浏览器无痕模式打开留言板意外发现如图尴尬: 之前浏览器一直是有cookies,所以每次打开时,博客的js都会自动加载已保存的信息,也就是我的经常用的信息。今天鬼使神差的试了下无痕模式,才发现了这个BUG,尼玛把其他人填写的信息都给缓存了,这是泄漏他人隐私啊!而且也对新用户体验很差! 仔细看了下缓存代码,懒得深究为何会缓存用户浏览器的内容,直接在cache.php中加入了置空机制,搞定这个问题: 使用方法:编辑上一篇文章中所说的cache.php文件,搜索function auto_cache()函数,并替换为以上代码即可。 代码原理:就是在缓存内容之前,先将已保存的用户信息置空,这样处理之后,缓存到磁盘里的html文件才是纯净无痕的。 替换机制也很简单,就是借用了php的正则替换函数:preg_replace(),其语法如下: 比如,需要将hello word! 替换为 hello zhangge!,则可以这样写: 因此,我需要置空缓存内容中的用户名、邮箱及网址,也就是一个最简单的正则匹配过程,比如替换用户名: 所以,如果你在使用代码版的缓存功能之后,发现某些内容被意外缓存了,只要使用这个方法替换掉即可。 二、前台缓存清理 针对第⑦条 清理缓存不方便的问题,我今天写了一个js+ajax+php的方法,可以在前台ajax删除缓存内容: ①、新增JS+ajax 代码: 将以上代码添加到主题footer或合并到其他js当中均可,需要注意的是,在此代码之前必须先正常载入Jquery。 ②、新增php代码: 将以上代码添加到静态缓存文件cache.php的<?php 之后即可。 注意:cache.php和js代码中的url对象是 一 一对应的!!这篇文章主要是针对上一篇文章而写的,所以就是cache.php,如果想改成其他php文件,也是可以的,但前提条件是和js中url对象要一致! ③、新增触发按钮 在文章、单页页面,合适的位置新增一个按钮或超链接,然后将其id改为clean即可实现点击该按钮时清理当前页面缓存,比如张戈博客将一个图片链接放到了百度分享工具条上(实现全局清理后,我将其移动到了右下角滚动条): 最简单的写法如下: 你也可以在其他空闲元素上新增一个id="clean",总之就是要新增一个id为clean的元素!在网站前台点击这个元素将清除当前页面的缓存。 三、加入缓存时间 针对第⑧条: 如果缓存页面没有时间戳,会让人分不清楚这个缓存页面是什么时候生成的,因为有时删除了缓存文件,在前台刷新看到的依然是缓存内容(nginx通常会产生一个304的浏览器缓存)!如果有个时间戳,就能更加容易的区分是否是最新的缓存。 解决方法很简单,在缓存时在代码最后新增时间戳即可,和WP Super Cache一样! 和上文第一条过滤用户信息的操作一样,找到auto_cache函数,如下新增2行时间戳代码即可: 四、发布时删除缓存 针对第⑨条: 这个问题其实很好解决,只要使用WordPress钩子在发布或更新文章时,调用删除缓存函数即可,具体如下: 将以上代码添加到主题目录的functions.php中即可实现发布或更新文章(单页面)的时候,删除当前文章(页面)、首页及所在分类的缓存文件,比WP Super Cache的那个发布文章删除所有缓存的机制合理多了!! Ps:关于删除缓存的所有代码中(包括前面的ajax清理功能),若存在二级分类,那么分类缓存路径可能需要进一步修改一下,才会更准确,如果你不清楚,那么用上面的代码也没有任何问题! 以下是张戈博客分类缓存路径的改进案例,仅供参考: 五、index.php跳转 针对第⑩条 今天,在看百度收录的时候,突然看到如下情形: 试了下,没开启缓存的博客在首页后面加上index.php访问,是会自动跳到不带index.php的,即访问http://yourdomain.com/index.php 会自动跳到 http://yourdomain.com/。 但是开启这个代码缓存之后,带上index.php是不会跳转的,我估计wp super cache的缓存也有这个问题。好吧,说下解决办法: ①、最简单的方法: 直接在robots.txt里面禁止百度抓取即可(不过不怎么绝对!): Disallow: /index.php Ps:实际上,我的robots.txt里面本来就有一条: Disallow: /*.php$ 尼玛百度就是这么任性!!!不遵守协议。 ②、301跳转方法: 试了半天nginx,发现和之前写的规则存在冲突,无奈之下只好用php代码实现301跳转: 将以上代码添加到cache.php的<?php之后即可,当然也可以放到网站根目录的index.php的<?php后面。 如图所示: 保存之后,在访问带index.php的首页就能自动跳转到不带index.php,从而解决了这个困惑。 六、禁止缓存404 针对第⑾条 当有人有意无意的访问到一些不存在的页面地址时,缓存代码会将404页面给缓存成html。网络上经常有一些恶意扫描软件,对网站进行猜测抓取,进入缓存文件夹可以看到各种奇葩文件夹: 先不说这样的文件夹会不会逼死强迫症。一旦这些奇葩路径被缓存,那么再次被访问,返回的就不再是404状态了,而是正常的200状态! 典型案例:明明是一个404错误,因为被缓存了,就被百度给收录了: 很简单的处理办法: ①、打开主题目录下的404.php模板(国产主题大部分有),然后在任意位置插入<!-- 404nocache -->; ②、编辑缓存代码,在auto_cache函数里面插入如下代码: 这样处理一下,就完美解决了会缓存404不存在页面的问题了!...
阅读全文
网站建设

WP Super Cache静态缓存插件纯代码版(兼容多域名网站)

中午,小熊发来一篇来自歧路亡羊博客的精彩教程:《wordpress利用代码来实现缓存》。粗略看了一下,发现这个代码在几个月之前我就用过,不过由于此代码无法区分多个域名,从而会导致移动站无法跳转的情况。 我利用午休的时间,仔细看了下这篇文章,发现博主在原代码的基础上,还加上了自动刷新缓存的机制,不过貌似是和WP Super Cache插件一样,只要更新文章,就会清除所有缓存,感觉不太适合我。 不过,这篇文章还是激发了我兴趣。折腾了几个月,我现在也能基本看得懂PHP了,所以决定把这个代码修改一下,让它可以适应多个域名的情况。 一、何为多域名? 正式分享之前,我必须说清楚一下,什么是多域名网站! 熟悉的朋友,应该知道张戈博客除了zhang.ge之外,还有一个m.zhang.ge的移动域名。当js检测到是移动端的UA时,将会自动跳转到m.zhang.ge,从而实现移动端的适配跳转。 以前分享这个跳转的时候,我下意识的以为,这种跳转可以兼容任意缓存,比如cos-html-cache等。实际上发现,这种跳转只能兼容wp super cache!原因是:只有wp super cache 是分域名来储存缓存文件的,其他插件包括代码版都不区分域名,统统存到同一个路径,于是就出现了无限死循环跳转的窘迫,因为缓存文件是同一个,跳了之后还是PC的缓存,怎么跳都跳不出这个死循环!!(估计又有人看不懂了,不过无所谓,真正需要的时候肯定看得懂!) 言归正传,既然wp super cache可以兼容多域名网站,那代码版肯定也可以做到!测试了十来分钟,就搞定了!存放结构都和wp-super-cache一样! 下面分享一下详细步骤: 二、部署代码 以下是三种缓存机制中,缓存文件存放路径的对比: 部署方法还是和原代码一致: 将以上代码保存为cache.php上传到网站根目录,然后修改网站根目录的index.php,在第一个<?php 后添加代码: 现在,只要刷新一下网站前台,就能在cache里面看到内容了,而且结构和WP Super Cache一致: 很明显,我参考了WP Super Cache的存放路径,请求域名的不同,存放位置也会不同,从而避免了多个域名请求到同一个缓存文件,造成跳转死循环的问题!(不得不说WP Super Cache想得很周到!) 当然,如果你想改成和WP Super Cache一样的存放路径,只需要将第二行代码如下修改即可: 代码中已加入缓存黑名单功能,如果想禁止某页面缓存,只要将该页面的关键字眼加入到如下代码,比如我要禁止缓存留言板,也就是https://zhang.ge/liuyan,那么如下新增: 最新补充:今早查看缓存时,大小居然高达45M!进去看了下,只能惊叹那些无聊的小人,真特么多!发一个部分截图,你们感受下: 各种恶意访问,真是居心叵测!如果非常多,建议将关键词加入到缓存黑名单,避免缓存太多占空间。 三、更多补刀 ①、找回CDN功能 用过WP Super Cache的朋友,应该知道这个插件还自带CDN功能,很全面!那么换成代码版,当然也不能漏掉这个实用功能! 正好歧路亡羊博客分享了水煮鱼的七牛CDN插件的代码版,直接拿来主义,然后强迫症缩进一下: 根据实际情况修改以上代码的2~3行,最后粘贴到主题目录下的functions.php文件的最后一个?>之前即可。 如果和张戈博客一样,有一个PC主题,还有个移动主题,那么2个主题的functions.php都需要添加,但是要注意修改不同的域名: 比如pc主题 用https://zhang.ge,而移动主题用http://m.zhang.ge,总之依葫芦画瓢就行!!! 这样就实现了之前WP Super Cache的CDN功能。 ②、找回Mod_rewrite模式 如果想要在nginx下实现mod_rewrite模式,需要在nginx下新增一些规则,这个在张戈博客已经分享过(相关文章) 开启这个模式的好处是,当存在静态缓存文件时,nginx将直接调用缓存文件给浏览器,而不再需要经过php-fpm模块,从而加载速度成倍增长! 那本文分享的代码版能否实现这个功能呢?依然是那句话,有想法,技术都不是问题! 很简单,只要稍微修改一下之前分享的nginx下的mod_rewrite规则即可: 只要将以上代码中的开始到结束之间的代码,添加到nginx配置文件中location / 模块原有规则之前即可。 保存之后,执行如下类似命令重载nginx: 完成以上操作,当有人访问到你的网站的缓存文件时,无需经过index.php,直接由nginx 判断并回应给用户,和之前WP Super Cache的机制一摸一样! ③、提交评论时清除文章缓存 这是张戈博客之前的文章就分享过的方法(相关文章),这次只要稍微修改下路径就可以用了! 修改主题目录下的comment-ajax.php,将以上代码添加到以下代码之后即可实现提交评论时删除当前文章的缓存: 以上方法会比歧路亡羊博主分享的要实用一些,当然萝卜白菜各有所爱,喜欢哪个用哪个!值得注意的是,如果博客没有使用ajax评论,那么以上代码需要添加到WP根目录下的wp-comments-post.php文件的相应位置。 四、多后遗症 部署此功能之后,各种问题迎面而来,我也真是醉了! ①、若主题有登陆状态显示,那缓存之后,无论谁打开都显示已登录; ②、WordPress原生评论框已登录状态将带入缓存当中,效果同上; ③、管理员回复评论也会发送邮件给管理员(①、②项处理OK之后发现的问题); ④、无法保存评论者信息,这个是开启缓存之后的诟病,之前已分享过变相解决办法(相关文章)。 对于①、②,很显然缓存的时候将用户登陆状态一起缓存了,导致任何人打开都是已登录,你醉了么? 解决办法: 针对①、找到主题显示状态的位置,修改登陆相关代码!比如知更鸟主题主题下的time.php和login.php; 针对②、找到主题下的comments.php文件,删除状态判断代码,主体不同,可能会有所差异,粗略贴一下:  看起来相当费解,我还是贴一下我最后修改的代码吧!仅供参考: 针对问题③,需要在发送邮件时先做一个判断,由于缓存无法取得用户登陆状态,所以我使用邮箱来判断是否发送: 如果评论者邮箱是博主自己的邮箱,则不发送邮件!由于每个主题的情况都不一样,所以这个方法只能参考,而无法通用!如果,你的博客用了代码版的SMTP功能,那么就可以使用这个方法! 更多相关问题请看续篇教程:          ①、启用WP Super Cache纯代码版本之后的一些优化措施          ②、php平滑重启nginx,彻底清除WordPress的静态缓存 五、写到最后 这篇文章是在我一边测试、一边记录的情况下完成的!本以为会很简单,结果状况百出,问题接踵而来!结果,此教程也变得异常复杂难懂!!!(写得比较匆忙,后续将持续更新发现的问题) 所以,在本文最后,张戈温馨提醒一下: 如果你博客用了多说,如果你博客没有什么已登录状态的判断代码,那么这个方法会比较简单! 如果你比较会折腾代码,也看懂了本文,那么这个方法依然适合你! 如果你不懂代码,而且还不容易接受新事物,那么请不要轻易去尝试本文分享的方法,否则也真是醉了。。。 早知道这么麻烦,我还是继续用WP...
阅读全文
网站建设

WordPress前端html代码压缩优化,附对应知更鸟主题压缩报错的解决方案

今天,逛松果博客的时候,看到了他分享的《wordpress通过代码压缩网页》一文,让我想起了其实张戈博客之前也用过这个功能,当时是在WP迷博客看到的纯代码版本,用了之后发现和知更鸟主题会产生冲突,比如底部滚动条停止滚动、图片暗箱无法弹出等错误。 再次看到这篇文章,我已经将WP玩得比较熟了,想着应该可以搞定这种问题吧?折腾ing... 一、压缩产生乱码 于是,我复制了松果博客的代码,部署后发现前台惨不忍睹: 纳尼?我记得以前用代码版的时候也不会出现这种情况啊!于是到WP迷博客找来代码,和松果博客的对比了下,我去这错误太明显了! 松果博客分享的代码中的关键替换位置如下所示: 而正确的代码应该是: 少了反斜杠之后的n、t、r意义完全不同了!有反斜杠表示换行和tab空格等,如果没有反斜杠那就是单纯的字母了,不乱才怪了! 二、部署功能代码 所以,正确的压缩代码如下所示(强迫症又发作了,代码严格缩进了下): 部署方法:将以上代码粘贴到WordPress主题目录下的functions.php文件的最后一个 ?> 之前即可。 Ps:使用知更鸟主题的博客,需要将以上代码稍微改动一下,否则首页不会被压缩,已亲测! 修改方法: 将上述代码中的最后三行: 修改为: 也就是将 get_header 动作修改为全局init,然后再加上排除WP后台的判断,否则后台写文章就惨不忍睹了...(这样修改后,压缩生效的范围更大,若不出错,建议用修改后的代码!) 三、绕过压缩注释 然后,本文的重点来了: 关于在页面位置加上避免压缩的注释,很多教程都是错的!亲测无效! 网络上很多教程,包括松果博客、WP酷以及WP迷,他们都是这样描述的: 实际上,我测试了半天都不能生效!仔仔细细检查代码中的逻辑判断,终于推敲出正确的注释如下: 只有这样包裹代码,被包裹的代码才不会被压缩,网上分享的大部分方法都是无效的。 顺带再说一个技巧,如果博客使用了Crayon Syntax Highlighter高亮插件,那么启用代码压缩之后,你会发现在文章页面双击代码切换到纯文本模式时,会发现代码全挤在一团了!好吧,全都给压缩了,尴尬中... 解决办法: 将以下代码加入到主题functions.php当中,当检测到文章内容中有代码标签时,文章内容不会被压缩: 四、知更鸟专用 搞定了绕过压缩问题,那压缩代码后知更鸟的各种错误也就好解决了,折腾了半小时,就把所有错误给解决了!下面分享一下,主要给旧版知更鸟主题的博主提供参考。 ①、head部分,需要绕过压缩的是time.php(时间模块)和pirobox.php(图片暗箱)中的js代码: i. 编辑知更鸟主题下的includes中的time.php,参考下图添加注释: ii. 编辑知更鸟主题下的includes中的pirobox.php,参考下图添加注释: ②、侧边栏部分,需要绕过压缩的是侧边栏TAB滑动模块和跟随模块中的js代码 i. 编辑知更鸟主题下的includes目录中的tab.php和tab_h.php,参考下图加注释: ii. 编辑知更鸟主题下的includes目录中的recently.php,参考下图添加注释: ③、当未搜索到内容时的搜索结果页面,底部的js代码需要绕过压缩,否则展开功能无法使用: 解决办法:修改知更鸟主题目录下的search.php文件,如下添加免压缩注释请: 完成以上步骤,知更鸟主题的博客应该可以修复因为html代码压缩带来的错误了!在添加注释的时候,一定注意前后代码是不同的,切记不要颠倒顺序了,否则压缩范围就南辕北辙了哦! 当然,也可能有些知更鸟主题博客,安装了其他插件,压缩代码后会导致更多错误,若遇到这种情况,也不要着急!你只要记住修复这种问题的思路就是:哪个功能失效,就去找对应功能所在的代码,然后添加免压缩注释即可!一般都是JS代码被压缩,产生的报错。 2014/12/9最新补充,经过长期观察,发现js压缩报错无外乎2种情况: ①、js代码的作者偷懒,简写了某些语句。比如js的if结构一般是: 可有些人写js的时候,不知道是自视高超还是偷懒,就写成如下形式: 这种偷懒格式,一旦压缩,就会破坏逻辑判断从而报错!如果压缩报错,并发现这种偷懒模式,只要写全代码即可。 ②、js代码中存在//注释语句,比如:  这种代码,一旦压缩就会变成这样: 由于这个注释是半闭合的,因此压缩后就会伤及无辜,把后面的语句一起给注释了!从而报错!! 解决办法有2种: i. 删除半闭合注释即可; ii. 使用/* */ 全封闭注释 ; 2015/06/17 最新补充:解决压缩功能和代码高亮冲突的问题 用了此压缩功能后,肯定有部分同学发现博客的代码高亮排版都错乱了!因为压缩功能把文章中的高亮代码也给压缩了!我们该如何绕过这个压缩呢?总不能对所有文章都加入免压缩的注释吧?那压缩覆盖面就大大的减小了! 其实,我们可以这样解决:对于存在高亮代码的文章,则自动在文章内容的首尾插入免压缩的注释。 功能实现:将如下代码加入到主题的functions.php当中即可: 本文主要为了修正网络上对WordPress前端HTML代码压缩优化方法中的错误,以及知更鸟主题下的兼容修复方法。我个人也是非常喜欢这个压缩功能,尤其是对知更鸟这种页面内容庞大的主题,更是效果显著!如果你也有强迫症,如果你也喜欢压榨WordPress性能,那么我也推荐你来试试!
阅读全文
网站建设

解决启用wp super cache缓存后,页面追加多个斜杠仍然可以访问的隐患

昨天一哥们在博客留言告知,启用缓存后,html文章页面带上斜杠也还可以访问,试了下还真是这样。 其实,想想也是,wp-super-cache生成的文章缓存本身是以【%post_id%.html/index.html】形式存在的: 和目录形式一摸一样,那么加上斜杠后就相当于访问的是 http://****/1234.html/index.html,自然毫无问题。 那么按照这个哥们的想法,访问2个不同的页面,出现的确实一样的效果,那么自然会想到对SEO不太友好,会不会出现重复收录的问题。我觉得搜索引擎虽然偶尔会出现这种脑残收录,不过几率应该不大,除非你到处留了带斜杠结尾的内、外链,让蜘蛛爬到了。 正好,我也是一个完美主义,这种事还是要动手解决解决的。 针对html页面,追加一个斜杠还可以访问的情况,我在nginx里面新增如下规则即可搞定: 额外补充一下apache的规则(未作测试,凭经验写的,有需求的自己调试吧!): 现在再遇到往html后面添加一个斜杠的情况,就会自动301跳到不带斜杠的html页面,本以为问题解决了,没想到这哥们又说了,带N个斜杠还是可以访问,也不会跳转! 我次奥,还真是!试了一下别人的网站,比如卢松松的留言板,多加几个斜杠同样是可以访问的,既然他的网站SEO无碍,我们也就没什么好担心的了! 不过,我还是试了一下写相应的匹配规则,无奈正则匹配了半天多斜杠形式都没效果,最后我想到了另一个解决办法,那就是利用robots禁止搜索引擎抓取这种形式的路径,规则如下:   哦了,相信这样就可以解决追加斜杠仍然可以访问带来的SEO隐患了! 最新补充:偶然在日志发现蜘蛛居然经常爬https://zhang.ge/about/22222244445555这种链接,明明不存在,但又确实可以访问!只要继续新增nginx规则如下: 搞不懂蜘蛛是怎么想,反正挺坑爹!
阅读全文