Browse: Home / , / WP:2.9中实现评论使用QQ头像

WP:2.9中实现评论使用QQ头像

By 砼砼 on 2010年01月03日

这篇日志主要是简单的演示下在wordpress 2.9+中，对于新的表的使用

主要实现的功能：在评论中支持使用QQ头像～

主程序：wordpress 2.9

主题：hybrid 0.7框架 子主题是我自己弄的一个支持AJAX评论的的主题

这是一篇WP 2.9+的档案，这只是一个简单的演示，只是给大家提供一些思路，在代码的上修改的余地很大（毕竟我自己都觉得代码不够精炼），欢迎演绎或者提供更好的想法。

当然，欢迎拍砖～

正文

准备工作

首先麻花腾提供了一个接口，可以通过http://face7.qun.qq.com/cgi/svr/face/getface?&uin=QQ号码 这样一个地址获得当前QQ的JPG格式图片头像，这位我们实现这个功能提供了前提。

首先，要做的是获取用户的QQ号，这里有两种情况

  1. 注册用户的资料，只能有用户在后台自己更新
  2. 游客的资料，我选择的是在发表评论的时候，填入

OK，在用户填写了足够的信息，并且用户把数据POST过来我们就可以拿到QQ号了。

由于是远程调用，所以，我们还要对QQ进行一些加密的操作，以保护隐私。

嗯嗯，思路大概就是这个样子的了，下面看看代码实现。

step by step

请注意看代码中的注释，我相信这些代码不难理解

打开主题的functions.php文件

首先，是对注册用户的信息添加，使用下面这段代码让我们在http://tossp.com/wp-admin/profile.php中添加一个BOX，用于获取注册用户的QQ号

<?php
/**
*HOOK两个函数：
*imt_show_extra_profile_fields
*用于显示扩展信息的BOX
*
*imt_save_extra_profile_fields
*用于保存我们的扩展信息
*/
add_action( 'show_user_profile', 'imt_show_extra_profile_fields' );
add_action( 'edit_user_profile', 'imt_show_extra_profile_fields' );
add_action( 'personal_options_update', 'imt_save_extra_profile_fields' );
add_action( 'edit_user_profile_update', 'imt_save_extra_profile_fields' );


function imt_show_extra_profile_fields( $user ) { ?>

    <h3>扩展配置信息（仅被当前主题支持）</h3>

    <table class="form-table">

        <tr>
            <th><label for="imtqq">腾讯QQ</label></th>

            <td>
                <input type="text" name="imtqq" id="imtqq" value="<?php echo esc_attr( get_the_author_meta( 'imtqq', $user-/>ID ) ); ?>" class="regular-text" /><br />
                <span class="description">请输入你的腾讯QQ号码（纯数字）</span>
            </td>
        </tr>

    </table>
<?php }

function imt_save_extra_profile_fields( $user_id ) {
    $imt_user_qq=trim($_POST['imtqq']);
    if ( !current_user_can( 'edit_user', $user_id ) )
        return false;
    if(ereg("^[1-9][0-9]{4,}$",$imt_user_qq))
    //对POST数据进行校验，必须是一个5位以上的数字
    {
        update_usermeta( $user_id, 'imtqq', $imt_user_qq );
    }else{
        //否则保存用户QQ为10000
        update_usermeta( $user_id, 'imtqq', '10000' );}
   
}?>

对WP默认的头像进行替换，并不修改用户既定的DIV结构。

<?php
/**
*HOOK get_avatar，对WP默认的头像进行替换，并不修改用户既定的DIV结构
*
*/
add_filter('get_avatar', 'imt_qq_face', 10, 3);

function imt_qq_face($a, $i, $size) {

    $key = "im-t.net";
    //这里设置关键密钥必须和qqface.php文件的密钥相同
   
    $imt_get_qq_face = 'http://tossp.com/qqface.php?&qq=%s';
    //加密的QQ获取头像地址, %s表示QQ号
        //这里替换成你的qqface.php文件地址，没用有函数而是全部写死的
   
    $qq_face_size = false;
    //单独指定QQ头像的大小, false or integer
   
    $qq=get_comment_meta($i->comment_ID, 'imtqq', true);
    //这个是WP2.9的新函数，用于获取comment的扩展信息。
   
    if ( !is_object($i) )
        return $a;
    if ( ''!=$qq && '10000'!=$qq) {
   
        $qq = base64_encode(encrypt($qq,$key));
        //这里是对QQ号码进行加密，以免在传递URL参数的过程中泄露用户隐私
        //毕竟有隐私保护显的咱专业一点儿是不？
       
        $a = preg_replace('/src=\'[^\']*\'/',
            'src=\'' . str_replace('%s', $qq, $imt_get_qq_face) . '\'',
            $a);
        if( $qq_face_size )
            $a = str_replace('\'' . $size . '\'', '\'' . $qq_face_size . '\'', $a);
        return $a;
    }
    return $a;
}?>

