一只特立独行的猪 烽火戏诸侯
烽火戏诸侯
  • 主页
  • web开发
  • 博客笔记
  • 软件工具
  • 随笔杂谈
  • 文章归档
  • 影音欣赏
  • 我的资源
  • 关于我
  • wechat_fill

emlog评论添加一键获取QQ昵称和头像教程（附代码）

  • 2017-03-09
  • Web开发
  • 评论(6) 
<br />

先放出方法一：转自http://wemcc.com/bk/43.html

首先在module.php里面加以下代码： 


<?php //获取QQ信息
function getqqtx($qq){
    $url="http://q.qlogo.cn/headimg_dl?bs=qq&amp;dst_uin=$qq&amp;src_uin=qq.feixue.me&amp;fid=blog&amp;spec=100";
    return $url;}
    if(isset($_POST['qq'])){
    $spurl = "http://r.pengyou.com/fcg-bin/cgi_get_portrait.fcg?uins={$_POST['qq']}";
    $data = file_get_contents($spurl);
    $nc=explode('"',$data);
    $s=$nc[5];
    $bm=mb_convert_encoding($s,'UTF-8','UTF-8,GBK,GB2312,BIG5');
    if(empty($bm)){echo '<script>parent.document.getElementsByName("comname")[0].value = "QQ账号错误";parent.document.getElementsByName("commail")[0].value = "QQ账号错误";parent.document.getElementsByName("comurl")[0].value = "QQ账号错误";</script>';}
    else{echo '<script>parent.document.getElementsByName("comname")[0].value = "'.$bm.'";parent.document.getElementsByName("commail")[0].value = "'.$_POST['qq'].'@qq.com";parent.document.getElementsByName("comurl")[0].value = "http://user.qzone.qq.com/'.$_POST['qq'].'";parent.document.getElementById("toux").src="http://q.qlogo.cn/headimg_dl?bs=qq&amp;dst_uin='.$_POST['qq'].'&amp;src_uin=qq.feixue.me&amp;fid=blog&amp;spec=100";</script>';} }
function getqqxx($qq){  
    $ssud=explode("@",$qq,2);
    if($ssud[1]=='qq.com'){
    echo getqqtx($ssud[0]);
    }else{  
    echo MyGravatar($qq);   
}}
?>

然后继续在module.php里面找到getGravatar($comment['mail'])这个替换成getqqtx($comment['mail'])一共有两个好像。反正都有的话就都换了

然后在你的发表评论那些代码里加上以下代码，CSS什么的就自己写啦。这样下来就OK了。 

 <form action="" method="post" target="hiddenIframe">
      <li>
        <input placeholder="选填" value="" type="text" name="qq"/>
        <label for="author"><i class="fa fa-qq"></i>QQ : </label>
        <button type="submit" id="hqziliao">获取信息</button>
      </li>
    </form>

上面的代码，我没测试，但应该是可以的，dux大前端的评论就是这套代码

下面放出本站，也就是我的方法：之前在别人博客看到效果，就自己想办法实现的。之前有人找我要，因为太散，今天整理一下，全部发出来，应该可以借助上面的方法优化的，但是，我懒得折腾了。直接给方法

先说qq头像的获取方法：https://q1.qlogo.cn/g?b=qq&nk=" + qq + "&s=40 里面的qq换成你的qq号就是你的qq头像，后面的s是size大小

昵称的获取，我是自己写了一个api：附代码： 


<?php
header('Content-type: text/html; charset=gbk');
$id=isset($_REQUEST['id'])?$_REQUEST['id']:NULL;
$url = 'http://users.qzone.qq.com/fcg-bin/cgi_get_portrait.fcg?get_nick=1&uins='.$id;
$n = file_get_contents($url);
$z = ',"';
$y = '",0]})';
echo getSubstr($n,$z,$y);
function getSubstr($str, $leftStr, $rightStr)
{
    $left = strpos($str, $leftStr);
    $right = strpos($str, $rightStr,$left);
    if($left < 0 or $right < $left) return '';
    return substr($str, $left + strlen($leftStr), $right-$left-strlen($leftStr));
}
?>

ajax发起请求传入qq应该就能拿到昵称了；

现在说怎么添加到评论系统

在module.php中找到发表评论部分，改造表单： 


