React AWS Cognito: 이메일 인증 설정 안내서(첫 번째 부분)

이메일 기반 사용자 인증을 위해 AWS Cognito를 사용하여 React 앱을 구축하는 2부 시리즈 중 첫 번째입니다. 1부에서는 필요한 AWS 구성을 설정하는 데 중점을 두고 있으며, 2부에서는 React 코드를 자세히 살펴보고 모든 것을 하나로 묶습니다.

우리는 다음 AWS 서비스를 사용할 예정입니다:

• Amazon 단순 이메일 서비스(SES)
• AWS Cognito

AWS 리소스를 설정하는 것부터 시작해 보겠습니다.

Amazon Simple Email Service(SES)

도메인 SES ID

AWS가 해결 방법을 제공하므로 테스트 목적으로 SES에서 도메인 소유권을 확인하는 것은 선택 사항입니다. 그러나 제작의 경우 SES가 도메인을 대신하여 이메일을 보낼 수 있도록 소유권 확인이 필수적입니다.

설정 과정은 다음과 같습니다.

1. Amazon Simple Email Service로 이동합니다.
2. ID를 선택합니다.
3. ID 만들기를 클릭하세요.

설정에서 "도메인"을 선택하고 domain.com 예시를 사용했습니다.

• ID 만들기를 클릭하세요.

그러면 다음과 비슷한 페이지가 표시됩니다.

DNS 레코드 게시 섹션으로 이동하고 해당 값을 사용하여 도메인 공급자에 레코드를 추가합니다.

도메인 공급자에 DNS 레코드가 설정되면 다음과 같이 확인된 도메인이 표시됩니다.

완벽합니다. 이제 도메인이 확인되었으므로 SES가 귀하를 대신하여 이메일을 보낼 수 있습니다. AWS에서는 대체 방법을 제공하므로 테스트에는 이 확인이 필요하지 않지만, 프로덕션에는 필수적입니다.

이메일 SES ID

테스트할 때 인증 흐름에 사용하는 이메일 주소를 AWS의 "허용 목록"에 추가해야 하기 때문에 이 단계가 중요합니다. 여기에서는 이메일 주소를 추가하고 확인하겠습니다.

방향:

• 아마존 간편 이메일 서비스
• ID
• 아이덴티티 만들기

이번에는 이메일 주소를 선택하세요.

• 인증하려는 이메일 주소를 입력하세요.
• ID 만들기를 클릭하세요.

ID가 생성되면 AWS로부터 확인 링크가 포함된 이메일을 받게 됩니다. 받은 편지함을 확인하고 해당 링크를 클릭하여 이메일을 확인하세요.

이메일을 확인하고 나면 확인되었음을 나타내는 라벨이 표시됩니다.

이 시점에서는 도메인과 이메일을 모두 확인해야 합니다. 도메인 확인은 테스트 중에는 선택 사항이지만 프로덕션 환경에서는 필수입니다. 반면, 테스트에는 이메일 인증이 필요하지만 제작에는 필요하지 않습니다.

참고: 인증 과정의 일부로 확인 코드가 이 이메일 계정으로 전송됩니다. 이메일 계정이 확인되지 않으면 코드를 받을 수 없습니다.

아마존 코그니토

마지막으로 구성할 부분은 Cognito입니다. 이 서비스를 이용하면 계정 인증이 가능하며, 이 경우 인증을 위해 이메일을 사용하겠습니다. 작동 방식은 다음과 같습니다.

• 사용자는 자신의 이메일과 비밀번호로 계정을 만듭니다.
• AWS에서 보낸 코드를 입력하여 이메일을 확인합니다.
• 인증이 완료되면 사용자는 이메일과 비밀번호를 사용하여 로그인할 수 있습니다.

인증을 직접 처리하는 대신 AWS Cognito를 활용할 수 있습니다.

다음으로 이동:

참고: 대부분의 단계에서 기본 옵션을 그대로 사용하므로 맞춤 선택 사항에 대해서만 언급하겠습니다. 프로젝트에 따라 다양한 설정을 구성할 수 있습니다.

• 코그니토
• 사용자 풀 생성
• 1단계: 이메일 확인

• 2단계: MFA 없음을 선택합니다. 테스트에는 필요하지 않습니다.

• 3단계: 기본 옵션을 유지했습니다.

• 4단계: 확인된 "보낸 사람 이메일 주소"를 선택하세요.

Cognito는 이상적으로는 도메인에서 확인 코드가 포함된 이메일을 전송하므로 이전 섹션에서 도메인을 확인해야 합니다. 여기에서 AWS가 개발에 적합한 "Cognito로 이메일 보내기" 옵션을 제공하는 것을 확인할 수 있습니다. 그러나 프로덕션에서는 보다 전문적이고 안정적인 이메일 전송 프로세스를 위해 도메인이 확인되었는지 확인해야 합니다.

• 5단계: 풀 및 클라이언트 이름을 추가하는 것 외에도 핵심 부분은 "고급 앱 클라이언트 설정"을 확장하고 ALLOW_USER_PASSWORD_AUTH를 활성화하는 것입니다. 이 설정을 통해 사용자는 인증 흐름에 필수적인 이메일과 비밀번호를 사용하여 인증할 수 있습니다.

• 6단계: 검토 단계이며 수정할 내용이 없습니다. 계속 진행하기 전에 모든 것이 좋아 보이는지 확인하세요.

생성되면 대시보드에 다음과 같이 표시됩니다.

그렇습니다! 이제 AWS에 모든 설정이 완료되었습니다. 다음 게시물에서는 React 앱을 Cognito와 연결하여 이메일을 사용하여 사용자를 인증하는 방법을 보여 드리겠습니다. 다음주 월요일에 올라올 포스팅을 기대해주세요.

위 내용은 React AWS Cognito: 이메일 인증 설정 안내서(첫 번째 부분)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!