学习历程（一）第一个微信打卡器

2023-11-12 19:49:58

         第一个微信打卡系统，我是利用微信的网页授权获微信的个人信息，然后后台我是用ThinkPhp3.2.3将记录插入数据库，由于我刚入门，花了3天时间完成了这个项目，

所以前端界面我还没来得及做优化。

      以下我会一步一步的将我这个项目分析，这个项目具体分两个需要思考的地方，如何获取用户信息，还有后台对保存的数据如何处理。

       一，数据库结构

学习历程（一）第一个微信打卡器
      6个字段 id自增为主键，username是存储微信昵称的，timeup是存储上班时间，timedown是存储下面时间，timesum是存储在岗位的市场

trueName是方便用户日后查询的注册时填入的姓名。

      二，实现获取微信的用户信息

                  

         首先，你必须在微信公众平台创建一个具有高级接口权限的公众号，这里推荐用微信在微信公众号开发所给的测试号 网址为 点击打开链接

 学习历程（一）第一个微信打卡器

                                                                                                                 图1

  这里你还需要配置接口信息，如果对这个概念不熟悉的，点击消息接口使用指南

                    学习历程（一）第一个微信打卡器    

           在这里点击接入指南，往下拉下载PHP示例代码，如下图这个地方

学习历程（一）第一个微信打卡器

        然后你打开文件查看这里面Token的值是什么，一般默认为weixin，然后回到图1的接口配置信息将你在服务器放置这个php事例文件的地方的url写入，还有Token。学习历程（一）第一个微信打卡器

到这个地方，将你服务器的ip地址填入也可以填域名，这里建议填域名 不然到时候在手机跳转他会请求授权跳转，然后对你的服务器内容会有误差

然后在TP的控制器中写如下代码，下面代码主要实现

    public function wxLink(){ 
              $code=$_GET['code'];  
              $url ="https://api.weixin.qq.com/sns/oauth2/access_token?appid=wx098d5dd1d94cace9&secret=21e212d51bc4f7321771dc681f89737c&code=".$code."&grant_type=authorization_code";
              $openidarr = json_decode($this->gettoken($url),true);
              $token = $openidarr['access_token'];
              $openid= $openidarr['openid']; 
              $infourl="https://api.weixin.qq.com/sns/userinfo?access_token=".$token."&openid=".$openid."&lang=zh_CN";
              $demo = json_decode($this->gettoken($infourl),true);  
              //print_r($demo);
               $username= $demo['nickname'];
              //echo $username;
               return $username;    //获取微信昵称名字
          
    }
    public function gettoken($url){  //获取token
	            $ch = curl_init();
            	curl_setopt($ch, CURLOPT_URL, $url);
            	curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
            	curl_setopt($ch, CURLOPT_HEADER, 0);
            	curl_setopt($ch,CURLOPT_USERAGENT,'Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/30.0.1599.69 Safari/537.36');//设置用户代理
            	curl_setopt($ch, CURLOPT_ENCODING, 'gzip');
            	curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
            	$output = curl_exec($ch);
            	curl_close($ch);
            	return $output;
}

       这边我是采取snsapi_userinfo的参数，这个方法开发者文档中有详细说明，这个参数不单止能获取openid还可以获取微信昵称，所在城市，微信头像之类的信息。个人觉得以上两段代码是这个小项目的核心操作。接下来的事情就完全和微信这块分离了。

        三，业务方面的操作

      我在控制器中用test函数作为入口文件，大家可以自行命名规定，

       1、入口判断

 public function test(){
           $name = $this->wxLink(); 
           $user=M('user');
           $data1['username']=$name; 
           $_SESSION['sessName']=$name;
           
           $data['timedown']='0000-00-00 00:00:00'; 
            if($user->where($data)->select()==null){
                 if($user->where($data1)->select()==null){
                //  echo '1';
                               $this->success('新用户','http://cslg.iperson.cn/090214103/wxdemo/?m=Home&c=Index&a=demo3',2);
                       }else{
                 // echo '2';
                               $this->success('欢迎','http://cslg.iperson.cn/090214103/wxdemo/?m=Home&c=Index&a=demo',2);
                  }
              }else{
                  $this->success('幸苦了','http://cslg.iperson.cn/090214103/wxdemo/?m=Home&c=Index&a=demo2',2); 
                
       } 
        
    }
       这段代码是作为接口函数，判断用户类型，我这里有三类用户，第一类是数据库不存在的，标为新用户，跳转到新用户界面，为新员工的状态。第二类为数据库存在的用户，但这类用户是在数据表中timedown为空的，还没上班的状态。第三类为timeup有值，timedown值为空，说明在上班的这种状态中，然后直接跳转到查询界面，这边可以查询
