android开发之扫描二维码实现网页登录

扫描登录详细流程:

一. 扫描登录成功的后台数据依托:数据库表
id: int类型并自增
username: 存储本次登录的用户名
randnumber: 随机数,确保当前二维码随机并且唯一,用来标识每一个不同的二维码

二. 在扫描登录的过程中:

1. 需要PC端有携带扫描网页登录的二维码(携带着随机数的信息),同时生成二维码的同时要向服务器保存二维码随机数信息.

2. android客户端想要实现扫码登录就需要进行扫码操作,得到当前二维码的随机数信息,假设客户端实现了扫码登录并且有了用户名信息,客户端可以携带username保存到数据库当中randnumber为扫码得到的随机数信息对应的username字段上.

3. 网页端开始轮询当随机数相同的的数据上是否有对应的username,如果没有继续轮询,如果有则跳转登录.

开发流程:

1. 创建数据库使用XAMPP,它集成了Apache服务器
   ①、配置XAMPP我就不说了
   ②、如果mysql启动不了，报1067错误，那么删除在MySQL安装目录下的Data目录中的ib_logfile0和ib_logfile1两个文件。
   如果成功：
   
   点击MySql的Admin进入：
   
   • 创建数据库
     
   • 点击左侧数据库，创建表：
     

2. PHP网页端生成简单二维码，使用HBuilder开发工具

   • 点击右键创建Web项目：
     
   • 删除项目中没用的文件：
     
   • 同时新建PHP文件：（index.php）
     

   • 生成二维码的api：http://qr.liantu.com/api.php?text=随机数

     • 详情请登录：www.liantu.com/pingtai/
       
     • 使用该api能生成随机的二维码图片：
       

   • 来到HBuilder开发工具中：

     • Code:
       
     • 效果:
       

   • 但问题来了，这样只能生成一种二维码，那怎么让其自动生成不同的二维码呢？– 快使用PHP语言

     • Code：
       

   • 将生成的二维码随机数字保存到数据库当中：

     • 在该项目中新建PHP文件（mysql_connect.php）用于与数据库进行连接
       Code:
       mysql_connect.php
       
       这样数据库连接文件就写好了！
       index.php
       
       这样将randnumber数据写入到数据库当中就基本OK了！
     • 效果：刷新网页端二维码页面，将会把randnumber数据保存到数据库中。
       

3. PHP轮询数据库（判断当前二维码在数据库中拥有的randnumber有没有对应登录的username）

   • 使用JavaScript语言来实现轮询数据库操作：
     ①．异步加载网络：xmlHttp
     ②．将PHP当中的值传递给JavaScript当中：
     < input xxx/>
     randnumber = document.getElementById(xxx).value;

     • 在index.php中的Code：
       
     • 新建polling.php文件：用于执行轮询数据库操作
       

   • 使用JavaScript语言来实现监听扫码登录事件：

     • 当执行了轮询数据库操作之后，我们在index.php文件中添加监听事件：
       
     • 新建welcome.php模拟扫码登录成功后重定向：
       Code：
       Hello Zanelove！
4. PHP自定API接口
   
   • 新建saveUsername.php文件，为了便捷和直白使用的是GET方式，但实际开发当中，你应该要将数据进行加密
     
   • 效果：
     
     

5. Android客户端扫描二维码

   • 在github上下载zxing库：https://github.com/zxing/zxing(功能很多，过于庞大)
     or
     因此，针对二维码我们将使用专门用于扫描二维码的类库：BarCodeLibrary(下载地址：http://pan.baidu.com/s/1sjJmzfv 提取密码: k862)
   • 导入BarCodeLibrary到Eclipse当中

   • 在Eclipse当中创建新项目并依赖于BarCodeLibrary类库

     • Code:

       • MainActivity.java

       public class MainActivity extends Activity implements OnClickListener {    private Button btnScan;    private EditText etUsername;    private static final String WEB_URL = "http://172.31.19.202/QRLogin/";    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        btnScan = (Button) findViewById(R.id.btnScan);        btnScan.setOnClickListener(this);        etUsername = (EditText) findViewById(R.id.etUsername);    }    @Override    public void onClick(View v) {        //扫码操作        Intent intent = new Intent(this, CaptureActivity.class);        startActivityForResult(intent, 0);    }    @Override    protected void onActivityResult(int requestCode, int resultCode, Intent data) {        super.onActivityResult(requestCode, resultCode, data);        if (resultCode == Activity.RESULT_OK) {            String randnumber = data.getExtras().getString("result");            String username = etUsername.getText().toString();            String url = WEB_URL + "saveUsername.php?randnumber=" + randnumber + "&username=" + username;            //访问url            HttpUtils.login(url);        }    }}

       • 连接网络工具类:

       public class HttpUtils{    public static void login(final String url){        new Thread(new Runnable() {            @Override            public void run() {                HttpURLConnection connection;                try {                    connection = (HttpURLConnection) new URL(url).openConnection();                    connection.setRequestMethod("GET");                    connection.getInputStream();                } catch (Exception e) {                    e.printStackTrace();                }            }        }).start();    }}

       • 在清单文件中添加节点:

       <activity    android:name="com.zxing.activity.CaptureActivity"    android:configChanges="orientation|keyboardHidden"    android:screenOrientation="portrait"    android:theme="@android:style/Theme.NoTitleBar.Fullscreen"    android:windowSoftInputMode="stateAlwaysHidden" ></activity>

       • 添加权限:

       <uses-permission android:name="android.permission.CAMERA"/><uses-permission android:name="android.permission.VIBRATE"/><uses-permission android:name="android.permission.INTERNET"/>

6. Android客户端访问自定API实现网页登录
   因为是Android客户端访问PC端网页地址,那么就要有一个概念:”需要IP地址”,只有这样我们才能拼接一串可访问的网页地址!
   cmd -> ipconfig
   
   尝试访问:
   

   Code: 在上面已经实现了!