一、思路:
思路關鍵在于如何與微信端交互起來,畢竟目前微信登錄只能是在微信端。
但是微信有一個特殊的方法用于生成自定義的二維碼,這就讓我們能夠在PC上顯示二維碼,而二維碼的值可以是我們定義的。另外看微信開發文檔中存在一個scan事件,可以檢測用戶使用微信掃描二維碼并獲取值。其實問題的關鍵就在于這個值,這個值算是一個聯通PC和微信的通信ID了。
二、具體實現流程(下面代碼使用了TP5的框架,有個大前提是存在一個服務號的公眾號)
1、生成PC端的二維碼:
代碼如下:
控制器:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
namespace app\home\controller; class Recognition extends Base{ public function seeLoginQrcode(){ $qrcode_return = model( 'Recognition' )->getLoginQrcode(); if ( $qrcode_return [ 'error_code' ]){ return $this ->returnJson( "獲取失敗!" ,0); } else { $data = array ( 'url' => $qrcode_return [ 'ticket' ], 'qrcode_id' => $qrcode_return [ 'id' ], ); return $this ->returnJson( "獲取成功!" ,1, $data ); } } } |
model:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
|
namespace app\common\model; use think\Model; class Recognition extends Model{ protected $autoWriteTimestamp = false; //生成登錄用的臨時二維碼 public function getLoginQrcode(){ $appid = config( 'THINK_SDK_WEIXIN.APP_KEY' ); $appsecret = config( 'THINK_SDK_WEIXIN.APP_SECRET' ); if ( empty ( $appid ) || empty ( $appsecret )){ return ( array ( 'error_code' =>true, 'msg' => '請聯系管理員配置【AppId】【 AppSecret】' )); } $database_login_qrcode = model( 'LoginQrcode' ); $database_login_qrcode ->where( array ( 'add_time' => array ( 'lt' ,( $_SERVER [ 'REQUEST_TIME' ]-604800))))-> delete (); $data_login_qrcode [ 'add_time' ] = $_SERVER [ 'REQUEST_TIME' ]; $database_login_qrcode ->save( $data_login_qrcode ); $qrcode_id = $database_login_qrcode ->getLastInsID(); if ( empty ( $qrcode_id )){ return ( array ( 'error_code' =>true, 'msg' => '獲取二維碼錯誤!無法寫入數據到數據庫。請重試。' )); } import( 'Net.Http' ); $http = new \Http(); //微信授權獲得access_token $access_token_array = model( 'AccessTokenExpires' )->getAccessToken(); if ( $access_token_array [ 'errcode' ]) { return ( array ( 'error_code' =>true, 'msg' => '獲取access_token發生錯誤:錯誤代碼' . $access_token_array [ 'errcode' ] . ',微信返回錯誤信息:' . $access_token_array [ 'errmsg' ])); } $access_token = $access_token_array [ 'access_token' ]; $qrcode_url = 'https://api.weixin.qq.com/cgi-bin/qrcode/create?access_token=' . $access_token ; $post_data [ 'expire_seconds' ] = 604800; $post_data [ 'action_name' ] = 'QR_SCENE' ; $post_data [ 'action_info' ][ 'scene' ][ 'scene_id' ] = $qrcode_id ; $json = $http ->curlPost( $qrcode_url ,json_encode( $post_data )); if (! $json [ 'errcode' ]){ $condition_login_qrcode [ 'id' ]= $qrcode_id ; $data_login_qrcode [ 'id' ] = $qrcode_id ; $data_login_qrcode [ 'ticket' ] = $json [ 'ticket' ]; if ( $database_login_qrcode ->isUpdate(true)->save( $data_login_qrcode )){ return ( array ( 'error_code' =>false, 'id' => $qrcode_id , 'ticket' => 'https://mp.weixin.qq.com/cgi-bin/showqrcode?ticket=' .urlencode( $json [ 'ticket' ]))); } else { $database_login_qrcode ->where( $condition_login_qrcode )-> delete (); return ( array ( 'error_code' =>true, 'msg' => '獲取二維碼錯誤!保存二維碼失敗。請重試。' )); } } else { $condition_login_qrcode [ 'id' ] = $qrcode_id ; $database_login_qrcode ->where( $condition_login_qrcode )-> delete (); return ( array ( 'error_code' =>true, 'msg' => '發生錯誤:錯誤代碼 ' . $json [ 'errcode' ]. ',微信返回錯誤信息:' . $json [ 'errmsg' ])); } } } |
可以看到成功后返回:
其中有一個id值,其實代表的就是二維碼的值!
然后ticket就是二維碼的鏈接。也就是掃描這個二維碼在scan事件獲取的值就是這個id。
下面查看微信端處理
1、掃描二維碼之后:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
|
namespace app\mobile\controller; class Wechat extends Base{ public function index() { import( 'Wechat.Wechat' ); $wechat = new \Wechat(); $data = $wechat ->request(); list( $content , $type ) = $this ->reply( $data ); if ( $content ) { $wechat ->response( $content , $type ); } else { exit (); } } public function reply( $data ) { if ( $data [ 'MsgType' ] == 'event' ) { $id = $data [ 'EventKey' ]; switch ( strtoupper ( $data [ 'Event' ])) { case 'SCAN' : return $this ->scan( $id , $data [ 'FromUserName' ]); case 'CLICK' : //回復? return array ( 'click' , 'text' ); break ; case 'SUBSCRIBE' : //關注 return array ( 'Welcome' , 'text' ); break ; case 'UNSUBSCRIBE' : //取關 return array ( 'BYE-BYE' , 'text' ); case 'LOCATION' : //定位 break ; } } else { if ( $data [ 'MsgType' ] == 'text' ) { return array ( "測試成功!" , 'text' ); } if ( $data [ 'MsgType' ] == 'location' ) { } if (import( '@.ORG.' . $data [ 'MsgType' ] . 'MessageReply' )) { } } return false; } private function scan( $id , $openid = '' , $issubscribe = 0) { if ((1000000000 < $id ) && $openid ) { if ( $user = model( 'Member' )->field( 'id' )->where( array ( 'third_id' => $openid ))->find()) { $data = array ( 'id' => $id , 'uid' => $user [ 'id' ] ); model( 'LoginQrcode' )->isUpdate()->save( $data ); } $data = array ( 'id' => $id , 'uid' =>-1 ); model( 'LoginQrcode' )->isUpdate(true)->save( $data ); $return [] = array ( '點擊授權登錄' , '' ,config( 'SITE_LOGO' ), config( 'SITE_URL' ) . '/mobile/WechatBind/ajaxWebLogin?qrcode_id=' . $id ); return array ( $return , 'news' ); } } } |
上面的Scan方法有這個判斷,可以看到是:
if ((1000000000 < $id) && $openid) {
其中的$id,就是對應的二維碼的值,也就是之前我們生成的那個id(其實我們為了區分Scan中的各種事件,特意將id所在的login_qrcode表自增id從1000000000開始)。
然后看if后面的處理:
1
2
3
4
5
6
7
8
|
if ( $user = model( 'Member' )->field( 'id' )->where( array ( 'third_id' => $openid ))->find()) { $data = array ( 'id' => $id , 'uid' => $user [ 'id' ] ); model( 'LoginQrcode' )->isUpdate()->save( $data ); return array ( '登陸成功' , 'text' ); } |
如果滿足條件,并且存在該openid的用戶,則更新login_qrcode表,將uid改為用戶id。(這里就是關鍵,為什么更新了id對應的那條數據的uid為用戶id就算登錄了呢)。
3、繼續看PC端,PC段在獲取1中的二維碼之后并沒有停止請求,而是輪訓了一個方法:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
|
* 微信登錄異步請求 * @ return \think\response\Json * created by sunnier<[email protected]> */ public function ajaxWechatLogin(){ for ( $i = 0; $i < 6; $i ++) { $database_login_qrcode = model( 'LoginQrcode' ); $condition_login_qrcode [ 'id' ] = input( 'get.qrcode_id' ); if ( empty ( $condition_login_qrcode [ 'id' ])){ return $this ->returnJson( '未獲取到qrcode_id!' ,0); } $now_qrcode = $database_login_qrcode ->field( '`uid`' )->where( $condition_login_qrcode )->find(); if (! empty ( $now_qrcode [ 'uid' ])) { if ( $now_qrcode [ 'uid' ] == -1) { $data_login_qrcode [ 'uid' ] = 0; $database_login_qrcode ->where( $condition_login_qrcode )->isUpdate(true)->save( $data_login_qrcode ); return $this ->returnJson( '請在微信公眾號點擊授權登錄!' ,0); } $database_login_qrcode ->where( $condition_login_qrcode )-> delete (); $result = model( 'Member' )->autologin( 'id' , $now_qrcode [ 'uid' ]); if ( empty ( $result [ 'error_code' ])) { return $this ->returnJson( '登錄成功!' ,1, $result [ 'user' ]); } else if ( $result [ 'error_code' ] == 1001) { return $this ->returnJson( '沒有查找到用戶,請重新掃描二維碼!' ,0); } else if ( $result [ 'error_code' ]) { return $this ->returnJson( '登陸失敗!' ,0); } } if ( $i == 5) { return $this ->returnJson( '登陸失敗' ,0); } sleep(3); } } |
可以看到上面方法獲取了qrcode_id,也就是1中返回的那個id,另一個返回就是二維碼了。
輪訓過程就是用這個id不斷查看login_qrcode表的狀態,如果存在了uid那么證明登陸成功!也就可以用其中的uid自動登錄了。
4、以上
關鍵就是login_qrcode這個中間表起了橋梁的作用,一邊用來生成二維碼,一邊用來在微信端插入用戶uid,同時PC端檢測表的狀態變化從而實現了登錄。
三、代碼倉庫
https://git.oschina.net/kebenxiaoming/erwmlogin1
直接clone即可,有問題提issue或者單獨私我
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持服務器之家。