전체 흐름 요약


[사용자 요청] /find/check/userid.do?name=xxx&email=yyy
      ↓
[IDCheckController.doGet()]
      ↓ (userservice.findUserByNameAndEmail)
[UserService.findUserByNameAndEmail()]
      ↓ (dao.selectUserByNameAndEmail)
[UserDAO.selectUserByNameAndEmail()] → DB 조회
      ↑ (UserDTO 반환)

  ┌─────────────────────────────────────────┐
  │ 조건: DB에 (name, email) 일치하는 회원 존재 시 │
  │   ↓                                     │
  │ userservice.sendEmailCode(email)        │
  │   ↓ 인증번호 이메일 발송 및 코드 반환     │
  │ 세션에 인증코드, UserDTO 저장             │
  └─────────────────────────────────────────┘

      ↓
[IDCheckController] JSON 응답: { uid: 회원ID or "인증실패", code: 인증번호 }
      ↓
[클라이언트 JS] 인증번호 입력 및 검증 후
      ↓
인증 성공 → 다음 페이지 이동 허용

정리

항목 내용
페이지/기능명 아이디 찾기 - 이메일 인증 기능
사용 기술 JSP, Servlet, Java, AJAX(fetch), JSON, SMTP 이메일 발송
주요 흐름 Controller → Service → DAO → DB 조회 → 이메일 발송 → 세션 저장 → JSON 응답 → JS 인증 처리
클라이언트 처리 fetch API 비동기 요청 → 이메일 인증번호 전송 및 확인 → 인증 성공 시 다음 단계 이동 가능
설계 의도 인증 절차 분리 및 서버 세션 활용으로 보안 강화, 비동기 처리로 UX 향상

[1] findUserId.jsp — 아이디 찾기 화면 (일부 발췌)

<form name="formRegister">
  <input type="text" name="name" placeholder="이름 입력" />
  <input type="email" name="email" placeholder="이메일 입력" required />
  <button id="btnSendEmail">인증번호 받기</button>
  <span class="emailResult"></span>

  <input type="text" name="authCode" placeholder="인증번호 입력" required />
  <button id="btnAuthCode">확인</button>
  <span class="codeResult"></span>

  <a href="#" id="next">다음</a>
</form>

설명

[2] 클라이언트 JavaScript 인증 로직 (요점)

btnSendEmail.onclick = async function(event){
  event.preventDefault(); // 기본 폼 제출 방지
  if(preventDoubleClick) return; // 중복 클릭 방지

  preventDoubleClick = true;
  const email = formRegister.email.value;
  const name = formRegister.name.value;

  // 서버에 이름과 이메일 파라미터를 붙여 GET 요청 전송
  const response = await fetch(`/farmStory/find/check/userid.do?name=${name}&email=${email}`);
  const data = await response.json();
  code = data.code; // 서버에서 받은 인증번호

  if(data.uid !== "인증실패") {
    emailResult.innerText = '이메일로 인증번호를 발송했습니다.';
    emailResult.style.color = 'green';
    auth.style.display = 'block'; // 인증번호 입력 폼 보이기
    preventDoubleClick = false;
  } else {
    emailResult.innerText = '이메일이 일치하지 않습니다.';
    emailResult.style.color = 'red';
  }
}

btnAuthCode.onclick = function(event){
  event.preventDefault();
  if(code === formRegister.authCode.value) {
    codeResult.innerText = '인증에 성공하셨습니다.';
    codeResult.style.color = 'green';
    nextBtnClick = true; // 다음 단계 이동 가능 플래그
  } else {
    codeResult.innerText = '인증에 실패하셨습니다.';
    codeResult.style.color = 'red';
  }
}

next.onclick = function(event){
  event.preventDefault();
  if(nextBtnClick) {
    location.href = "./resultUserId.do"; // 인증 성공 후 결과 페이지 이동
  } else {
    alert("인증하세요"); // 인증하지 않으면 이동 불가
  }
}

설명