How to implement WeChat scan code login in PHP

php method to implement WeChat code scanning login: 1. Instantiate an object through js; 2. Define a div in html and contain the QR code; 3. Within $(document).ready() Just instantiate it.

The operating environment of this article: windows10 system, php 7, thinkpad t480 computer.

WeChat has become an indispensable part of our daily lives. In order to allow more users to use WeChat and related products more conveniently, the WeChat scan function is becoming more and more common. So what should we do if we want to implement this function ourselves?

Before giving the specific implementation code, let’s first analyze the WeChat code scanning login process.

First of all, we must display the QR code on the page. The QR code has an expiration time and invalid state. Once you scan the QR code once or do not scan it within a certain period of time, the QR code will appear on the page. QR code, then this QR code will be invalid. WeChat official website provides us with two ways to display QR codes. One is to send a request in the background to return a new page, and the other is to instantiate the QR code in front-end js and embed it on its own page. Obviously the first method is simpler and more convenient, but both methods will be used in actual projects. In this case, we will explain both methods.

1. Send a request in the background to obtain the scan code page returned by WeChat

$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; //返回页面

This will return a page like this, and call $redirect_uri after scanning

2. Embedded JS display:

Here is to instantiate an object through the js side. First add the following js file in the tag,

<script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>

Secondly, define a div in html to contain the QR code,

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

Finally instantiate it in $(document).ready():

$(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文件"
    });
});

Note that the css file pointed to in the href must It can only be referenced under the https protocol, otherwise the page will have the default style (it displays a relatively large QR code, and you cannot adjust the size and position of the QR code, which is too painful). The last part of the page looks like this. The QR code here is only about 140px:

Okay, the QR code appears on the page. Next we will roughly Let’s talk about the logic of scanning the QR code. The whole process is roughly divided into 5 steps:

After completing these five steps, you will get all the information of the user who scanned the QR code. Then just write the code logic you need (such as redirection or login). The expression in the code is as follows:

//回调
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);
　　　　 } }

I believe that after writing the above code, you have already scanned and logged in. The process is very clear. In fact, it is essentially just the coordinated calls of multiple WeChat interfaces.

Recommended learning: php training

The above is the detailed content of How to implement WeChat scan code login in PHP. For more information, please follow other related articles on the PHP Chinese website!