官术网_书友最值得收藏!

1.5 用戶登錄

1.5.1 用戶登錄功能概述

用戶登錄功能就是對用戶輸入的賬號、密碼及驗證碼進行驗證。驗證包括信息是否為空、驗證碼是否錯誤、用戶計算機是否已經被鎖定、用戶是否存在、用戶是否激活、用戶名和密碼是否匹配、用戶登錄次數是否達到上限等。登錄功能的運行結果如圖1.12所示。

圖1.12 單擊“登錄”按鈕后的運行結果

登錄功能有3個核心文件,分別是login.php(用戶登錄頁)、login.js(登錄信息驗證腳本)和login_chk.php(登錄處理頁)。

1.5.2 登錄頁面設計

1.登錄頁中的元素名稱和屬性

相對于注冊頁面來說,登錄頁(login.php)中的表單元素要少很多,也沒有那么復雜。登錄頁元素名稱和屬性值如表1.2所示。

表1.2 登錄頁中的元素名稱和屬性

2.登錄信息驗證腳本(login.js)

在登錄頁login.php中,載入了login.js腳本文件,通過該腳本文件完成對登錄用戶的所有驗證操作,其代碼如下:

      function $(id){
            return document.getElementById(id);
      }
      window.onload = function(){
            …
      }

接下來的函數功能是焦點自動下移。當焦點移動到最后一個文本框即驗證碼輸入框后,再次按下<Enter>鍵,將調用chklg()函數對用戶輸入的信息進行驗證,代碼如下:

            $(' lgname' ).focus();                      //光標定位到用戶名輸入框
            $(' lgname' ).onkeydown = function(){       //處理用戶名輸入庫的鍵盤按下事件
                if(event.keyCode == 13){                //當按下<Enter>鍵時,光標自動下移
                    $(' lgpwd' ).select();              //密碼框獲取焦點
                }
            }
            $(' lgpwd' ).onkeydown = function(){
                if(event.keyCode == 13){                //處理密碼框的鼠標按下事件
                    $(' lgchk' ).select();              //驗證碼文本框獲得焦點
                }
            }
            $(' lgchk' ).onkeydown = function(){        //處理驗證碼輸入框的鼠標按下事件
                if(event.keyCode == 13){
                    chklg();                            //調用chklg()函數
                }
            }
            $(' lgbtn' ).onclick = chklg;

