Android 实现扫码登录

如今通过扫描二维码然后跳转登录的情形已经很普遍了,这里就来模拟实现一个简单的跳转登录功能

模拟登陆的思路:

  • 建立一张数据表,包含三个字段,分别为主键id,用户名username,随机数randnumber
  • 要生成一张包含有随机数的二维码图片,可以采用联图网(http://www.topscan.com/pingtai/)提供的API接口(http://qr.topscan.com/api.php?text=)只要在链接后缀加上特定文字信息,就可以得到指定的二维码图片了。每生成一张二维码图片,就向数据库插入该随机数,此时用户名字段为空。
  • 客户端如果扫描了二维码图片,就向服务器端发送读取到的随机数以及用户名,通过随机数查找到指定字段,向该字段插入用户名
  • 想要让第二步骤生成的二维码图片知道自己被扫描了然后自动跳转登录,需要第二步骤的生成的网页每隔一段时间就查询username字段是否为空,如果不为空,可知已经被扫描,,从而实现跳转登录

一、搭建服务器端开发环境

为了简化步骤,这里选择集成软件包——XAMPP XAMPP是一个整合型的Apache套件,包含Apache、MySQL、PHP、PERL,可以一键式搭建起开发环境,推荐初学者使用。官方网址——https://www.apachefriends.org/zh_cn/index.html 双击XAMPP安装包开始安装。 选择全部安装

这里写图片描述

运行软件,点击start开启Apache和MySql,如果文字背景颜色变为绿色,说明服务开启成功。如果失败,先检查电脑中是否已经安装了该服务,或者是端口号冲突,有时候安装完成也需要先重启下电脑。

这里写图片描述

双击MySql一行的Admin按钮,如果能启动如下网页,说明一切无误。

这里写图片描述

二、新建数据表

建立数据库scan_code,再新建数据表scancode,包含三个字段,id和randnumber作为联合主键

这里写图片描述

三、服务器端的设计

这里采用php作为开发语言 首先需要连接数据库:mysql_connection.php

<?php
    $con=mysql_connect("localhost","root","");
    mysql_select_db("scan_code");
?>

首页index.php文件主要完成生成二维码图片的操作 生成一个位数为五的随机数字,然后用联图网的API接口生成相应的二维码图片并显示,并将随机数插入到数据库当中

<html>
    <head>
        <title>这是首页</title>
    </head>
    <body>
        <?php
            require 'mysql_connection.php';
            $randnumber = "";
            for ($i = 0; $i < 5; $i++) {
                $randnumber .= rand(0, 9);
            }
            mysql_query("insert into scancode(randnumber) values('$randnumber')");
        ?>
        <img src="http://qr.topscan.com/api.php?text=<?php echo $randnumber; ?>" width="250px" />
    </body>
</html>

在xampp的安装目录下的htdocs文件夹里再新建个文件夹,命名为php,将以上两个php文件放入当中,开启apache服务器与mysql 在浏览器输入:http://localhost/php/index.php 即可看到一张二维码图片,数据表当中也会多出一行数据 打开二维码网页的源码,也可以看到该随机数

这里写图片描述

这里写图片描述

再建立一个welcome.php文件,作为扫码成功后网页跳转到的链接方向,只包含一句欢迎语句即可

<html>
<head>
    <title>欢迎页</title>
</head>
<body>
    你好啊,叶应是叶
</body>
</html>

为了让inde.php页知道有人已经扫描了二维码,需要让之进行一个轮询操作,每隔一段时间查询数据库表 index.php修改为:

<html>
    <head>
        <title>这是首页</title>
    </head>
    <body>
        <?php
            require 'mysql_connection.php';
            $randnumber = "";
            for ($i = 0; $i < 5; $i++) {
                $randnumber .= rand(0, 9);
            }
            mysql_query("insert into scancode(randnumber) values('$randnumber')");
        ?>
        <img src="http://qr.topscan.com/api.php?text=<?php echo $randnumber; ?>" width="250px" />
        <input hidden="hidden" type="text" id="randnumber" value="<?php echo $randnumber; ?>"/>
    </body>
    <script>
        function polling() {
            var xmlHttp;
            if(window.XMLHttpRequest) {
                xmlHttp = new XMLHttpRequest();
            } else {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlHttp.onreadystatechange = function() {
                if(xmlHttp.status == 200 && xmlHttp.readyState == 4) {
                    var result = xmlHttp.responseText;
                    if(result == 'true') {
                        window.location.href = 'welcome.php';
                    }
                }
            }
            var randnumber = document.getElementById("randnumber").value;
            xmlHttp.open("GET", "polling.php?randnumber=" + randnumber, true);
            xmlHttp.send();
        }
        setInterval("polling()", 1000);
    </script>
</html>

代码所进行的操作是:每隔一秒执行一次polling()函数,polling()函数又去异步加载polling.php文件,让polling.php文件去进行数据库查询操作,如果查询到的结果是true,则跳转到welcome.php页面,否则继续查询

数据库查询操作:polling.php文件

<?php
    require 'mysql_connection.php';
    $randnumber = $_GET['randnumber'];
    $result = mysql_query("select * from scancode where randnumber='$randnumber'");
    $row = mysql_fetch_array($result);
    if ($row['username'] != "") {
        echo "true";
    } else {
        echo "false";
    }
?>

此时,如果我们向数据库的username字段插入数据,则index.php页面将自动跳转到welcome.php页面

不过我们不可能总是这样来手动输入数据,所以需要自定义一个接口来自动向数据库输入用户名 这里为了简便,都采用get的方式来提交数据 saveUsername.php:

<?php
    require 'mysql_connection.php';
    $randnumber=$_GET['randnumber'];
    $username=$_GET['username'];
    mysql_query("update scancode set username='$username' where randnumber='$randnumber'");
?>

则如今的操作可简化为:

这里写图片描述

即将“向数据库插入用户名”的操作简化为了访问链接(http://localhost/php/saveUsername.php?username=ye&randnumber=16129)即可,username的值为想要输入的用户名,randnumber为当前二维码页面包含的随机数字

本来,我想在移动端实现扫描二维码的功能,可是找不到适用于Android Studio的二维码扫描开源库,只能作罢

这里提供上述用到的所有php文件:扫码登录

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏我和未来有约会

Kit 3D 更新

Kit3D is a 3D graphics engine written for Microsoft Silverlight. Kit3D was inita...

2586
来自专栏杨龙飞前端

scrollto 到指定位置

2534
来自专栏陈仁松博客

ASP.NET Core 'Microsoft.Win32.Registry' 错误修复

今天在发布Asp.net Core应用到Azure的时候出现错误InvalidOperationException: Cannot find compilati...

4878
来自专栏转载gongluck的CSDN博客

cocos2dx 打灰机

#include "GamePlane.h" #include "PlaneSprite.h" #include "BulletNode.h" #include...

5606
来自专栏魂祭心

原 canvas绘制clock

4174
来自专栏Ceph对象存储方案

Luminous版本PG 分布调优

Luminous版本开始新增的balancer模块在PG分布优化方面效果非常明显,操作也非常简便,强烈推荐各位在集群上线之前进行这一操作,能够极大的提升整个集群...

3205
来自专栏Golang语言社区

【Golang语言社区】GO1.9 map并发安全测试

var m sync.Map //全局 func maintest() { // 第一个 YongHuomap := make(map[st...

4778
来自专栏张善友的专栏

Miguel de Icaza 细说 Mix 07大会上的Silverlight和DLR

Mono之父Miguel de Icaza 详细报道微软Mix 07大会上的Silverlight和DLR ,上面还谈到了Mono and Silverligh...

2717
来自专栏pangguoming

Spring Boot集成JasperReports生成PDF文档

由于工作需要,要实现后端根据模板动态填充数据生成PDF文档,通过技术选型,使用Ireport5.6来设计模板,结合JasperReports5.6工具库来调用渲...

1.2K7
来自专栏C#

DotNet加密方式解析--非对称加密

    新年新气象,也希望新年可以挣大钱。不管今年年底会不会跟去年一样,满怀抱负却又壮志未酬。(不过没事,我已为各位卜上一卦,卦象显示各位都能挣钱...)...

4928

扫码关注云+社区