JavaScript 비밀번호를 잘못 입력하여 다시 입력했습니다.

JavaScript 잘못된 비밀번호 재입력

인터넷의 지속적인 발전과 인기로 인해 점점 더 많은 사람들이 온라인 상호작용을 위해 다양한 애플리케이션을 사용하기 시작하고 있으며 이러한 애플리케이션에는 로그인 인증을 위해 계정과 비밀번호가 필요합니다. 계정의 보안을 보장하기 위해 많은 애플리케이션에서는 비밀번호를 잘못 입력한 경우 사용자가 비밀번호를 다시 입력하기 전에 일정 시간 동안 기다려야 하는 메커니즘을 설정합니다. 이 메커니즘을 구현하려면 프로그래밍에 JavaScript를 사용해야 합니다.

이 기사에서는 샘플 프로그램을 사용하여 비밀번호 재시도를 구현하기 위한 JavaScript의 작성 프로세스 및 구현 세부 사항을 자세히 설명합니다.

샘플 프로그램의 요구사항 분석:

이 샘플 프로그램의 요구사항은 다음과 같습니다.

1. 사용자가 로그인에 실패하면 비밀번호를 다시 입력하기 전에 5초를 기다려야 합니다.
2. 사용자는 한 번에 3번 이상 잘못된 비밀번호를 입력할 수 없습니다.
3. 사용자가 잘못된 비밀번호를 3번 연속 입력하면 180초를 기다려야 비밀번호를 다시 입력할 수 있습니다.

위 요구 사항을 기반으로 다음과 같이 JavaScript 코드를 작성할 수 있습니다.

// 定义密码输入错误次数的变量
var count = 0;

// 定义是否需要等待的布尔变量
var wait = false;

// 定义等待时间的变量
var time = 0;

// 监听登录按钮的点击事件
document.getElementById("login").onclick = function() {
   // 获取用户输入的密码和用户名
   var username = document.getElementById("username").value;
   var password = document.getElementById("password").value;
  
   // 判断是否需要等待
   if (wait) {
      // 提示用户需要等待
      alert("请" + time + "秒后重试！");
      return;
   }
  
   // 判断用户名和密码是否正确
   if (username === "admin" && password === "123456") {
      // 登录成功，跳转到主页面
      location.href = "main.html";
   } else {
      // 登录失败，提示用户重新输入密码
      alert("用户名或密码错误！");
      count++;

      // 判断是否需要等待
      if (count >= 3) {
         // 需要等待 180 秒
         count = 0;
         wait = true;
         time = 180;
         setInterval(function() {
            time--;
            if (time == 0) {
               wait = false;
            }
         }, 1000);
      } else {
         // 需要等待 5 秒
         wait = true;
         time = 5;
         setInterval(function() {
            time--;
            if (time == 0) {
               wait = false;
            }
         }, 1000);
      }
   }
}

코드 분석:

위 코드에서는 먼저 사용자의 잘못된 비밀번호를 기록하는 데 사용되는 세 가지 변수 count, wait 및 time을 정의합니다. 횟수, 대기가 필요한지 여부 및 대기 시간.

그런 다음 로그인 버튼의 클릭 이벤트를 수신했습니다. 클릭 이벤트의 핸들러 기능에서 먼저 사용자가 입력한 사용자 이름과 비밀번호를 얻은 다음 기다려야 하는지 여부를 결정합니다. 기다려야 하는 경우에는 사용자에게 기다렸다가 돌아오라는 메시지를 직접 표시하세요.

기다릴 필요가 없으면 입력한 사용자 이름과 비밀번호가 올바른지 확인합니다. 비밀번호가 맞으면 메인 페이지로 이동하고, 비밀번호가 틀리면 비밀번호를 다시 입력하라는 메시지가 표시되며, 비밀번호 입력 횟수가 1씩 늘어납니다.

비밀번호를 3회 이상 잘못 입력한 경우 180초를 기다려야 비밀번호를 다시 입력할 수 있습니다. 대기 프로세스 동안 대기 시간을 true로 설정하고 시간을 180으로 설정하고 setInterval 타이머를 사용하여 대기 시간이 0이 될 때까지 1초마다 1초씩 시간을 줄입니다. 대기 시간이 0이 되면 대기를 false로 설정할 수 있습니다.

비밀번호를 3회 이하로 잘못 입력한 경우 비밀번호를 다시 입력하기 전에 5초를 기다려야 하며 유사한 방법을 사용하여 대기 시간 타이밍 및 제어 기능을 구현합니다.

요약:

위 코드의 도입을 통해 잘못된 비밀번호를 다시 시도하는 JavaScript의 기능은 복잡하지 않고 기본적인 논리적 판단과 타이머 제어만 필요하다는 것을 알 수 있습니다. 물론 구현 중에 일부 입력 보안, 인터페이스 레이아웃 및 기타 요소를 고려해야 합니다. 이러한 요소는 실제 작성 중에 실제 요구에 따라 구체적으로 조정하고 최적화해야 합니다.

위 내용은 JavaScript 비밀번호를 잘못 입력하여 다시 입력했습니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!