Heim > Artikel > Web-Frontend > Implementierung und technische Analyse des durch js_javascript-Kenntnisse generierten Verifizierungscodes

Implementierung und technische Analyse des durch js_javascript-Kenntnisse generierten Verifizierungscodes

WBOYOriginal: 2016-05-16 16:36:121243Durchsuche

Teilen Sie einen Teil des JS-Codes mit, um den Bestätigungscode zu generieren und zu überprüfen

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JS生成验证码</title>
<style type="text/css">
.code {
background-image: url(code.jpg);
font-family: Arial;
font-style: italic;
color: Red;
border: 0;
padding: 2px 3px;
letter-spacing: 3px;
font-weight: bolder;
}
.unchanged {
border: 0;
}
</style>
<script language="javascript" type="text/javascript"> 
var code; //在全局 定义验证码  
function createCode() {
  code = "";
  var codeLength = 6;//验证码的长度  
  var checkCode = document.getElementById("checkCode");
  var selectChar = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9,'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z');//所有候选组成验证码的字符，当然也可以用中文的  
 
  for (var i = 0; i < codeLength; i++) {
    var charIndex = Math.floor(Math.random() * 36);
    code += selectChar[charIndex];
  }
  //alert(code);
  if (checkCode) {
    checkCode.className = "code";
    checkCode.value = code;
  }
}
 
function validate() {
  var inputCode = document.getElementById("input1").value;
  if (inputCode.length <= 0) {
    alert("请输入验证码！");
  } else if (inputCode != code) {
    alert("验证码输入错误！");
  createCode();//刷新验证码  
  } else {
  alert("^-^ OK");
  }
}
</script>
</head>
<body onload="createCode()">
<form action="#">
  <input type="text" id="input1" /> <input type="text" onclick="createCode()" readonly="readonly" id="checkCode" class="unchanged" style="width: 80px" /><br />
  <input id="Button1" onclick="validate();" type="button" value="确定" />
</form>
</body>
</html>

Wie wir alle wissen, ist js clientseitig. Ist es also sinnvoll, die gesamte Überprüfung auf der Clientseite durchzuführen? Oder muss der vom Server generierte Verifizierungscode sicher sein? Ist der vom Frontend generierte Bestätigungscode sicher?

Der Verifizierungscode ist dynamisch, muss aber vom Client erkannt werden und für die normale Verifizierung den korrekten Wert zurückgeben. Dies ist ein Prozessproblem. Wenn es sich um js handelt, wird es auf dem Client überprüft, was im Grunde dasselbe ist! ! ! Am besten generieren Sie es auf dem Server, überprüfen es auf dem Client, bestätigen es auf dem Server und durchsuchen es normal. Ein solcher Prozess ist narrensicher

Dieser Artikel ist also nur eine technische Diskussion, bitte verwenden Sie ihn nicht in tatsächlichen Produktionsprojekten

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Das Eingabefeld filtert nicht-numerische JS-Code_Javascript-KenntnisseNächster Artikel：Das Eingabefeld filtert nicht-numerische JS-Code_Javascript-Kenntnisse

In Verbindung stehende Artikel

Mehr sehen