<div class="tijiao" style="display: none;">
        <p class="close2">评论信息框<a href="javascript:;" title="关闭"></a> <br>
            <?php if(ROLE == 'admin' || ROLE == 'writer'):?>
            账户已登录，可直接发表评论！
            <?php else:?>
          <span><i class="fa fa-question-circle"></i> 可使用QQ号实时获取昵称+头像</span></p>
                <p>
          <input onkeydown="if(event.keyCode==13){event.returnValue=false;}" class="tex" type="text" id="nickqq" name="comqq" maxlength="49" value="" size="22" tabindex="1" placeholder="选填">
          <label id="qq" for="author"><img src="https://q1.qlogo.cn/g?b=qq&amp;nk=39784480&amp;s=40" class="emailavatar" style="display: none;"><i class="fa fa-qq" style="display: inline-block;"></i> QQ:</label>
        </p>
        <p>
          <input onkeydown="if(event.keyCode==13){event.returnValue=false;}" class="tex" type="text" id="nickname" name="comname" maxlength="49" value="<?php if(empty($ckname)){ echo "匿名";}else{echo $ckname;} ?>" size="22" tabindex="2" placeholder="必填">
          <label for="author"><i class="fa fa-user"></i> 昵称:</label>
        </p>
        <p>
          <input onkeydown="if(event.keyCode==13){event.returnValue=false;}" class="tex" type="email" name="commail" id="email" maxlength="128" value="<?php echo $ckmail; ?>" size="22" tabindex="3" placeholder="选填">
          <label id="email" for="email"><img src="https://blog.fenewbee.com/content/templates/moxiaonai/gravatar/default.jpg" class="emailavatar" style="display: none;"><i class="fa fa-envelope-square"></i> 邮箱:</label>
        </p>
        <p>
          <input onkeydown="if(event.keyCode==13){event.returnValue=false;}" class="tex" type="text" id="comurl" name="comurl" maxlength="128" value="<?php echo $ckurl; ?>" size="22" tabindex="4" placeholder="选填" pattern="((http|https)://|)+([\w-]+\.)+[\w-]+(/[\w- ./?%&amp;=]*)?">
          <label for="url"><i class="fa fa-globe"></i> 网址:</label>
        </p><?php endif;?>
            <p>
        </p><div class="ajaxloading">吃奶的力气提交吐槽中...</div>
        <div class="error"></div>
        <p></p>
        <p>
          <button type="submit" id="usb" tabindex="5">发表评论</button>
        </p>
        <input type="hidden" name="pid" id="comment-pid" value="0" size="22" tabindex="1">
      </div>

关键就是js部分了，我封装成了两个函数： 


