휴대폰 인증 로직 구현하기

조성철 (JoSworkS)·2020년 2월 25일
22

이번 로그에서는 허위유저의 가입을 방지하기 위해 회원가입을 위한 절차 중 SMS를 이용한 휴대폰 인증 기능을 구현한 것에 대해 다뤄보고자 한다.

휴대폰 인증 개요

부동산 앱의 특성상 개인정보가 확인된 실 사용유저 중심으로 회원가입 절차를 구축하는 작업이 필요하였다. 이를 위해 보편적으로 사용되고 있는 SMS를 이용한 휴대폰 본인인증 확인 과정을 구현하도록 하였다.

이를 위해 고려된 사항으로는 다음과 같다.

  1. 유저에게 랜덤한 4자리의 인증번호를 전송하고, 유저가 다시 응답한 인증번호와 유저에게 보낸 인증번호를 비교한다.
  2. 인증번호가 확인되면 유저 편의를 위하여 해당 휴대폰 번호를 다음 절차에서 다시 입력할 필요 없도록 한다.

회원가입 및 휴대폰 인증 아키텍쳐

이를 위해 휴대폰 인증 과정을 거치는 회원가입 로직은 아래와 같다.

  1. 회원정보를 입력하기 전에 signUp 버튼을 눌러 핸드폰 인증화면으로 이동하도록 한다.
  2. 서버로 인증 번호를 요청하면 해당 api에서 인증번호를 생성하여 twilio Programmable SMS api 통해 유저에게 인증번호를 전송한다.
  3. 인증번호를 확인한 유저는 번호를 화면에 입력하게 되고, 다시 한번 검증과정을 담당하는 서버 api로 요청을 보내게 된다.
  4. 서버에서 최종적으로 인증번호를 확인하면 정상적으로 요청받은 경우 회원정보를 입력하는 스크린으로 이동하게 된다.
  5. 인증번호가 잘못된 경우는 상황에 따른 에러핸들링을 통해 유저에게 alert로 알려준다.

소스코드

./src/controllers/auth.ts

// POST: /auth
const { userPhoneNum } = req.body;

  try {
    tempAuthObj = await twilioHelper.auth(userPhoneNum);

    if (tempAuthObj instanceof Error) {
      res.status(500).json({ error: tempAuthObj.message });
    } else {
      res.sendStatus(200);
    }
  } catch (err) {
    console.error('error is ', err);
    res.status(500).json({ error: err });
  }

./src/controllers/auth.ts

// POST: /auth/verify
const { userVerifyNum, userPhoneNum } = req.body;

  if (userVerifyNum !== undefined && userPhoneNum !== undefined) {
    if (tempAuthObj[userPhoneNum] === Number(userVerifyNum)) {
      delete tempAuthObj[userPhoneNum];
      res.sendStatus(200);
    } else {
      res.sendStatus(401);
    }
  } else {
    if (userPhoneNum === undefined || userPhoneNum === '') {
      res.status(400).json('변경할 휴대폰 번호를 입력해주세요');
    } else if (userVerifyNum === undefined) {
      res.status(400).json('인증번호를 입력해주세요');
    } else {
      res.status(400).json('변경할 휴대폰 번호를 입력해주세요');
    }
  }

구동 테스트

결론

처음에는 nodemailer와 같은 메일을 이용해서 인증번호를 보내는 방식을 고려하였다. 하지만 스마트폰 앱으로 구동되는 서비스인 만큼 sms로 인증과정을 처리하는 방식이 훨씬 유저 편의적인 관점에서 좋을 것 판단에 따라 twilio programmble sms api를 사용하기로 하였고, 지금 와서 생각해 보면 좋은 선택이었다고 생각한다.

하지만 휴대폰 인증 로직을 구현하면서 보완해야할 부분이라고 느꼈던 점이 있는데, 먼저 sms api를 처리하는데 있어 정보가 유출되지 않도록 보안에 조금 더 신경써야 하겠다는 점이었다. twilio 공식문서를 확인하면 programmable sms api 외에 verify api를 별도로 지원하고 있다. 따라서 단순히 sms를 보내서 인증번호를 확인하는 작업보다 verify api에서 지원하는 메소드를 이용하여 인증과정을 거치는 방식이 훨씬 보안적인 측면에서 우수할 것이라고 생각된다.

참고자료

4개의 댓글

comment-user-thumbnail
2020년 8월 4일

안녕하세요 글 잘 보고 있습니다~
혹시 twilio 문자 서비스 이용하실때 요금은 어떻게 되시나요??
저도 개발중인 서비스에 문자로 인증하는거 개발중이여서요~

1개의 답글
comment-user-thumbnail
2021년 11월 15일

안녕하세요. 좋은 글 감사합니다. 폰이 2개인 사람은 어떻게 구별하시나요??

답글 달기
comment-user-thumbnail
2023년 8월 1일

휴대폰 번호만 인증 구현 하시는거라면 월 300건 무료 제공 되는 서비스 공유드립니다.
https://www.oauth.network/
인증방식이 기존이랑은 다르게 문자 수신을 통해서 인증 번호를 입력하는 방식이 아니라
인증 번호를 발신해서 인증하는 방식입니다.

예제 링크구요 예제 소스는 아래에 첨부하였습니다.
https://opdyhs-8080.csb.app/

https://codesandbox.io/p/sandbox/oauth-network-example-opdyhs

답글 달기