最后加入相应的加密函数：

<?php
/**
*这段加密函数是在网上找的，当然你可以换成你自己的函数
*/
function encrypt($txt,$key){//加密
    srand((double)microtime()*1000000);
    $encrypt_key = md5(rand(0,32000));
    $ctr=0;
    $tmp = "";
    for ($i=0;$i<strlen($txt);$i++){
        if ($ctr==strlen($encrypt_key)) $ctr=0;
        $tmp.= substr($encrypt_key,$ctr,1) .
        (substr($txt,$i,1) ^ substr($encrypt_key,$ctr,1));
        $ctr++;
    }
    return keyED($tmp,$key);
}

function keyED($txt,$encrypt_key){//动态密钥生成
    $encrypt_key = md5($encrypt_key);
    $ctr=0;
    $tmp = "";
    for ($i=0;$i<strlen($txt);$i++){
      if ($ctr==strlen($encrypt_key)) $ctr=0;
      $tmp.= substr($txt,$i,1) ^ substr($encrypt_key,$ctr,1);
      $ctr++;
    }
    return $tmp;
}
?>

对于hybrid主题框架的用户，这样改是不够的，还要重写hybrid_avatar：

<?php
remove_action( 'hybrid_before_comment', 'hybrid_avatar' );

add_action( 'hybrid_before_comment', 'imt_avatar' );

function imt_avatar() {
    global $comment, $hybrid;

    if ( !get_option( 'show_avatars' ) )
        return false;

    /* Get/set some comment variables. */
    $comment_type = get_comment_type();
    $author = esc_html( get_comment_author() );
    $url = esc_url( get_comment_author_url() );

    if ( 'pingback' == $comment_type || 'trackback' == $comment_type )
        $default_avatar = THEME_IMAGES . "/{$comment_type}.png";

    $default_avatar = apply_filters( "{$hybrid->prefix}_{$comment_type}_avatar", $default_avatar );

    $avatar = get_avatar( get_comment_author_email(), '80', $default_avatar, $author );
   
    $avatar = imt_qq_face($avatar, get_comment(get_comment_ID()), '80');

    /* If URL input, wrap avatar in hyperlink. */
    if ( $url )
        $avatar = '<a href="' . $url . '" rel="external nofollow" title="' . $author . '">' . $avatar . '</a>';

    echo apply_filters( 'imt_avatar', $avatar );
}
?>

打开comment-form.php文件（这个是hybrid0.7才有的），修改你的评论提交表，或者修改你对应位置的代码

先把这个文件从hybrid复制到你子主题里面，找到：

<p class="form-url">
    <label for="url"><?php _e( 'Website', 'hybrid' ); ?></label>
    <input type="text" class="text-input" name="url" id="url" value="<?php echo esc_url( $comment_author_url ); ?/>" size="40" tabindex="3" />
</p><!-- .form-url -->

修改为：

<p class="form-url">
    <label for="url"><?php _e( 'Website', 'hybrid' ); ?></label>
    <input type="text" class="text-input" name="url" id="url" value="<?php echo esc_url( $comment_author_url ); ?/>" size="40" tabindex="3" />
</p><!-- .form-url -->

<!--其实就是添加了一下代码-->

<p class="form-imtqq">
    <label for="imtqq"><?php _e( '腾讯QQ', 'hybrid' ); ?></label>
    <input type="text" class="text-input" name="imtqq" id="imtqq" value="<?php echo esc_attr( $comment_author_imtqq ); ?/>" size="40" tabindex="4" />
</p><!-- .form-imtqq -->

OK，以上就已经获取到了评论用户的QQ，并添加了一些必须的函数

打开主题的comments-ajax.php文件，这个文件是用于支持AJAX评论的服务端文件，这里我们一样要修改他的数据获取

这个文件也许你的主题没有也许和我的不一样，那就只能是参照这修改你blog更目录下wp-comments-post.php文件（这个方式是不推荐的），或者想办法HOOK他这个我还没具体看过。如果你用HOOK实现了请告诉我。

