二维码扫码登录详解【附简易实例代码(html+php+ios)】

1.前言

      我们在写一个不太了解的新功能的时候，又稳又快的一个方法就是借(chao)鉴(xi)其他的人的实现方法。所以我们先不急着开始写代码，先看一下各互联网巨头都是如何实现的。

首先来看一下淘宝的扫码登录:

F12调出控制台，可以看出淘宝一直在发送请求查看这个二维码的状态

可以看出京东也是这么做的，看到这里大家都有点思路了把

2.准备

接着我们还是不着急写代码，先把思路理清楚。这里我们采用前后端分离的方法来实现这个功能(暂不考虑二维码过期、该二维码登录过一次等复杂情况，只实现扫码登录功能)。

      2.1 首先梳理一下要准备的PHP接口，一共有3个：

          1.让前端页获取唯一的QRUUID(唯一字符串就可以)生成一个二维码用的接口。
         2.APP端扫描到QRUUID后去请求的接口，功能是把用户和这个QRUUID绑定(可以传User_id或者token什么的，具体看需求)。
         3.前端在获取到第一个的接口返回的QRUUID后去轮询请求的接口，功能是查询这个QRUUID是不是被APP端扫描并绑定。

      2.2 然后是HTML页的主要实现：

          其实就是Ajax请求PHP接口获得QRUUID然后生成二维码，接着使用setInterval() 方法去请求第三个PHP接口。(前端生成二维码的开放API：http://www.topscan.com/pingtai/)

      2.3 最后是APP端(以iOS为例)的实现：

          使用AVFoundation扫描二维码获得信息，然后请求PHP接口将用户数据和QRUUID绑定。

3.代码

      3.0 简易数据库表：

DROP TABLE IF EXISTS `qrcodelogin`;
CREATE TABLE `qrcodelogin` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `qruuid` varchar(15) NOT NULL DEFAULT '',
  `user_id` int(11) DEFAULT NULL,
  `user_token` varchar(255) DEFAULT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB;

SET FOREIGN_KEY_CHECKS = 1; 

      3.1 先放上PHP的3个接口的代码：

<?php
//config.php 数据库配置文件
$db_host = '192.168.1.103';
$db_name = 'test';
$db_user = 'root';
$db_pwd = 'a123456';

<?php
/**
 * getqruuid.php
 * 用于前端获取qruuid(二维码唯一ID)使用
 *
 * User: caohan
 */

require('config.php'