INTRO
회원가입 구현 시 비밀번호 해싱을 해야했다.
SHA-256 해시 알고리즘을 이용해서 비밀번호를 암호화하기로 했다.
우선, 나는 한번도 암호화를 해본적이 없어서 개념부터 찾아보았다.
유저의 비밀번호는 절대 그대로 DB에 저장해서는 안된다.(법률적 강제)
DB가 해킹 당하거나 담당자 또한 유저의 비밀번호를 알게 해서는 안되기 때문이다.
따라서, 비밀번호는 반드시 암호화해서 저장해야 한다.
일반적으로 비밀번호 암호화에는 단방향 해시 함수를 사용한다.
단방향 해시 함수(one-way hash function)
DataBase에 저장 시 난수 처리를 통하여 해싱하여 복원할 수 없도록 처리하는 방법이다.
원본 메시지를 통해 암호화된 메시지는 쉽게 유추할 수 있으나,
역으로 암호화된 메세지를 통해서는 원본 메세지를 유추할 수 없어 단방향성이라고 한다.
SHA-256 이상 암호화 알고리즘을 활용하여 진행하며 단방향 해시 함수는 원본 메시지를 변환하여 암호화된 메시지인 다이제스트(digest)를 생성한다.
1. 상황
구글링을 통해 해야하는 이유와 개념을 파악했다.
이제, 회원가입 폼 제출 시 폼데이터의 비밀번호를 아래와 같이 해싱했다.
<form
noValidate
onSubmit={handleSubmit(data => {
data.password = SHA256(data.password).toString(); // 해싱
if (!isEmailDuplicate) {
axiosSignUpPost(data).then(navigateLoginPage);
}
})}
>회원가입이 잘 처리가 되었다 !
이제 로그인을 하러 가보자.
잉?
조회결과가 없다니..
회원가입 응답 200으로 잘 받았는데.. 왤까
다시 구글링으로 돌아갔다.
잘 모르겠다.
지피티한테 물어봤다.
2. 원인
👇🏻 지피티의 답변 중 일부
비밀번호를 SHA-256 해시로 암호화하는 것은 보안적으로 좋은 아이디어일 수 있지만, 로그인이 실패하는 이유가 여러 가지일 수 있습니다. 다음과 같은 몇 가지 가능성을 고려해 보실 수 있습니다:
1. 비밀번호 해시의 비교: 사용자가 로그인할 때, 입력한 비밀번호를 해싱하여 저장된 해시와 비교해야 합니다. 회원가입 시에만 SHA-256로 해싱하는 것은 로그인 시에는 비밀번호를 원본 상태로 비교할 수 없게 만듭니다. 로그인 시에도 사용자가 입력한 비밀번호를 SHA-256으로 해싱한 후, 저장된 해시와 비교해야 합니다.
로그인 로직에서는 비밀번호 검증을 수행하는 부분이 필요합니다. 입력한 비밀번호를 SHA-256으로 해싱한 후, 서버에서 저장된 해시와 비교하여 로그인을 승인하거나 거부해야 합니다.
젤 첫번째 가능성이 내 이유였다 ..🫠
로그인 시에도 해싱을 해야하는구나...🥲
진짜.. 바본가
3. 해결
로그인폼 제출 시에도 해싱을 추가해줬다.
<form
noValidate
onSubmit={handleSubmit(data => {
data.password = SHA256(data.password).toString(); // 해싱 추가
axiosLoginPost(data)
.then(res => dispatch(loginUser(res)))
.then(navigateMainPage);
})}
>다시 로그인을 해보자.
로그인이 성공해서 스토리지에 유저 정보가 잘 들어갔다 !
