北极寒流 » 网络资源 » WordPress记住评论用户信息的js版本,直接操作cookie无视缓存,解决WP Super Cache不缓存留言用户 - 2016.10.02

WordPress记住评论用户信息的js版本,直接操作cookie无视缓存,解决WP Super Cache不缓存留言用户

WP Super Cache默认情况下是不会对网站留过言的用户缓存的,因为在WP Super Cache看来,留过言的用户就是已知用户了,WP Super Cache的默认设置是推荐对已知用户不缓存的,当然我们也可以修改设置让WP Super Cache对已知用户缓存,但这样的结果就是无论你是网站站长还是留言用户看到的页面都是缓存过的,给网站的管理带来一些麻烦。

既要对留言用户缓存,又要不缓存网站的登陆用户(管理员),我能想到的办法就是让WP Super Cache读取不到留言用户的信息,然后自然WP Super Cache就会无视用户是否留言都缓存页面了。

由于本站采用的是ajax评论,所以我先在ajax评论代码中把默认保存用户信息的代码注释掉。然后采用JS记住评论用户信息。

找到main.php中的

     $user = wp_get_current_user();
     do_action('set_comment_cookies', $comment, $user);

把这两行代码注释掉ajax评论就不会保存用户信息了,然后用户每次评论都要再输入一遍用户信息。如果只是这样显得不够友好了。

下面我们就利用JS来记住用户信息,只要用户认真提交过一次评论,那么下次再来访问任意页面,将会自动填写评论用户信息。

上JS代码(注意其中的domain=后面的域名要换成你自己的)

//设置Cookie
function SetCookie(sName, sValue,iExpireDays) {
    if (iExpireDays){
        var dExpire = new Date();
        dExpire.setTime(dExpire.getTime()+parseInt(iExpireDays*24*60*60*1000));
        document.cookie = sName + "=" + escape(sValue) + "; expires=" + dExpire.toGMTString()+ "; path=/;domain=.zhangge.net";
    }
    else{
        document.cookie = sName + "=" + escape(sValue)+ "; path=/;domain=.zhangge.net";
    }
}
// 目的:    返回Cookie
function GetCookie(sName) {
    var arr = document.cookie.match(new RegExp("(^| )"+sName+"=([^;]*)(;|$)"));
    if(arr !=null){return unescape(arr[2])};
    return null;

}
//加载用户信息
function LoadRememberInfo() {
    var strName=GetCookie("author");
    var strEmail=GetCookie("email");
    var strHomePage=GetCookie("url");
    var bolRemember=GetCookie("chkRemember");
    var a_vlaue= document.getElementById("author");
    if (a_vlaue != null){
        if(bolRemember=="true"){
                    //通过decodeURIComponent对内容解码
            if(strName){document.getElementById("author").value=decodeURIComponent(strName);};
            if(strEmail){document.getElementById("email").value=strEmail;};
                     //通过decodeURIComponent对内容解码
            if(strHomePage){document.getElementById("url").value=decodeURIComponent(strHomePage);};
            if(bolRemember){document.getElementById("saveme").checked=bolRemember;};
        }

        if(GetCookie("username")){
            document.getElementById("author").value=unescape(GetCookie("username"));
        }
    }   
}
//通过jQuery ready在页面加载时自动从cookies中载入已保存的用户信息
jQuery(document).ready(function($){
       LoadRememberInfo();
//给评论提交按钮绑定信息保存函数
    $("#respond #submit").click(function(){
       SaveRememberInfo();
    });
//给评论重置按钮绑定信息移除函数
    $("#respond #reset").click(function(){
        RemoveRememberInfo();
    });
});
//保存信息函数
function SaveRememberInfo() {
    var strName=document.getElementById("author").value;
    var strEmail=document.getElementById("email").value;
    var strHomePage=document.getElementById("url").value;
    var bolRemember=document.getElementById("saveme").checked;
        //通过encodeURIComponent对内容进行url编码
    SetCookie("author",encodeURIComponent(strName),365);
    SetCookie("email",strEmail,365);
        //通过encodeURIComponent对内容进行url编码
    SetCookie("url",encodeURIComponent(strHomePage),365);
    SetCookie("chkRemember",bolRemember,365);

}
//移除信息函数
function RemoveRememberInfo() {
    SetCookie("author",'',365);
    SetCookie("email",'',365);
    SetCookie("url",'',365);
    SetCookie("chkRemember",'false',365);
}

把上述代码保存为 saveinfo.js ,然后引入到前台,最后编辑主题的comments.php文件,找到提交留言的按钮代码,在合适的位置添加勾选框。

<input type="checkbox" id="saveme" value="saveme" checked="checked" style="margin-left:20px;" /><label for="comment_mail_notify">记住我,下次回复时无需重新输入个人信息</label>

大概位置如下

....以上省略....

<div class="submitted">

<input class="submit" name="submit" type="submit" id="submit" tabindex="5" value="提交留言" />

<input class="reset" name="reset" type="reset" id="reset" tabindex="6" value="<?php esc_attr_e( '重写' ); ?>"/>

<?php comment_id_fields(); ?>

<input type="checkbox" id="saveme" value="saveme" checked="checked" style="margin-left:20px;" /><label for="comment_mail_notify">记住我,下次回复时无需重新输入个人信息</label></p>

</div>

...以下省略...

或者你也可以直接在functions.php中挂载

//自动加勾选栏
function add_checkbox() {
  echo '<input type="checkbox" id="saveme" value="saveme" checked="checked" style="margin-left:20px;" /><label for="comment_mail_notify">记住我的用户信息</label>';
}
add_action('comment_form', 'add_checkbox');

现在,网站可以放心的开启前台整站CDN加速或者WP Super Cache了,用户只要认真提交过一次评论,那么下次再来访问任意页面,将会自动填写评论用户信息。并且也不存在WP Super Cache不缓存留言用户的烦恼。

四、注意事项

①、使用前请务必正确修改js代码中的domian值,否则无法操作cookies;

②、如果你了解js,可以将js代码与网站的其他js合并,减少页面的js请求,比如与comments-ajax.js合并;

③、已记住的网站,如需修改更新用户信息,只需输入新的信息,重新提交一次即可刷新cookie;

④、如果评论框中存在重置(id为reset)的按钮,那么只要点击重置就能清除已保存的用户信息;

⑤、该功能只在用户电脑本地生效,不会带来任何安全隐私及隐患;

⑥、以上js只对WordPress生效,其他建站程序可以通过修改代码中的ID名称即可生效。

cookie保存信息失败,要检查是否是因为标签的ID冲突原因。

资料来源:https://zhangge.net/4684.html

02

WordPress记住评论用户信息的js版本,直接操作cookie无视缓存,解决WP Super Cache不缓存留言用户

分享到:

最受欢迎的