当前位置:秋叶网络博客 WP教程 ◊ 让QQ游客也可以评论个人独立博客

让QQ游客也可以评论个人独立博客

作者:秋叶 发表时间:2015年4月06日

之前也分享了个通过qq号码来获取昵称,邮件,网址的功能,实现一键填写评论表单。有兴趣的可以看看这篇文章《WordPress评论一键获取qq资料填写评论框》,但是之前那个qq资料获取接口现在好像出问题了,不能获取到昵称。再说那个是用php语言写的功能,不能实现异步填写,每填写一次都要刷新页面,造成网页上的音乐中断。

所以现在正值我学习js,就写了个简单的QQ游客评论功能,原理是一样的,就是一键填写,但又比之前的那个先进点,不会刷新页面。也修复了昵称显示,所有游客评论昵称都是“QQ游客”,邮箱是qq邮箱,网址是qq空间网址。现在教大家怎么加入我这个功能(以wordpress为例,其它个人博客程序依葫芦画瓢)。

找到comment.php文件,也就是评论模版,在适当的位置加入表单代码(输入框):

<input id="qqinfo" maxlength="12" name="u" type="text" value="" placeholder="输入QQ号码" />
<span class="fabiao" onclick="qiuye()">游客评论</span>

然后在博客的公共js文件中加入以下代码:

function qiuye(){
var abc=document.getElementById('qqinfo').value;
if(abc){
   if( !isNaN(abc)){
      document.getElementById('author').value='QQ游客';//一键填写昵称
      document.getElementById('email').value=''+abc+'@qq.com';//一键填写邮件
      document.getElementById('url').value='http://user.qzone.qq.com/'+abc+'';//一键填写网址     
   }else{
      alert('你输入的好像不是QQ号码');
      document.getElementById('qqinfo').focus();
      return false;
   }
}else{
   alert('请输入您的QQ号');
   document.getElementById('qqinfo').focus();
   return false;
}
};

如果是wordpress的直接按照这个来教程做就可以实现这个功能了,其它博客程序需要小小修改一下表单的id值,就是红色的位置修改成你的博客的输入框的id值,具体效果请看秋叶网络博客的评论区。有问题评论救援,评论都是邮件通知的,几乎不会忽略大家的评论,所以打电话请求帮助还不如直接在这评论~

改进:使用腾讯开放接口获取真实昵称


新建一个php文件名字叫get_qq_info.php,存放路径自己定义,把下面的内容拷到文件里面:

<?php 
 header('Content-Type: text/html;charset=utf-8');
 $QQ=$_GET["qq"];
 if($QQ!=''){
 $urlPre='http://r.qzone.qq.com/fcg-bin/cgi_get_portrait.fcg?g_tk=1518561325&uins=';
 $data=file_get_contents($urlPre.$QQ);
 $data=iconv("GB2312","UTF-8",$data);
 $pattern = '/portraitCallBack\((.*)\)/is';
 preg_match($pattern,$data,$result);

 $result=$result[1];
 echo $result;
 }else{
 echo "请输入qq号!";
 }
?>

下面是页面上的js,替换上面的function qiuye():

function qiuye(){
   var qq_num=$('#qqinfo').val();
   if(qq_num){
      if( !isNaN(qq_num)){
	$.ajax({
	   url:"http://www.mizuiren.com/get_qq_info.php",
	   type:"get",
	   data:{qq:qq_num},
	   dataType:"json",
	   success:function(data){
	   $("#email").val(qq_num+'@qq.com');
	   $("#url").val('http://user.qzone.qq.com/'+qq_num);
	   $('#comment').focus();
	   if(data==null){
		$("#author").val('QQ游客');							
	   }else{
		$("#author").val(data[qq_num][6]==""?'QQ游客':data[qq_num][6]);
	   }						
	},
	error:function(err){
	   $("#author").val('QQ游客');
	   $("#email").val(qq_num+'@qq.com');
	   $("#url").val('http://user.qzone.qq.com/'+qq_num);
	   $('#comment').focus();
	}
     });
   }else{
	alert('你输入的好像不是QQ号码');
	$('#qqinfo').focus();
   }		
  }else{
    alert('请输入您的QQ号');
    $('#qqinfo').focus();
  }
}
目录: WP教程 | 标签: | 12494次阅读