需求:用户扫描二维码关注公众号,成功关注后才可以参与抽奖活动,当然,可以根据自己需求限定用户可抽奖次数。
实现思路:
利用微信公众平台生成带参数的二维码接口(需要认证服务号)生成临时二维码,场景值传递一个Key,用于识别用户。
当用户扫描二维码并关注公众号时,会触发关注公众号事件,微信会推送信息给微信公众平台基本配置中的“服务器地址”,该页面接收微信推送过来的信息保存到数据库,保存的信息包括openid、用户昵称(使用获取用户基本信息接口获取)和场景值Key
抽奖页面用户点击“已完成关注按钮”或者是定时读取数据库,通过Key查询数据库可以获得用户openid,将openid写入cookie,用户不再需要扫描即可开始抽奖。
获取Token
function get_weixin_access_token($AppID, $AppSecret) {$url = \'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=\' . $AppID . \'&secret=\' . $AppSecret;$token = wp_remote_retrieve_body(wp_remote_get($url));$token = json_decode($token, true);return $token[\'access_token\'];}
这里的Get请求我是用WordPress函数wp_remote_get()来完成的,你可以用自己的CURL函数来替换。
检验Token是否有效
function verifi_weixin_token($AppID, $AppSecret) {$url = \'https://api.weixin.qq.com/cgi-bin/getcallbackip?access_token=\' . get_option(\'weixin_token\');$ip = wp_remote_retrieve_body(wp_remote_get($url));$ip = json_decode($ip, true);if( empty($ip[\'ip_list\']) ) {$token = get_weixin_access_token($AppID, $AppSecret);update_option(\'weixin_token\', $token);}}
通过获取微信服务器IP接口可以判断Token是否有效,如果无效就获取Token,并保存到数据库,这里我是用的WordPress函数update_option()保存到了wp_options表。
生成带参数的二维码
function generate_weixin_code($key = \'\') {$url = \'https://api.weixin.qq.com/cgi-bin/qrcode/create?access_token=\' . get_option(\'weixin_token\');$data = array(\'expire_seconds\' => 600,\'action_name\' => \'QR_STR_SCENE\',\'action_info\' => array(\'scene\' => array(\'scene_str\' => $key)));$args = array(\'body\' => json_encode($data),);$ticket = wp_remote_retrieve_body(wp_remote_post($url, $args) );$ticket = json_decode($ticket, true);if( empty($ticket[\'ticket\']) ) return false;return \'https://mp.weixin.qq.com/cgi-bin/showqrcode?ticket=\' . $ticket[\'ticket\'];}
这里我生成一个有效时间为10分钟的临时二维码,Post数据是用WordPress函数wp_remote_post()来完成的,微信二维码接口参数如下:
- expire_seconds:二维码有效时间,单位为秒,默认有效期为30秒;
- action_name:二维码类型,可选值有:QR_SCENE(临时整数型值二维码)、QR_STR_SCENE(临时字符串值二维码)、QR_LIMIT_SCENE(永久整数型值二维码)、QR_LIMIT_STR_SCENE(永久字符串值二维码)
- action_info:二维码的详细信息,可以是scene_id或scene_str,是根据action_name的值来决定的;
- scene_id:如果action_name的值为整数型值,则使用这个参数传递整数型的值,临时二维码时为32位非0整型,永久二维码时最大值为100000;
- scene_str:如果action_name的值为字符串值,则使用这个参数传递字符串形式的ID,长度为1-64位;
需要注意Post的数据为JSON格式,看上去像这样子:
{\"action_name\": \"QR_STR_SCENE\", \"action_info\": {\"scene\": {\"scene_str\": \"nspmq7ke\"}}}
注意action_info里是一个scene数组,包含scene_str值。
Post数据后实际上返回的是Ticket值,使用以下URL拼接就可以得到二维码图片:
https://mp.weixin.qq.com/cgi-bin/showqrcode?ticket=$ticket
接收微信关注公众号推送事件
当用户扫描生成的二维码并关注公众号后,微信会推送事件给我们在微信公众平台填写的服务器地址,该页面获取微信推送过来的信息并保存。
if( isset($_POST) ) {echo \' \'; //如果5秒内不返回数据,微信会重试3次推送,造成我们脚本多次执行//$postStr = $GLOBALS[\'HTTP_RAW_POST_DATA\'];$postStr = file_get_contents(\'php://input\'); //获取微信推送过来的XML数据if($postStr) {//解析XML$data = simplexml_load_string($postStr, \'SimpleXMLElement\', LIBXML_NOCDATA);//当事件为关注公众号事件时执行if($data->Event && $data->Event == \'subscribe\') {$FromUserName = $data->FromUserName; //openid$EventKey = $data->EventKey; //带前缀的Key$EventKey = ltrim($EventKey, \'qrscene_\'); //去掉前缀就是我们传递给微信的Key}}}
我们需要的数据一般就是openid和生成二维码时传递的Key,特别要注意,如果使用:
$GLOBALS[\'HTTP_RAW_POST_DATA\']
全局变量接收不到微信推送过来的信息,可能是主机限制的原因,需要使用:
file_get_contents(\'php://input\')
微信推送的参数如下:
<xml> <ToUserName><![CDATA[gh_fbe8a958756e]]></ToUserName> <FromUserName><![CDATA[otAzGjrS4AYCmeJM1GhEOcHXXTAo]]></FromUserName> <CreateTime>1433259128</CreateTime> <MsgType><![CDATA[event]]></MsgType> <Event><![CDATA[subscribe]]></Event> <EventKey><![CDATA[scene|keystandard|keystr|extinfo]></EventKey></xml>
推送参数说明:
- ToUserName:商户的公众号原始id;
- FromUserName:用户的openid;
- CreateTime:消息创建时间(整型);
- MsgType:消息类型,event;
- Event:事件类型,subscribe为关注公众号事件;
- EventKey:场景值,微信给我们传递的场景值(本例中Key)加了qrscene_前缀;
获取微信用户信息
有了openid,就可以获取用户信息。
function get_weixin_userinfo($openid = \'\') {$url = \'https://api.weixin.qq.com/cgi-bin/user/info?access_token=\' . get_option(\'weixin_token\') . \'&openid=\' . $openid . \'&lang=zh_CN\';$info = wp_remote_retrieve_body(wp_remote_get($url));$info = json_decode($info, true);return $info;}
接下来做什么
现在,我们数据库中有了用户的openid、Key、用户昵称,因为Key是在抽奖页面生成的,所以抽奖页面可以通过Key发出Ajax请求获取数据库中的用户openid并写入cookie
至于大转盘的实现,我用的是jquery.rotate插件,当然抽奖次数限制、中奖结果计算全部是在服务端完成的,前端只是象征性的转几下。