微信第三方二维码扫描登录

微信二维码扫描登录

    最近做了微信二维码扫描登录的工作。实则非常简单。
    其实就是各种接口互相调用，收取参数跳页的过程。不过不熟练
的情况下，会比较麻烦，无从下手。从查阅开发文档到工作的完成，现
在总结以下步骤。

原理步骤

1,展示微信用户需要扫描的二维码
2,微信用户扫码，以及确认登录(分两种情况，一种已经注册，另一种没有注册)
3,通过确认登录的过程，验证密匙，接受数据，处理数据(可分辨出是否注册)
    1>用户已注册:
        查询用户详细信息，然后加入session直接登录
    2>用户未注册:
        将接收到的用户详细信息插入数据表,存如session,直接登
        录 ( 注意:意义不大，通常是跳到用户微信绑定页面，获取
        用户电话号码等详细信息 ) 

        附带激活页面:（绑定手机等）
            如果跳到了激活页面，输入用户信息，提交注册即可。

准备工作

在微信开放平台(open.weixin.qq.com)申请appid和appsecret.

代码实现

1，展示二维码

    有两种方式可供选择:
    1，点击微信登录，跳页展示二维码。
        配合自己申请的参数跳如下链接即可：
            https://open.weixin.qq.com/connect/qrconnect?
            appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&
            scope=SCOPE&state=STATE#wechat_redirect

        参数              是否必须        说明
        -------------------------------------------------------------------------------
        appid               是           应用唯一标识(申请)
        -------------------------------------------------------------------------------
        redirect_uri        是           请使用urlEncode对链接进行处理(用户确认后需要跳的页面url
                                        需要使用url_encode编码)
        -------------------------------------------------------------------------------
        response_type       是           填code即可
        -------------------------------------------------------------------------------
        scope               是           写snsapi_login即可
        -------------------------------------------------------------------------------
        state               否           自定义密匙，防攻击。用
                                        该参数可用于防止csrf攻击（跨站请求伪造攻击）
                                        ，建议第三方带上该参数，可设置为
                                        简单的随机数加session进行校验
        -------------------------------------------------------------------------------

    2，把需要扫描的二维码直接展示在登录页 
        html页面中操作:
            1,引入html页面:
            <script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
            2,html下面加入这段js对象    
            <script type="text/javascript">
                var obj = new WxLogin({
                          id:"login_container", 
                          appid: "", 
                          scope: "", 
                          redirect_uri: "",
                          state: "",
                          style: "",//样式
                          href: ""  //样式    样式查阅开发文档即可
                        });
            </script>
            3，需要展示二维码的地方加入如下标签(注意id和js对象的id要一致)
            <div class="login_fast" id="login_container">

2，扫描二维码及处理

        跳到redirect_uri网址,带上code和state参数。如果用户不允许登录，只带state参数。
        这里只讨论用户允许登录的情况下。
        ---------------------------------------------------------------------
        1，根据code，以及申请的appid，secret来获取access_token
        例如:
            https://api.weixin.qq.com/sns/oauth2/access_token?
            appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code
        刷新access_token
        例如：
            https://api.weixin.qq.com/sns/oauth2/refresh_token?
            appid=APPID&grant_type=refresh_token&refresh_token=REFRESH_TOKEN
        注意：
        access_token 为用户授权第三方应用发起接口调用的凭证（相当于用户登录态），存储
        在客户端
        ---------------------------------------------------------------------
        2，获取用户个人信息
        http请求方式: GET
        https://api.weixin.qq.com/sns/userinfo?access_token=ACCESS_TOKEN&openid=OPENID

3，代码示例

<?php
    session_start();
    //检查state参数，如果不同，禁止页面向下执行
    if($local_state != $_GET['state']){ 
        return false;
        exit('state有误');
    }
    //获取access_token
    $appid = "appid";
    $secret = "secret";
    $code = $_GET['code'];
    $url = "https://api.weixin.qq.com/sns/oauth2/access_token?appid=".$appid."&secret=".$secret."&code=".$code."&grant_type=authorization_code";
    $ch = curl_init();
    $timeout = 0;
    curl_setopt ($ch, CURLOPT_URL, $url);
    curl_setopt ($ch, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
    curl_setopt($ch,  CURLOPT_USERAGENT , "Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1)");
    curl_setopt ($ch, CURLOPT_CONNECTTIMEOUT, $timeout);
    $res = curl_exec($ch);
    curl_close($ch);
    //get_object_vars()获取$object对象中的属性，组成一个数组
    $array=get_object_vars(json_decode($res));
    //获取用户信息利用open_id和access_token
    $access_token=$array['access_token'];
    //授权用户唯一标识
    $openid=$array['openid'];
    $url="https://api.weixin.qq.com/sns/userinfo?access_token=".$access_token."&openid=".$openid;
    $ch = curl_init();
    $timeout = 0;
    curl_setopt ($ch, CURLOPT_URL, $url);
    curl_setopt ($ch, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
        curl_setopt($ch,  CURLOPT_USERAGENT , "Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1)");
    curl_setopt ($ch, CURLOPT_CONNECTTIMEOUT, $timeout);
    $res = curl_exec($ch);
    curl_close($ch);
    $callback_data= json_decode($res);
    $array=get_object_vars($callback_data);

    /*获取到用户信息就可以进行查询用户的注册信息
    以及获得如何跳页，如何处理等等
    */