我们从获取游客的qq开始，找到：

<?php
$comment_author       = trim(strip_tags($_POST['author']));
$comment_author_email = trim($_POST['email']);
$comment_author_url   = trim($_POST['url']);
$comment_content      = trim($_POST['comment']);
?>

修改为：

<?php
$comment_author       = trim(strip_tags($_POST['author']));
$comment_author_email = trim($_POST['email']);
$comment_author_url   = trim($_POST['url']);
$comment_content      = trim($_POST['comment']);
$comment_author_imtqq = trim($_POST['imtqq']);
//添加的是这后这行，获取游客的QQ
?>

接下来我们获取注册用户的QQ，找到：

<?php
$comment_author       = $wpdb->escape($user->display_name);
$comment_author_email = $wpdb->escape($user->user_email);
$comment_author_url   = $wpdb->escape($user->user_url);
?>

修改为：

<?php
$comment_author       = $wpdb->escape($user->display_name);
$comment_author_email = $wpdb->escape($user->user_email);
$comment_author_url   = $wpdb->escape($user->user_url);
$comment_author_imtqq = get_usermeta(  $user->ID , 'imtqq' );
//添加的是这后这行，获取注册用户的QQ
?>

校验用户的QQ信息，找到：

<?php
if ( '' == $comment_content )
    fail('错误: 请填写评论内容');
?>

修改为：

<?php
if ( '' == $comment_content )
    fail('错误: 请填写评论内容');
   
if ( ''!=$comment_author_imtqq && !ereg("^[1-9][0-9]{4,}$",$comment_author_imtqq))
    fail('错误: QQ号码应该为大于5位的数字（'.$comment_author_imtqq.'）');
?>

添加评论的扩展信息找到：

<?php
$comment = get_comment($comment_id);
?>

修改为：

<?php
$comment = get_comment($comment_id);

if ( ''!=$comment_author_imtqq){
    update_comment_meta($comment->comment_ID, 'imtqq', $comment_author_imtqq);
}
//添加评论扩展信息
?>

最后设置cookie，找到：

<?php
setcookie('comment_author_' . COOKIEHASH, $comment->comment_author, time() + 30000000, COOKIEPATH, COOKIE_DOMAIN);
setcookie('comment_author_email_' . COOKIEHASH, $comment->comment_author_email, time() + 30000000, COOKIEPATH, COOKIE_DOMAIN);
setcookie('comment_author_url_' . COOKIEHASH, clean_url($comment->comment_author_url), time() + 30000000, COOKIEPATH, COOKIE_DOMAIN);
?>

修改为：

<?php
setcookie('comment_author_' . COOKIEHASH, $comment->comment_author, time() + 30000000, COOKIEPATH, COOKIE_DOMAIN);
setcookie('comment_author_email_' . COOKIEHASH, $comment->comment_author_email, time() + 30000000, COOKIEPATH, COOKIE_DOMAIN);
setcookie('comment_author_url_' . COOKIEHASH, clean_url($comment->comment_author_url), time() + 30000000, COOKIEPATH, COOKIE_DOMAIN);
setcookie('comment_author_imtqq_' . COOKIEHASH, get_comment_meta($comment->comment_ID, 'imt_qq' ,true), time() + 30000000, COOKIEPATH, COOKIE_DOMAIN);
//设置cookie的评论扩展信息
?>

你在blog的根目录上添加一个qqface.php文件，代码如下，用于访问远程文件

<?php
/**
*腾讯QQ头像获取文件
*为了避免在远程获取QQ头像的过程中泄漏用户隐私，
*所以进行一个简单的加密。
*/

$key = "im-t.net";
//这里设置关键密钥必须和functions.php文件的密钥相同

$qq_nomber   = trim($_GET['qq']);
$qq_nomber   = decrypt(base64_decode($qq_nomber),$key);
//解密QQ号

if(ereg("^[1-9][0-9]{4,}$",$qq_nomber)){//这个主要是防止无聊的测试
        $qq_nomber=$qq_nomber;
    }else{
        $qq_nomber='10000';
}

$qq_face_url = 'http://face7.qun.qq.com/cgi/svr/face/getface?&uin='.$qq_nomber;

$data = file_get_contents($qq_face_url);
header('content-type:image/jpeg');
echo $data;


