Maison > Article > interface Web > Implémentation et analyse technique du code de vérification généré par les compétences js_javascript

Implémentation et analyse technique du code de vérification généré par les compétences js_javascript

WBOYoriginal: 2016-05-16 16:36:121245parcourir

Partagez avec vous un morceau de code js pour générer et vérifier le code de vérification

<!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>

Comme nous le savons tous, js est côté client, est-il donc logique de faire toutes les vérifications côté client ? Ou le code de vérification généré à partir du serveur doit-il être sécurisé ? Le code de vérification généré par le frontal est-il sûr ?

Le code de vérification est dynamique, mais doit être reconnu par le client et renvoyer la valeur correcte pour une vérification normale. Il s'agit d'un problème de processus. S'il s'agit de js, il est vérifié sur le client, ce qui est fondamentalement le même ! ! ! Il est préférable de le générer sur le serveur, de le vérifier sur le client, de le confirmer sur le serveur et de le parcourir normalement. Un tel processus est infaillible

Donc, cet article n'est qu'une discussion technique, veuillez ne pas l'utiliser dans des projets de production réels

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：La zone de saisie filtre les compétences js code_javascript non numériquesArticle suivant：La zone de saisie filtre les compétences js code_javascript non numériques

Articles Liés

Voir plus