• (转)微信网页扫码登录的实现


    1. 前提

    • 基于微信开放平台已经配置好域名(80端口)并且认证成功获得app_id和secret并有权限调用微信的接口。

    2. 简介

    1. 二维码的失效时间和失效状态

    • 一旦扫过一次二维码或者在某段时间内没有扫描页面上的二维码,该二维码就失效了。

    2. 微信官网提供两种方式来显示二维码

    • 后台发请求返回一个新的页面
    • 前端js实例化二维码内嵌在自己的页面上

    3. 实现代码

    1. 后台发请求获取微信返回的扫码页面

    $redirect_uri="http://你的微信开放平台绑定域名下处理扫码事件的方法";
    $redirect_uri=urlencode($redirect_uri);//该回调需要url编码
    $appID="你的appid";
    $scope="snsapi_login";//写死,微信暂时只支持这个值
    //准备向微信发请求
    $url = "https://open.weixin.qq.com/connect/qrconnect?appid=" . $appID."&redirect_uri=".$redirect_uri
    ."&response_type=code&scope=".$scope."&state=STATE#wechat_redirect";
    //请求返回的结果(实际上是个html的字符串)
    $result = file_get_contents($url);
    //替换图片的src才能显示二维码
    $result = str_replace("/connect/qrcode/", "https://open.weixin.qq.com/connect/qrcode/", $result);
    return $result; //返回页面
    

    2. 内嵌JS显示

    1. js实例化对象

    # 通过js端实例化一个对象即可,首先在<head>标签内添加如下js文件
     <script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
    

    2. html中定义一个div包含二维码

    <div id="login_container"></div>
    

    3. 在$(document).ready()内进行实例化

    # 注:其中href里指向的css文件必须放在https协议下才能引用的到,不然页面上就是默认样式。
    
    $(document).ready(function()
    {
        var obj = new WxLogin
        ({
            id:"login_container",//div的id
            appid: "你的appid",
            scope: "snsapi_login",//写死
            redirect_uri:encodeURI("你的处理扫码事件的方法") ,
            state: "",
            style: "black",//二维码黑白风格        
            href: "https://某个域名下的css文件"
        });
    });
    

    4. 微信扫码登录流程图

    微信扫码登录

    5. 回调处理

    //回调
    public function codeinfo()
    {
            $code = $_GET["code"];
            $appid = "你的appid";
            $secret = "你的secret";
            if (!empty($code))  //有code
            {
                //通过code获得 access_token + openid
               $url="https://api.weixin.qq.com/sns/oauth2/access_token?appid=" . $appid
                . "&secret=" . $secret . "&code=" . $code . "&grant_type=authorization_code";
                $jsonResult = file_get_contents($url);
                $resultArray = json_decode($jsonResult, true);
                $access_token = $resultArray["access_token"];
                $openid = $resultArray["openid"];
    
                //通过access_token + openid 获得用户所有信息,结果全部存储在$infoArray里,后面再写自己的代码逻辑
                $infoUrl = "https://api.weixin.qq.com/sns/userinfo?access_token=" . $access_token . "&openid=" . $openid;
                $infoResult = file_get_contents($infoUrl);
                $infoArray = json_decode($infoResult, true);
         } 
    }
    

    6. 参考

  • 相关阅读:
    Android SurfaceView实战 带你玩转flabby bird (上)
    linux释放内存的命令
    Linux上的free命令详解
    app后端设计(14)--LBS的偏移问题
    包床、退床
    oracle学习17
    提示在【办公管理】-->【今日工作】
    oracle学习16
    数据库的表信息
    CodeForces
  • 原文地址:https://www.cnblogs.com/yueyun00/p/10634591.html
Copyright © 2020-2023  润新知