快捷導(dǎo)航

android實現(xiàn)掃描網(wǎng)頁二維碼進行網(wǎng)頁登錄功能

更新時間：2017年12月05日 08:35:23 作者：丁先森

這篇文章主要介紹了android掃描網(wǎng)頁二維碼進行網(wǎng)頁登錄效果，掃描成功之后跳轉(zhuǎn)進入主頁，具體實現(xiàn)代碼大家參考下本文

先說一下實現(xiàn)了什么效果，app掃描php寫的頁面(也可以java網(wǎng)頁，都一樣的思路和步驟),掃描成功后跳轉(zhuǎn)進入主頁，光和你們這么說，肯定有人說了，沒圖說個jb，這就出來一個問題，很多人寫博客，看這標題特別符合自己的問題，然后興致勃勃的進來了，一看，我去...尼瑪全是代碼，也不知道是不是我的那種問題和想要的那種效果，心里沒譜啊，好了，上圖：

別糾結(jié)這頁面咋這么丑，沒寫樣式，說一下我實現(xiàn)的思路哈，首先在數(shù)據(jù)庫中新建一個表用來存儲掃碼登錄信息(id,username,randomnum),這三個分別是id自增長，用戶名，隨機數(shù)——>點擊生成二維碼，生成隨機數(shù)，可以用

說的簡單的就是，生成二維碼的時候只存入隨機數(shù)(或者你自定義的隨便信息)，使用app掃碼之后根據(jù)隨機數(shù)把用戶名存進去，網(wǎng)頁每隔5s請求另外一個接口時，如果username不為空好了跳轉(zhuǎn)操作。大體就是這樣的，有可能大神的實現(xiàn)也不是這樣的，我就是把我理解的說出來，如果你們有另外的實現(xiàn)方法也可以在下邊評論告訴我，共同學(xué)習(xí)，下面貼代碼了。

部分php(新手可能不太規(guī)范，勿噴)login.php代碼：