你最近上下班时间，还有统计时间。

              2、上班后台操作

    public function wxAction(){ 
               $input1=I('post.up');  
          if($input1=='Workup'){ 
                $user = M('user');
                $condiction['username']=$_SESSION['sessName'];
                $e = $user->field('trueName')->where($condiction)->find();
                $e =$e['truename']; 
                $data['trueName']=$e; 
                $data['timeup']=date('Y-m-d H:i:s');   
                $value =$_SESSION['sessName'];
                $data['username']=$value;
                $user->add($data);
                echo 'ok'; 
               
              }else{
                echo'ERROR';
              }
    }
         对前端接收的表单进行判断，对应上就做数据插入，这里$_SESSION[‘sessName‘]是后台的缓存，相当于cookies，主要是做用户登录，保存用户信息的作用的，在入口文件时就要接受该值，这一边有一点需要注意的是，插入前你还需要找到昵称对应的真实注册姓名，然后一同插入新的数据行中，不然的话你会发现trueName的值会是NULL这样你后面的查询就不能找出完整的数据，因为查询工作是基于trueName来进行查询数据库的。

      3、下班后台操作

   public function wxAction2(){
           $input2=I('post.down');  
            if($input2=='我要下班'){

                  $user1=M('user');
                   //$value = Session::get('sessName');
                  $condition['username']= $_SESSION['sessName'];
                  $condition['timedown']='0000-00-00 00:00:00';
                  $data['timedown']=date('Y-m-d H:i:s');
                  $datedown = $data['timedown'];
                  //echo $datedown."<br/>";
                  //$data['timesum'] = $datadown-$dataup;
                  $timeup = $user1->field('timeup')->where($condition)->select();

                  $timeup = $timeup[0]['timeup'];
                  //echo $timeup.'<br/>';
                  $zoreup =strtotime($timeup);
                  $zoredown =strtotime ($datedown);
                  $timesum =  $zoredown-$zoreup;
                  $data['timesum']=$timesum; 
                  $user1->where($condition)->data($data)->save();
                  $this->display('selectD');
              }   else{
                echo 'xxxxxxx';
              } 
            
    }
下班操作主要就是把下班时间和在岗时间统计出来，插入数据库。这边是思路是先查找出timedown为初值的行，然后获取当前时间，计算时间差，插入数据库。
需要注意的地方是在你查找timedown为初值查询出来的数据是以数组方式查询出来的，所以你这里就应该想方法变成字符串才可以正常的插入到数据库（代码中写的挺清楚的），还有一点的是在计算时间差时需要借助php一个函数strtotime，这个和是专门算时间差的函数，其他的就没什么问题了。
      4、新用户后台操作
    public function wxAction3(){
      $inputName = I('post.name1'); 
      $user =M('user');
      $data['trueName']=$inputName;
      $data['username']=$_SESSION['sessName'];
      $data['timeup']=date('Y-m-d H:i:s');
      $user->add($data); 
       echo $_SESSION['sessName'];
    }
       这一块我是直接注册和上班结合一起，其实严格来说这不算注册，只是记录新用户的用户名以便于日后在查询模块方便查询，因为有些微信昵称不好打出来，当然这一块
完全可以忽略。

      5、查询模块后台操作

     
    public function selectTest(){   
              $user= M('user');
              $inputname=I('get.iname'); 
              $data['trueName']= $inputname;
              $d=$user->where($data)->select();
              echo json_encode($d);
   }

      查询是根据前端提交的表单信息，查询相应的数据库，因为我前端是利用ajax打印数据，所以后台这里我把数组转换成json数据。

     6、前端ajax的一个请求控制器，