function get_emailinfo() {
    if ("" != jQuery("#email").val()) if ( - 1 != jQuery("#email").val().indexOf("qq.com")) {
        var a = jQuery("#email").val().replace("@qq.com", "");
        isNum(a) ? ($("#email .emailavatar,#qq i").hide(), $("#email i,#qq .emailavatar").show(), $("#nickqq").val(a), jQuery("#qq .emailavatar").attr("src", "../content/templates/moxiaonai/images/pjax_loading.gif"), setTimeout(function() {
            jQuery("#qq .emailavatar").attr("src", "https://q1.qlogo.cn/g?b=qq&nk=" + a + "&s=40")
        },
        1E3)) : ($("#nickqq").val(""), $("#qq .emailavatar,#email i").hide(), $("#qq i,#email .emailavatar").show(), jQuery("#email .emailavatar").attr("src", "../content/templates/moxiaonai/images/pjax_loading.gif"), setTimeout(function() {
            jQuery("#email .emailavatar").attr("src", "http://secure.gravatar.com/avatar.php?gravatar_id=" + hex_md5(jQuery("#email").val())) + "&size=32&d=monsterid&r=G&default=https://blog.fenewbee.com/content/templates/moxiaonai/gravatar/default.jpg"
        },
        1E3))
    } else "" != jQuery("#email").val() && ($("#nickqq").val(""), $("#qq .emailavatar,#email i").hide(), $("#qq i,#email .emailavatar").show(), jQuery("#email .emailavatar").attr("src", "../content/templates/moxiaonai/images/pjax_loading.gif"), setTimeout(function() {
        jQuery("#email .emailavatar").attr("src", "http://secure.gravatar.com/avatar.php?gravatar_id=" + hex_md5(jQuery("#email").val())) + "&size=32&d=identicon&r=G&default=https://blog.fenewbee.com/content/templates/moxiaonai/gravatar/default.jpg"
    },
    1E3));
    else $("#email i").show(),
        $("#email .emailavatar").hide()
}
function get_qqinfo() {
    if ("" != jQuery("#nickqq").val()) {
        var a = jQuery("#nickqq").val();
        isNum(a) ? ($("#qq i,#email .emailavatar").hide(), $("#qq .emailavatar,#email i").show(), jQuery("#qq .emailavatar").attr("src", "../content/templates/moxiaonai/images/pjax_loading.gif"), $("#usb").attr("disabled", "disabled"), $("#nickname").val("昵称获取中..."), $.ajax({
            type: "GET",
            url: "/content/templates/moxiaonai/api/getqq_info.php?id=" + a,
            data: "",
            cache: !1,
            dataType: "html",
            success: function(b) {
                "" != b ? $("#nickname").val(b) : $("#nickname").val("匿名");
                $("#usb").removeAttr("disabled")
            },
            error: function(b, a, d) {
                $("#nickname").val("昵称获取失败");
                $("#usb").removeAttr("disabled")
            }
        }), setTimeout(function() {
            jQuery("#qq .emailavatar").attr("src", "https://q1.qlogo.cn/g?b=qq&nk=" + a + "&s=40")
        },
        1E3), $("#email").val(a + "@qq.com"), $("#comurl").val("http://user.qzone.qq.com/" + a)) : ($("#email .emailavatar,#qq .emailavatar").hide(), $("#email i,#qq .i").show(), $("#nickqq").val(""))
    } else $("#qq i").show(),
    $("#qq .emailavatar").hide()
}
function isNum(a) {
    return /^[0-9]+$/.test(a)
}

<span style="line-height:2;font-size:16px;"> 上面的方法评论列表每次访问都会重新获取昵称跟头像，如果有一天接口不能访问了，那么结果可想而知，

我这里的做法是把头像存储到本地：当然，我模板里是ok的，移植的同学就需要注意路径了。
贴出函数： 

<span style="line-height:2;font-size:16px;"><br />

<?php
//avatar缓存
function BYSB_getGravatar($email, $s = 44, $d = 'wavatar', $r = 'g') {

    if (empty($email)) {
        return TEMPLATE_URL.'gravatar/default.jpg';
    }
    $f = md5($email);
    $emailArr = explode("@",$email); 
    $n = $emailArr[0];
    if(preg_match("/^\d*$/",$n)){
        $t = 1296000;
        if (!empty($n)|| (time() - filemtime($e)) > $t ) {
            $m = TEMPLATE_URL.'gravatar/qq/'.$n.'.jpg';
            $p = EMLOG_ROOT.'/content/templates/moxiaonai/gravatar/qq/'.$n.'.jpg';
        if (!is_file($p)) {
            $q = "https://q1.qlogo.cn/g?b=qq&nk=".$n."&s=100";
            copy($q,$p);$m = $q;
        } 
        return $m;
        }
    }else{
        $a = TEMPLATE_URL.'gravatar/'.$f.'.jpg';
        $e = EMLOG_ROOT.'/content/templates/moxiaonai/gravatar/'.$f.'.jpg';
        $t = 1296000;
        if (empty($email)) $a = TEMPLATE_URL.'gravatar/default.jpg';
        if (!is_file($e) || (time() - filemtime($e)) > $t ) {
        $g = sprintf("http://secure.gravatar.com",
        (hexdec($f{0})%2)).'/avatar/'.$f.'?s='.$s.'&d='.$d.'&r='.$r;
        copy($g,$e); $a=$g;
        }
        if (filesize($e) < 500) copy($d,$e);
        return $a;
    }
}?>

然后在module.php中找到getGravatar($comment['mail'])这个替换成BYSB_getGravatar($value['mail'],44)，我模板中一共有三处。

        

       如果觉得这篇文章对您有所帮助，不如请我喝杯咖啡！

 点击捐赠

        

Powered by Wordpress, Theme by Wing-magic
©2024 烽火戏诸侯 All rights reserved
陕ICP备15006707号-5