else if ($_REQUEST['act'] != '' && $_REQUEST['act'] == 'codeCreate') {
  //if userName為空--->表示網(wǎng)頁第一次點擊新建生成
  //網(wǎng)頁生成二維碼操作，同時添加數(shù)據(jù)到表中
  if ($_REQUEST['userName'] != '') {//不為空的時候表示修改
    $userName = $_REQUEST['userName'];
    $randomNum = $_REQUEST['randomNum'];
    echo "掃碼成功";
    $sql = "update UserCodeLogin set username='$userName' WHERE randomnum='$randomNum'";
//    mysqli_query($conn, $sql);//插入成功
  } else {//為空的時候表示是新建二維碼
    //生成隨機數(shù)
    $randomNum = "";
    for ($i = 0; $i < 5; $i++) {
      $randomNum .= rand(0, 9);
    }
    echo $randomNum;//顯示生成的隨機數(shù)
    $sql = "insert into UserCodeLogin(username,randomnum) VALUES ('','$randomNum')";
//    mysqli_query($conn, $sql);//插入成功
  }
  mysqli_query($conn, $sql);//插入成功

} else if ($_REQUEST['act'] != '' && $_REQUEST['act'] == 'codeSelect') {//根據(jù)隨機數(shù)查詢表中的username是否為空
  $randomNum = $_REQUEST['randomNum'];
  if ($randomNum == '' && empty($randomNum)) {
  } else if ($randomNum != '') {
    $sql = "select username from UserCodeLogin where randomnum='$randomNum'";
    $result = mysqli_query($conn, $sql);
//    print_r($result);
    if (mysqli_num_rows($result) > 0) {
      while ($row = mysqli_fetch_assoc($result)) {
        $userName = $row['username'];
      }
      if ($userName == '' && $userName == null) {
        //說明客戶端還未掃碼修改過
      } else if ($userName != '') {
        //客戶端掃碼完成
        //跳轉(zhuǎn)頁面
        echo "客戶端掃碼成功，跳轉(zhuǎn)中...";
      }
    }
  }

然后是login.html

<html>
<head>
  <title>這是首頁</title>
</head>
<script type="text/javascript" src="js/jquery-1.12.3.js"></script>
<body>
<script type="text/javascript">
  var type = 1;
  var randomNum;

  function clickBtn() {
    $.post("../login.php?act=codeCreate&userName=",
      function (data) {
        alert("-------random:" + data);
        randomNum = data;
        $("#img").attr('src', "http://qr.topscan.com/api.php?text=" + data);
      });
    type = 2;
  }
  function time() {
    $.post("../login.php?act=codeSelect&randomNum=" + randomNum,
      function (data) {
        if (data) {
          alert(data);
          $(location).attr('href', 'index.html');
        } else {
        }
      })
  }
  setInterval("time()", 4000);
</script>
<button type="submit" id="btn" onclick="clickBtn()"> 點擊生成二維碼</button>
<!--src="https://www.baidu.com/img/baidu_jgylogo3.gif"-->
<img id="img" style="visibility: visible" width="250px"/>
</body>
</html>

上邊就是服務(wù)端的部分代碼，放心有源碼，下邊寫完一起給

下面開始android了關(guān)于android的掃碼第三方開源的有挺多的，這里使用的是Zing，他可以實現(xiàn)的挺多的二維碼，條形碼，生成二維碼。。。

建類庫，導(dǎo)jar包，掉用，你們可以直接拿過這個類庫去，然后自己改需要的樣式。

這個圖是目錄結(jié)構(gòu)

主要的就是mainActivity.java里邊的調(diào)用了

掃碼成功之后的回掉：

@Override
  protected void onActivityResult(int requestCode, int resultCode, Intent data) {
    super.onActivityResult(requestCode, resultCode, data);
    // 掃描二維碼/條碼回傳
    if (requestCode == REQUEST_CODE_SCAN && resultCode == RESULT_OK) {
      if (data != null) {
        String content = data.getStringExtra(Constant.CODED_CONTENT);
        result.setText("掃描結(jié)果為：" + content);
        /*執(zhí)行網(wǎng)絡(luò)請求*/
        String username = "dingchao";
        volleyScanCodeLogin(content, username);
        Log.e("aaa","volleyScanCodeLogin。。。3");
      }
    }
  }

volleyScanCodeLogin()方法：

/**
   * 網(wǎng)絡(luò)請求
   * 使用Volley進行網(wǎng)絡(luò)請求
   *
   * @param content 攜帶的隨機數(shù)和用戶名
   * @param username 用戶名
   */
  private void volleyScanCodeLogin(final String content, final String username) {
    Log.e("aaa","volleyScanCodeLogin。。。1");
    final RequestQueue mQueue = Volley.newRequestQueue(MainActivity.this);
    StringRequest stringRequest = new StringRequest(Request.Method.POST, "http://你自己的目錄地址/webcodelogin/login.php", new Response.Listener<String>() {
      @Override
      public void onResponse(String s) {
        Log.e("aaa","volleyScanCodeLogin。。。2");
        Toast.makeText(MainActivity.this, "" + s, Toast.LENGTH_SHORT).show();
      }
    }, new Response.ErrorListener() {
      @Override
      public void onErrorResponse(VolleyError volleyError) {

      }
    }) {
      @Override
      protected Map<String, String> getParams() throws AuthFailureError {
        Map<String, String> map = new HashMap<String, String>();
        map.put("act", "codeCreate");
        map.put("userName", username);
        map.put("randomNum", content);
        return map;
      }
    };
    mQueue.add(stringRequest);/*請求數(shù)據(jù)*/
  }

上邊那些就是主要的工程代碼，然后源碼我打包放到百度云盤中，鏈接：https://pan.baidu.com/s/1slsQM2D 密碼：gdyp

您可能感興趣的文章: