一区二区三区在线-一区二区三区亚洲视频-一区二区三区亚洲-一区二区三区午夜-一区二区三区四区在线视频-一区二区三区四区在线免费观看

服務器之家：專注于服務器技術及軟件下載分享
分類導航

PHP教程|ASP.NET教程|Java教程|ASP教程|編程技術|正則表達式|C/C++|IOS|C#|Swift|Android|VB|R語言|JavaScript|易語言|vb.net|

服務器之家 - 編程語言 - PHP教程 - PHP+jQuery 注冊模塊的改進（一）：驗證碼存入SESSION

PHP+jQuery 注冊模塊的改進（一）：驗證碼存入SESSION

2020-07-31 16:36小dee PHP教程

本文主要是對上一篇文章模進行改進，把驗證碼寫入SESSION而不是把驗證碼的文字返回客戶端的隱藏域，否則驗證碼的意義就不復存在啦

需要修改的幾個文件：

①register.php 生成隨機數和加密值

把register.html改為register.php，并開啟session；

把register.js中生成隨機數的函數寫在register.php中，并改用php方法

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
<?php session_start();?>
....
<?php
      
  //生成隨機數函數
  function showval(){
 
    $num = "";
    for($i=0;$i<4;$i++){
 
      $tmp = rand(1,15);
      if ($tmp > 9) {
        switch ($tmp) {
          case(10):
            $num .= 'a';
            break;
          case(11):
            $num .= 'b';
            break;
          case(12):
            $num .= 'c';
            break;
          case(13):
            $num .= 'd';
            break;
          case(14):
            $num .= 'e';
            break;
          case(15):
            $num .= 'f';
            break;
          }
        } else {
          $num .= $tmp;
          } 
        }
      return $num;
    }
  
  //生成隨機數
  $mdnum = md5(showval());
  
  //把隨機數和經過加密的隨機數都存入session
  $_SESSION['num'] = showval();
  $_SESSION['mdnum'] = $mdnum; 
?>
  <!--驗證碼-->
  <div class="ipt iptend">
    <input type='text' id='yzm' name='yzm' placeholder="驗證碼" autocomplete="off" />
    <img id='yzmpic' src='valcode.php?num=<?php echo $mdnum;?>' style="cursor:pointer" title="驗證碼" alt="驗證碼">
    <a style="cursor:pointer" id='changea'>
      <img id="refpic" src="templets/images/ref.jpg" alt="刷新驗證碼">
    </a>
    <span id='yzmchk'></span>
  </div>

把生成的4位驗證碼和經過md5加密的驗證碼都存入session，而客戶端驗證碼圖片的src屬性的參數則是那個加密過的值，因此在客戶端不會出現四位驗證碼的文字。

②valcode.php 把隨機數寫入圖形

在register.php中，驗證碼圖片的地址是

<img id='yzmpic' src='valcode.php?num=<?php echo $mdnum;?>' >

因此在valcode.php中，需要做相應修改，修改之處是把原來的：

//直接傳送客戶端輸入的值$num = $_GET['num'];

修改為：

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
session_start();
header("content-type:image/png");
 
  //session中保存生成的4位隨機數和經過ms5加密的隨機數
  if(isset($_SESSION['mdnum']) && $_SESSION['mdnum']!=""){
  
    $mdnum = $_SESSION['mdnum'];
    
    if(isset($_GET['num']) && $_GET['num']!=""){
  
      //當注冊頁傳遞過來的num和session中經過加密的隨機數相等時
      if($_GET['num'] == $mdnum){
      
        if(isset($_SESSION['num']) && $_SESSION['num']!="")
 
          //把session中保存的4位隨機數賦給$num
          $num = $_SESSION['num'];
      }
    }
}

即客戶端圖片傳遞過來的加密的參數同session中保存的加密過的值相同時，就把session中保存的4位驗證碼寫入圖形。

valcode.php的完整代碼為：

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<?php
 
  session_start();
  header("content-type:image/png");
 
  //session中保存生成的4位隨機數和經過ms5加密的隨機數
  if(isset($_SESSION['mdnum']) && $_SESSION['mdnum']!=""){
  
    $mdnum = $_SESSION['mdnum'];
    
    if(isset($_GET['num']) && $_GET['num']!=""){
  
      //當注冊頁傳遞過來的num和session中經過加密的隨機數相等時
      if($_GET['num'] == $mdnum){
      
        if(isset($_SESSION['num']) && $_SESSION['num']!="")
 
          //把session中保存的4位隨機數賦給$num
          $num = $_SESSION['num'];
      }
    }
  }
 
  $imagewidth = 150;
  $imageheight = 54;
  
  //創建圖像
  $numimage = imagecreate($imagewidth, $imageheight);
  
  //為圖像分配顏色
  imagecolorallocate($numimage, 240,240,240);
 
  //字體大小
  $font_size = 33;
  
  //字體名稱
  $fontname = 'arial.ttf';
  
  //循環生成圖片文字
  for($i = 0;$i<strlen($num);$i++){
    
    //獲取文字左上角x坐標
    $x = mt_rand(20,20) + $imagewidth*$i/5;
    
    //獲取文字左上角y坐標
    $y = mt_rand(40, $imageheight);
    
    //為文字分配顏色
    $color = imagecolorallocate($numimage, mt_rand(0,150), mt_rand(0,150), mt_rand(0,150));
    
    //寫入文字
    imagettftext($numimage,$font_size,0,$x,$y,$color,$fontname,$num[$i]);
  }
  
  //生成干擾碼
  for($i = 0;$i<2200;$i++){
    $randcolor = imagecolorallocate($numimage, rand(200,255), rand(200,255), rand(200,255));
    imagesetpixel($numimage, rand()%180, rand()%90, $randcolor);
  }
  
  //輸出圖片
  imagepng($numimage);
  imagedestroy($numimage);
 
?>

③register.js進行驗證

驗證部分改為使用Ajax進行驗證，把輸入的4位驗證碼傳遞給chkyzm.php文件，和session中保存的4位驗證碼進行對比。

刷新圖片時，重新生成4位驗證碼，并和加密驗證碼一起寫入session。重新生成驗證碼的代碼寫在了refresh.php中，并在register.js中使用ajax來請求重新生產的4位驗證碼和加密驗證碼，并通過jQuery把加密驗證碼的值作為圖片的src屬性的參數，經過參數和session比對后valcode.php會重新生成4位驗證碼的圖片

register.js驗證碼部分的代碼為：

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
//驗證碼按鈕
$("#refpic").hover(function(){
    
      $(this).attr("src","templets/images/refhover.jpg");
    },function(){
    
      $(this).attr("src","templets/images/ref.jpg");
    }).mousedown(function(){
    
      $(this).attr("src","templets/images/refclick.jpg");
    }).mouseup(function(){
    
      $(this).attr("src","templets/images/ref.jpg");
    });
    
 
    //刷新驗證碼
    function postyzm(){
    
      $.post("./../refresh.php",function(data,textStatus){
      
        $('#yzmpic').attr("src","valcode.php?num="+data);
      })
    }
 
    $('#yzmpic').click(function(){
    
      postyzm();
    });
 
     $('#changea').click(function(){
    
      postyzm();
    });
 
    //驗證碼檢驗
    function yzmchk(){
        
      $.post("./../chkyzm.php",{
            
        //要傳遞的數據
        yzm : $("#yzm").val()
      },function(data,textStatus){
        
        if(data == 0){
        
          success($("#yzmchk"),"");
          yzmval = true;
        }else if(data == 1){
        
          var noticeMsg = '驗證碼不能為空';
          notice($("#yzmchk"),noticeMsg);
        }else{
        
          var errorMsg = '請輸入正確的驗證碼';
          error($("#yzmchk"),errorMsg);
        }
      });
      
    }
 
    //驗證碼的blur事件
    $("#yzm").focus(function(){
    
      var noticeMsg = '不區分大小寫';
      notice($("#yzmchk"),noticeMsg);
    }).click(function(){
    
      var noticeMsg = '不區分大小寫';
      notice($("yzmdchk"),noticeMsg);
    }).keydown(function(){
      
      if(event.keyCode == 13){       
        
        //檢驗
        yzmchk();
      }
    }).keyup(function(){
    
      if(event.keyCode == 13){       
        
        //提交
        formsub();
      }
    }).blur(function(){
    
      yzmchk();
});

