Node.js를 이용해서 OTP 인증 구현하기_인증 코드 검증 및 인증 오류 발생 시 대처

이애옹·2023년 10월 16일
0
post-thumbnail

저번 글에서는 QR코드를 생성하는것까지 완료되었고, 이제 QR 코드를 검증 해 주는 부분이 추가 되어야 한다.

QR 코드가 추가된 페이지에 접속하기 위해서 Google Authenticatormicrosoft Authenticator등을 이용해서 QR을 찍고, 생성된 OTP 번호를 찍어줄텐데 이 OTP 번호가 생성된 번호와 맞는 번호인지 확인을 하는 코드가 필요하다.

📌 QR 코드 검증하기

// verifyOTP 함수 정의, 2단계 인증 (TOTP) 토큰을 검증
const verifyOTP = (secret, secure_code) => {
  // speakeasy 모듈에서 totp.verify 메서드를 사용하여 TOTP 토큰 검증
  var verified = speakeasy.totp.verify({
    secret: secret,       // 검증할 TOTP 토큰의 비밀키
    encoding: "base32",   // 비밀키 인코딩 방식 (base32 사용)
    algorithm: 'sha512',  // 해시 알고리즘 지정 (SHA-512 사용)
    token: secure_code    // 사용자가 입력한 TOTP 토큰
  });

  // 검증 결과를 반환 (true: 유효한 토큰, false: 유효하지 않은 토큰)
  return verified;
}

다음과 같이 입력 해 주면 된다~~ 사용자와 입력한 값과 생성된 secret Key 가 일치하는지 확인 해 주는 부분인데, 유효할 경우 true, 유효하지 않을 경우 false를 반환 해 준다.

📌 검증 후 단계 구현하기

verify = verifyOTP(생성된 토큰값, 사용자 입력값);
              
if(verify == true){
	 // 인증 성공 했을 경우 소스코드
     loginResult.message = 'OTP코드가 일치합니다.';
}else{
	// 인증 실패 했을 경우 소스코드
     loginResult.message = 'OTP코드가 일치하지 않습니다.';
}

이건 간단하게 작성한거긴한데, 다음과 같은 방식으로 인증 성공 시와 실패 시 코드를 나눠서 작성 해 주면 된다....!!

성공 시 생성된 시크릿키를 DB에 담아주면, 이후 인증 시에는 굳이 QR을 생성하고 인증하는 단계 없이 바로 인증코드만 입력하면 인증 되도록 구현 가능하다. (AWS 2차 인증과 비슷하게 가는 것 같다.)

이제 여기까지 하면 OTP 인증 코드 작성 끝 !!!

❌ OTP 인증이 되지 않을 경우

해당 코드로 QR을 생성 후 생성된 번호를 입력 하자 번호가 일치하지 않는 경우가 발생했었는데, 다음과 같은 방법으로 해결했다!!

🛠️ 서버와 클라이언트 시간이 일치하는지 확인

TOTP 방식은 시간 기반으로 인증이 되기 때문에 서버클라이언트 시간이 일치하는지 확인 해야 한다고 한다.

만약 생성된 인증번호로 인증이 되지 않을 경우 콘솔창을 이용해서 서버와 클라이언트 시간이 일치하는지 확인하는 작업이 필요하다!

  1. iOS에서 표준시 설정하는 방법:
    설정> 일반> 날짜 및 시간> 시간대가 정확하지 확인 > 자동 설정 켜기

  2. Android에서 설정하는 방법
    Google OTP를 열고 오른쪽 상단의 "메뉴" 버튼 클릭 > "설정" 클릭 > "인증 코드 생성에 사용하는 시간 수정"을 클릭 >"지금 동기화"를 클릭

이거는 휴대폰 표준 시간을 설정하는 방식이라고 하니 혹시 일치하지 않다면 확인 !!

🛠️ 소스 코드 확인

시간을 일치 시켜도 오류가 발생한다면 확인 해 봐야 할 부분은

먼저 verifyOTP 부분의 algorithm 이다!!
나 같은 경우 algorithm: 'sha512' 해당 코드가 누락되어있었는데, 이걸 추가하니까 오류가 해결되었다.

그런데 이번에는 또 ios 인증이 실패하는 문제가 생겼다. (그 와중에 google 어플로는 실패하고 microsoft 어플로는 성공함..)

확인 해 보니 speakeasy.otpauthURL 해당 부분에 period : 300 이 선언되어 있었다.

해당 코드는 OTP(Timed One-Time Password) 토큰의 갱신 주기를 설정하는 옵션인데, 300으로 설정하면 토큰이 5분(300초) 마다 갱신된다고 한다..

안드로이드는 이 설정을 무시하는데 ios로 google OTP 어플을 사용하면 이 설정을 무시하지 않는건지 토큰이 갱신이 안되고 있었다.

흠 . . 하여튼 제거하니까 정상적으로 작동됨 !!!!!

👀 참고자료

profile
안녕하세요

0개의 댓글