function keyED($txt,$encrypt_key){//密钥生成函数
    $encrypt_key = md5($encrypt_key);
    $ctr=0;
    $tmp = "";
    for ($i=0;$i<strlen($txt);$i++){
      if ($ctr==strlen($encrypt_key)) $ctr=0;
      $tmp.= substr($txt,$i,1) ^ substr($encrypt_key,$ctr,1);
      $ctr++;
    }
    return $tmp;
}

function decrypt($txt,$key){//解密函数
    $txt = keyED($txt,$key);
    $tmp = "";
    for ($i=0;$i<strlen($txt);$i++){
        $md5 = substr($txt,$i,1);
        $i++;
        $tmp.= (substr($txt,$i,1) ^ $md5);
    }
    return $tmp;
}
?>

现在就大功告成了，呼呼，

大概就是这样子了，欢迎指正拍砖～

最后必须要说，这仅仅是一个演示，希望可以抛砖引玉～

收藏&分享:
  • Print
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Google Bookmarks
  • email
  • Haohao
  • MisterWong
  • PDF
  • Ping.fm
  • QQ书签
  • RSS
  • StumbleUpon
  • Twitter
  • 豆瓣
  • 豆瓣九点

Posted in , | Tagged , , , | 32 Responses

Burn after reading » Now you're done reading. What's next?

砼砼

小时候,一直以为自己的咪咪是蚊子叮的,每天洗完澡以后就拿着盒万金油在搽,希望它可以早日康复,直到念大班的时候偶放弃类

相关日志

日志信息

如需转载烦请添加以下信息: 本文内容转载自砼砼's blog[http://TossP.com].
如喜欢这篇文章或者本站,建议您RSS订阅本站,以及时地获取更多精彩内容!

可以通过订阅Comments RSS 2.0 feed，一直不断的跟踪这篇日志的的评论~
欢迎您点击发表评论参与这篇日志的讨论，如果您需要引用或者转载此文，请确保让我知道，并建议使用trackback将转载信息通知到本页面。

32 responses to “WP:2.9中实现评论使用QQ头像”

  1. 小T
    小T
    2010年01月04日 at 21:30 |

    我的貌似QQ和现在用的头像是一样的看不出差别，这篇折腾的不错

    Notify
  2. 小T
    小T
    2010年01月04日 at 21:30 |

    看来有效果

    Notify
  3. derek
    derek
    2010年01月04日 at 22:17 |

    @砼砼:是偶看不懂代码.................

    Notify
  4. 网络砖家
    网络砖家
    2010年01月05日 at 01:53 |

    哈，代码一大串的。。。

    Notify
  5. 网络砖家
    网络砖家
    2010年01月05日 at 01:53 |

    不错，果然出现了我的QQ头像。。。

    Notify
  6. 先看看
    先看看
    2010年01月05日 at 10:37 |

    我还没有升级呢，哈哈

    Notify
  7. 聪壹艮
    聪壹艮
    2010年01月05日 at 23:26 |

    怎一个复杂了得

    Notify
  8. cxy152376
    cxy152376
    2010年01月06日 at 19:23 |

    WP中文論壇上那個QQ頭像插件最初是我隨手寫的, 貌似你參考了它, 嗯?

    虧你想得出服務器讀取QQ頭像以避免泄露QQ號碼- -. 不過原始的QQ頭像地址畢竟不是騰訊正式發布的API, 隨時可能失效, 所以意義總歸不大XD.

    Notify
  9. 砼砼
    砼砼
    2010年01月08日 at 02:58 |

    @cxy152376:那段代码确实是参考的，是你写的？谢谢提供，其实这篇日志的重点不是QQ头像，重点是在2.9中一些新东西的应用，呵呵就和我所强调的一样，这只是一个演示

    Notify
  10. 江海志
    江海志
    2010年03月01日 at 04:34 |

    支持了

    Notify
  11. 砼砼
    砼砼
    2010年03月02日 at 00:31 |

    @江海志:谢谢

    Notify
  12. 网易游戏
    网易游戏
    2010年03月30日 at 13:55 |

    我的个神，你太”油菜“了，学习了，哈哈

    Notify
  13. 砼砼
    砼砼
    2010年03月30日 at 19:39 |

    @网易游戏:谢谢

    Notify
  14. Flingyue
    Flingyue
    2010年04月04日 at 16:53 |

    折腾有理啊：） 牛X

    Notify
  15. 砼砼
    砼砼
    2010年04月05日 at 21:04 |

    @Flingyue:折腾快乐～

    Notify
1 2 3

Leave a Reply