Maison >interface Web >js tutoriel >Exemple de code de fonction de code de vérification de production Web

Exemple de code de fonction de code de vérification de production Web

怪我咯
怪我咯original
2017-07-13 15:19:051857parcourir

Code de vérification (CAPTCHA) est l'abréviation de "Test de Turing public entièrement automatisé pour distinguer les ordinateurs et les humains". Il s'agit également d'un programme public humain entièrement automatique. Il peut empêcher : le piratage malveillant des mots de passe, la fraude aux tickets, l'inondation des forums et empêche efficacement un pirate informatique d'utiliser un programme spécifique pour forcer brutalement un utilisateur enregistré spécifique à se connecter en permanence. En fait, l'utilisation de codes de vérification est une méthode courante pour de nombreux sites Web. maintenant. Nous utilisons Cette fonction est implémentée de manière relativement simple. Cette question peut être générée et jugée par un ordinateur, mais seul un humain peut y répondre. Étant donné que les ordinateurs ne peuvent pas répondre aux questions CAPTCHA, l'utilisateur qui répond aux questions peut être considéré comme un humain

Ce qui suit est un exemple de code pour présenter la fonction de code de vérification Web via un exemple de code. Les amis intéressés peuvent y jeter un œil<.>

Effet de mise en œuvre :

Principe de mise en œuvre :

Générer le code de vérification fourni par le en arrière-plan

Interface, chaque fois que le front-end le demande, le back-end générera une image de code de vérification et un code de vérification est envoyé au client pour affichage par le client <.> Code de vérification

chaîne

Enregistrez-le dans la Session du backend et attendez que le frontend demande à nouveau à l'interface métier de le comparer avec la chaîne du code de vérification dans la session.

Idée d'implémentation :

1. Tout d'abord, le backend fournit une interface qui peut produire des images de code de vérification

2. Le front-end définit le attribut src via img , une interface pour demander la génération de code de vérification.

3. Définissez un événement de clic pour img. Chaque fois que vous cliquez sur img, la valeur src sera modifiée et src sera à nouveau demandé

4. Lorsque vous effectuez des opérations sur l'interface de page, vérifiez si le le code de vérification saisi est correct.

Code d'implémentation :

Front-end :

html :

js :
<p class="centent-top" style=""> 
   <p class="centent-left"><span>*</span>验证码:</p> 
   <input type="text" class="verification-code-input"> 
   <p class="verification-code"><img id="yzm" src="/SchoolRoll/accuser/code/check"></p> 
   <p class="change"><span>看不清?</span><span style="color:#37CAF2;cursor: pointer;" id="changeImgCode">换一张</span></p> 
  </p>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

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