国内使用Gravatar的用户很少,所以很多邮箱根本没有注册Gravatar,所以也就没有头像,而国内主流的还是以QQ邮箱为主,今天主要记录将typecho的评论进行邮箱识别,QQ邮箱则调用QQ头像,否则调用Gravatar头像,同时基于Gravatar的访问速度,采用Gravatar头像的国内源,也就是经常上的V2EX网站的源。

1、准备工作

首先准备两个接口,一个是QQ头像的,一个是Gravatar国内源,它们的调用方式如下。

QQ头像 http://q1.qlogo.cn/g?b=qq&nk=QQ号&s=100

Gravatar头像 http://cdn.v2ex.com/gravatar/md5加密后的邮箱?s=100

以上就是两个头像接口的信息,值得注意的是Gravatar后面的s分辨率参数可以随意定义,而QQ不行,QQ只有几个有限的分辨率,比如100,200,640,其它的数字会报400错误,所以QQ的s参数更像是一种清晰度,宽高还是通过css定义比较好。

2.实现的主要方法

模板function.php里面定义,这等于完全舍弃系统的邮箱输出方法。

/* 对邮箱类型判定,并调用QQ头像的实现 /
function isqq($email){
    if($email){
        if(strpos($email,"@qq.com") !==false){
            $email=str_replace('@qq.com','',$email);
            echo "//q1.qlogo.cn/g?b=qq&nk=".$email."&";
        }else{
            $email= md5($email);
            echo "//cdn.v2ex.com/gravatar/".$email."?";
        }
    }else{
    echo "//cdn.v2ex.com/gravatar/null?";
    }
}

上述代码就是通过isqq方法获取邮箱,并且判断是否为qq邮箱,是则截取qq的部分去和qq的接口组合,不是则md5加密该邮箱和gravatar头像库组合,而s的参数则是用户可以自己在模板里面控制的,所以这里省略。

3.调用方式

也就是头像链接在不同模板中的调用方式。

文章列表及内容页作者头像

<?php isqq($this->author->mail); ?>s=100

评论列表用户头像

<?php isqq($comments->mail); ?>s=100

当前登录用户头像

<?php isqq($this->user->mail); ?>s=100

4.后台的调用方式简要说明和实现方法。

可以参考我的会员中心项目:typecho多用户会员中心功能实现,附项目源码

具体的方式很简单,在一个全局文件,比如admin/header.php,定义一个头像的字段,直接在这个字段对头像进行处理,代码如下。

<script>
var UserPic="<?php $email =$user->mail; if($email){if(strpos($email,'@qq.com') !==false){$email=str_replace('@qq.com','',$email);echo '//q1.qlogo.cn/g?b=qq&nk='.$email.'&';}else{$email= md5($email);echo '//cdn.v2ex.com/gravatar/'.$email.'?';}}else{echo '//cdn.v2ex.com/gravatar/null?';} ?>";
</script>

得到了字段UserPic就简单了,可以在用户个人设置,或者判断页面是否为个人设置页面之后,找到个人设置页面那个头像的img标签的class,在js里面这样写。

var avatar=getElementsClass("profile-avatar")[0];
avatar.setAttribute("src",UserPic+"s=640");
avatar.style.width="220px";

这样,就可以将原本的图片强制变为处理后的图片,而且宽度和原来的一样是220px。

实际效果可以访问规则之树会员中心看看

然后,也可以评论这篇文章试试我博客QQ头像的调用效果。(来源:不暇