TypeCodes

再谈wordpress评论验证码——Willin Kan大神开的一个“玩笑”

(一)问题描述

最近在筹划博客的新主题中,遇到了一个问题,那就是在调用先前vfhky写的《博客优化第二波(三):wordpress评论添加算术验证码》文中的spam_provent_math函数时,如果用户错误的输入了验证码,那么在提交的时候网页就会变形。昨天,来哥在用这段代码的时候也提到了 页面框架变形的问题 ,所以觉得有必要把解决方案提出来,免得误导了大家。

网上查找了资料,大多说是因为在提交评论的时候,由于调用ajax评论JS代码导致在输出错误提示的时候评论页面变形(一般的wp主题评论都回调用的Willin Kan编写的jQuery-Ajax-Comments v1.3),这该不会是Willin大神故意开玩笑吧???

wordpress评论框变形

(二)网络解决方法

那么,我们找到 comments-ajax.js 中的第43-47行:

1
2
3
4
5
error: function(request) {
  $('#loading').slideUp();
  $('#error').slideDown().html('<img src="' + pic_no + '" style="vertical-align:middle;" alt=""/> ' + request.responseText);
  setTimeout(function() {$submit.attr('disabled', false).fadeTo('slow', 1); $('#error').slideUp();}, 3000);
}

这段代码也就是在出现error的时候执行的语句,也就是wordpress评论框变形的“罪魁祸首”!网上的解决方法是:在第45行的代码后面添加正则表达式,过滤掉上面代码产生的常见的html标签代码,具体如下

$('#error').slideDown().html('<img src="' + pic_no + '" style="vertical-align:middle;" alt=""/> ' + request.responseText.replace(/< (?!p).*?>(?:.*?< \/.*?>)?/gi,''));
(三)遗留问题

但是经过vfhky的测试,改进后的代码虽然避免了wordpress评论页面的变形,但是会输出很多浏览器无法解析的源代码,图就不贴出来了,大家可以自己测试一下。没办法,博主就小小研究了下comments-ajax.php,发现里面的出错提示语句用的是

err(__('Sorry, comments are closed for this item.'));

而不是用常规的echo函数输出,所以我把spam_provent_pre($spam_result)函数中的 两个we_die函数全都替换成err 。修改后,vfhky进行了测试,结果显示即使用户错误的输入验证码也不会使评论框页面变形了,它会像用户没有输入邮箱号码而直接提交评论那样在评论框的底部以温馨的小字提示用户应该输入正确的验证码!

(四)结语

看来bug只能是偶们这小菜鸟产生的,膜拜Willin Kan大神啦!

打赏支持

Comments »