接下來的代碼是進行最基本的檢測,包括用戶名要合法、信息不能為空、驗證碼輸入錯誤等,代碼如下:

      function chklg(){
              /*判斷用戶名是否合法,用戶名第一位必須是英文字母,不允許有特殊字符*/
              if($(' lgname' ).value.match(/^[a-zA-Z_]\w*$/) == null){
                  alert(’請輸入合法名稱’);
                  $(' lgname' ).select();
                  return false;
              }
              /*用戶名是否為空*/
              if($(' lgname' ).value == ' ' ){
                  alert(’請輸入用戶名!' );
                  $(' lgname' ).focus();
                  return false;
              }
              /*密碼是否為空*/
              if($(' lgpwd' ).value == ' ' ){
                  alert(’請輸入密碼!' );
                  $(' lgpwd' ).focus();
                  return false;
              }
              /*驗證碼是否為空*/
              if($(' lgchk' ).value == ' ' ){
                  alert(’請輸入驗證碼’);
                  $(' lgchk' ).select();
                  return false;
              }
              /*驗證碼輸入是否正確*/
              if($(' lgchk' ).value ! = $(' chknm' ).value){
                  alert(’驗證碼輸入錯誤’);
                  $(' lgchk' ).select();
                  return false;
              }

接下來,判斷客戶端的Cookie值是否大于3,如果大于3,說明用戶是非法操作的,將停止繼續執行,代碼如下:

              count = document.cookie.split(' ; ' )[0];             //獲取Cookie信息
              if(count.split(' =' )[1] >= 3){
                  alert(’因為您的非法操作,您將無法再執行登錄操作’);
                  return false;
              }

最后,將用戶輸入的信息傳遞給login_chk .php頁進行處理,代碼如下:

              url = ' login_chk.php? act=' +(Math.random())+' &name=' +$(' lgname' ).
              value+' &pwd=' +$(' lgpwd' ).value;
              xmlhttp.open(' get' , url, true);
              xmlhttp.onreadystatechange = function(){
                  if(xmlhttp.readystate == 4){
                      if(xmlhttp.status == 200){
                            //獲取login_chk.php頁的返回值
                            msg = xmlhttp.responseText;
                            if(msg == '0' ){
                              alert(’您還沒有激活,請先登錄郵箱進行激活操作。' );
                            }else if(msg == '1' ){
                              alert(’用戶名或密碼輸入錯誤,您還有2次機會’);
                              $(' lgpwd' ).select();
                            }else if(msg == '2' ){
                              alert(’用戶名或密碼輸入錯誤,您還有1次機會’);
                              $(' lgpwd' ).select();
                            } else if(msg == '4' ){
                              alert(’用戶名輸入錯誤’);
                              $(' lgname' ).select();
                            } else if(msg == ' -1' ){
                              alert(’登錄成功’);
                              location = ' main.php' ;
                            }else{
                              alert(msg);
                            }
                      }
                  }
              }
              xmlhttp.send(null);
            }

1.5.3 登錄處理頁

在登錄處理頁(login_chk.php)中,對表單中提交的用戶名、密碼進行驗證,包括用戶名是否存在、用戶名是否被激活、用戶登錄次數、密碼是否正確等,最終返回驗證結果,其代碼如下:

      <? php
            session_start();                                     //開啟Session支持
            header(' Content-Type:text/html; charset=gb2312' ); //設置頭信息
            include_once ' conn/conn.php' ;                      //載入數據庫類
            $name = $_GET[' name' ];
            $pwd = $_GET[' pwd' ];                               //獲取名稱和密碼
            if(! empty($name) and ! empty($pwd)){
              //得到當前數據表中的count字段和active字段
              $sql = "select name, count, active from tb_member where name =
              '".$name."' ";
              $active = $conne->getFields($sql,2);
              $count = $conne->getFields($sql,1);
              $conne->close_rst();
              //判斷用戶是否存在
              if($active == ' ' ){
                  if(is_null($_COOKIE[' count' ]) or $_COOKIE[' count' ] == 0){
                      setcookie(' count' ,1);
                  }else{
                      setcookie(' count' , $_COOKIE[' count' ]+1);
                  }
                  $reback = 4;
              }else if($active == 0){                      //判斷用戶是否被激活
                  $reback = '0' ;
              }else if($count >= 3){
                  $reback = '3' ;                          //判斷用戶的登錄次數
              }else{
                  $sql .= " and password = ' ".md5($pwd)."' ";
                  $num = $conne->getRowsNum($sql);
                  if($num == 0 or $num == ' ' ){           //如果用戶密碼錯誤,登錄次數加1
                      $num = $conne->uidRst("update tb_member set count = ".
                      ($count+1)." where name = ' ".$name."' ");
                      $reback = ($count+1);
                  }else{                                   //登錄成功,清空count字段值
                      if($count ! = 0){
                          $num = $conne->uidRst("update tb_member set count = 0 where
                          name = ' ".$name."' ");
                      }
                      //設置cookie
                      if(isset($_COOKIE[' count' ]) and $_COOKIE[' count' ] ! = 0){
                          setcookie(' count' ,0);
                      }
                      $_SESSION[' name' ] = $name;
                      $reback = ' -1' ;
                  }
              }
            }
            echo $reback;
      ?>

1.5.4 生成及刷新驗證碼

驗證碼生成應用的是GD2函數庫中的函數,操作存儲于valcode.php文件中,其完整代碼可以參考本章1.2.3節,這里不再贅述。

當頁面第一次被載入時,將執行login.js中的showval()函數來生成驗證碼,并且調用valcode.php文件以圖像形式輸出驗證碼。因為驗證碼中帶有干擾串,如果用戶看不清,可以單擊首頁中“看不清”超鏈接來再次執行shwoval()函數,即刷新驗證碼。login.js腳本中showval()函數的代碼如下:

      showval();                                       //調用showval()函數生成圖文驗證碼
      $(' changea' ).onclick = showval;                //更換驗證碼
            //驗證碼生成函數
            function showval(){
              num = ' ' ;
              for(i=0; i<4; i++){
                    …                                 //生成隨機數,見第1.2.3節
              }
              $(' chkid' ).src=' valcode.php? num=' +num; //顯示圖片驗證碼
              $(' chknm' ).value = num;                //將驗證碼保存到chknm隱藏域
            }
主站蜘蛛池模板: 通海县| 获嘉县| 江城| 永济市| 南宫市| 页游| 宁南县| 新兴县| 湛江市| 枝江市| 莱阳市| 许昌县| 建德市| 滨州市| 台东市| 芦溪县| 丰县| 新河县| 贵定县| 武宁县| 平果县| 浙江省| 肥西县| 石棉县| 陈巴尔虎旗| 临夏县| 大荔县| 恭城| 昌黎县| 康马县| 屏山县| 靖安县| 长兴县| 牙克石市| 山西省| 家居| 乌拉特后旗| 宁阳县| 万宁市| 滨州市| 山阳县|