是把用户总的在岗时间传给前段，这里的单位是秒，我没有过多的去转化成其他单位方式，如果有需要转化的可以考虑下求模算法实现这里的功能 

   public function worktime(){
              $user=M('user');
              $inputname=I('get.iname');
              //$inputname='cqj';
              $data['username']=$inputname;
              $sum=$user->where($data)->sum('timesum');
             echo json_encode($sum);
             //echo json_
       

 四，前端相关代码

1、打卡

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://static.runoob.com/assets/jquery-validation-1.14.0/lib/jquery.js"></script>
<script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>
<script type="text/javascript">
	function ajax(){

	}
</script>
<style type="text/css">
  .div{position:absolute; 
       width:500px; 
	   height:500px; 
       top:50%; 
       left:50%; 
       margin-left:-250px; 
       height:-130px; 
       z-index:1000; 
	   border:2px solid red
	    
	   }

	
</style>
<title>无标题文档</title>
</head>

<body bgcolor="#FF9933">
 <div class="div"> 
 <p><center>
 <form action="http://cslg.iperson.cn/090214103/wxdemo/?m=Home&c=Index&a=wxAction"  method="post">
 <input type="submit" name="up" value="Workup"/>
 
 </form>
 </center></p>
 <center><p></p></center> 
 </div>
</body>
</html>

2、新用户登记

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<form action="http://cslg.iperson.cn/090214103/wxdemo/?m=Home&c=Index&a=wxAction3" method="post">
      xingming:<input  type="text" name="name1"  value=""/>
      <input type="submit" value="打卡" />  
	</form>
</body>
</html>

3、下班

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://static.runoob.com/assets/jquery-validation-1.14.0/lib/jquery.js"></script>
<script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>
<script type="text/javascript">
	function ajax(){

	}
</script>
<style type="text/css">
  .div{position:absolute; 
       width:500px; 
	   height:500px; 
       top:50%; 
       left:50%; 
       margin-left:-250px; 
       height:-130px; 
       z-index:1000; 
	   border:2px solid red
	    
	   }

	
</style>
<title>无标题文档</title>
</head>

<body bgcolor="#FF9933">
 <div class="div"> 
 <p><center>
 <form action="http://cslg.iperson.cn/090214103/wxdemo/?m=Home&c=Index&a=wxAction2" method="post">

 <input type="submit" name="down" value="Workdown"/>
 </form>
 </center></p>
 <center><p></p></center> 
 </div>
</body>
</html>

4、查询

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/lib/jquery.js"></script>
  <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>
  <script type="text/javascript">
  function selectAjax(){
   
   $ .get("http://cslg.iperson.cn/090214103/wxdemo/?m=Home&c=Index&a=selectTest",{iname:$('#iname').val()},
      function(data){
        var data = eval("("+data+")");
        var h ='';
        for(var i =0;i<data.length;i++)
        {
           h=h+"<tr><td>"+data[i].username+"</td><td>"+data[i].timeup+"</td><td>"+data[i].timedown+"</td><tr>";
        }
        $('#target').html(h);
      }); 
        $ .get("http://cslg.iperson.cn/090214103/wxdemo/?m=Home&c=Index&a=worktime",{iname:$('#iname').val()},function(data1){
        var data1 = eval("("+data1+")"); 
        $('#info2').html(data1);
     });
  }
   function infoTime(){

   }

  </script>
  <style type="text/css">
    .t1{margin: 0 auto}
    .t2{margin-left: 500px; margin-top: 200px }
     h2{padding-left:60px}
  </style>
</head>
<body>

  <div class="t2">
      <h2>查询系统</h2>
      <p>请输入你的微信昵称<input type="text" id="iname" />  
      <button  onclick="selectAjax();">Sumbit</button></p>
  </div>
    <CENTER> <span class="span" id='info2'></span> </CENTER> 
      <table width="200px" border="1" class="t1">
              <tr><td>UserName</td>
              <td>TimeUp</td>
              <td>TimeDown</td></tr>
   <table width="200px" border="1" class="t1" id="target"></table>
  </table>
</form>
</body>
</html>

 五，总结

     在这个小项目中，我主要的问题在于如何获取用户信息，在我前面的过程中讲的挺详细的这里就不多重复。还有的是在考虑业务需求时，前期没有过多的规划，导致我写的代码很混乱，一些字段的命名还是不够严谨，这里也希望大家包容，在做前段和后台的交互时，这里可能是微信方面相关的问题吧，导致get表单提交方式失败，只能用post，我具体原因没有过多的研究，希望各位有这个经验的给点意见，最后这是我第一次写的博文，单纯的想记录一下大学所学的，同时对这方面感兴趣的朋友给点帮助。如果有不足的地方，错误的地方请大家指出，我必虚心请教，有需要源代码的，可以留下邮箱 。谢谢各位。









学习历程（一）第一个微信打卡器

上一篇：微信开发第8章 通过accesstoken将长连接转换为短链接


下一篇：实战Nagios+Ganglia发送警告信息,短信,微信等