chkyzm.php

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<?php
session_start();
header("charset=utf-8");
 
if(isset($_POST['yzm']) && $_POST['yzm']!=""){
 
  $yzm = $_POST['yzm'];
 
  if(isset($_SESSION['num']) && $_SESSION['num']!=""){
 
    //當輸入的驗證碼和session里保存的num一致時
    if(strtolower($yzm) == $_SESSION['num']){
    
      //輸入正確
      $state = 0;
    }else{
    
      //輸入錯誤
      $state = 2;
    }
  }
}else{ 
  
  //沒有輸入
  $state = 1;
}
echo $state;
?>

refresh.php

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<?php
 
session_start();
 
//生成驗證碼
function showval(){
 
  $num = "";
  for($i=0;$i<4;$i++){
 
    $tmp = rand(1,15);
    if ($tmp > 9) {
      switch ($tmp) {
        case(10):
          $num .= 'a';
          break;
        case(11):
          $num .= 'b';
          break;
        case(12):
          $num .= 'c';
          break;
        case(13):
          $num .= 'd';
          break;
        case(14):
          $num .= 'e';
          break;
        case(15):
          $num .= 'f';
          break;
      }
    } else {
      $num .= $tmp;
    } 
  }
  return $num;
}
 
$_SESSION['num'] = showval();
$_SESSION['mdnum'] = md5(showval());
 
echo $_SESSION['mdnum'];

顯示的效果如圖：

PHP+jQuery 注冊模塊的改進（一）：驗證碼存入SESSION

 

總結：

5個步驟：把4位驗證碼寫入session再生成圖片，客戶端圖片的參數使用加密的驗證碼，把輸入的字符同SESSION中的4位驗證碼進行比對，刷新圖片重新生成4位驗證碼并存入session，把重新生產的加密驗證碼作為圖片的src參數

用圖可表示為：

PHP+jQuery 注冊模塊的改進（一）：驗證碼存入SESSION

（未完待續）

延伸 · 閱讀

精彩推薦
主站蜘蛛池模板： 99热久久国产精品这里 | 美女禁区视频无遮挡免费看 | 欧美老骚 | 美女沟厕撒尿全过程高清图片 | 乌克兰肥熟 | 四虎影视库永久在线地址 | 国色天香 社区视频 | 亚洲天天做夜夜做天天欢 | 99精品热视频 | 娇妻被朋友征服中文字幕 | 插插好爽爽爽 | 欧美午夜网站 | 91私密保健女子养生spa | 久草色视频 | 好大好深视频 | 四虎影视紧急入口地址大全 | 亚洲精品91在线 | 手机看片一区二区 | 99re8在线精品视频免费播放 | 男gay男gay男gay野外 | 天天做日日做天天添天天欢公交车 | 修修视频在线观看 | 亚洲国产成人精品不卡青青草原 | 久久成人精品免费播放 | 热99精品视频 | 亚洲国产精品久久人人爱 | 欧美日韩中文字幕久久伊人 | 97porm自拍视频区原创 | 成年人免费在线看的惊悚动作片 | 加勒比一本大道香蕉在线视频 | 九九精品免费视频 | caonila国产在线观看 | 黑人巨大爆粗亚裔女人 | 猛男强攻变sao货 | 亚洲品质水蜜桃 | 国产精品igao视频网网址 | 国产精品免费综合一区视频 | 国产一卡二卡3卡4卡四卡在线视频 | 亚洲精品国产AV成人毛片 | 久久全国免费观看视频 | 午夜免费小视频 |