암호 재설정 구현

PWA Kit는 구매자에 대해 암호 재설정을 사용할 수 있는 옵션과 함께 즉시 제공됩니다. PWA(Progressive Web App) Kit사이트에 이 기능을 포함하여 구매자 경험을 개선하십시오. 암호 재설정 기능을 사용하면 구매자가 암호를 잊어버린 경우 이메일이나 텍스트의 인증 코드 또는 링크를 사용하여 새 암호를 만들고 계정에 다시 액세스할 수 있습니다.

데모 사이트에서는 암호 재설정의 기본 구현을 보여 줍니다.

PWA Kit 사이트에 대한 암호 재설정을 사용하도록 설정하고 구성하려면 이 가이드의 단계를 수행합니다. 이 가이드에서는 URL https://www.example.com이 있는 예제 스토어프런트를 사용합니다. 도메인 이름으로 바꿉니다example.com .

암호 재설정은하이브리드 스토어프런트에서 지원되지 않습니다.

암호 재설정을 사용하려면 Composable Storefront 및Retail React App버전 6.0 이상을 사용하여 사이트를 빌드합니다.

세 가지 구성 단계가 있습니다.

콜백 URL 구성
콜백 URL 허용 목록
PWA Kit 프로젝트에서 구성 완료

구매자는 암호 재설정을 사용하기 전에 사용자 이름과 암호를 한 번 이상 사용하여 사이트에 로그인해야 합니다.
리디렉션 URL 필드와 달리 콜백 URL 필드는 와일드카드를 지원하지 않습니다. 항상 프로토콜을 포함하여 콜백의 전체 URL을 포함합니다.

SLAS에 대한 콜백 URL을 제공합니다. 이렇게 하면 SLAS에서 사이트에서 구매자를 위한 토큰(확인 코드, 이메일이나 텍스트의 링크)을 생성하는 데 필요한 모든 정보를 해당 URL로 전송할 수 있습니다. 자세한 배경 정보는암호 재설정을 참조하세요.

SLAS는 콜백 URL에 HTTP POST 요청을 하여 구매자의 자격 증명을 선택한 대상(일반적으로 이메일 또는 마케팅 서비스 제공업체)으로 전달합니다. 기본적으로 PWA Kit는 보안 링크를 생성하고 Salesforce Marketing Cloud를 사용하여 링크를 이메일로 전달합니다. 이 기능을 맞춤설정하려면 구매자가 SLAS에서 생성된 8자리 토큰을 받도록 하는 데 사용할 메커니즘을 설명합니다.

다음은 SLAS에 콜백 URL을 제공하는 메커니즘을 설명하는 세 가지 가능한 옵션입니다. 아래에 자세히 설명되어 있습니다.

a. 외부 콜백 URL 사용
b. Marketing Cloud 통합 사용
c. PWA Kit 프로젝트에서 사용자 지정 POST 끝점 사용

a. 외부 콜백 URL 사용

구매자의 이메일을 사용하여 토큰 전송을 처리할 수 있도록 공개적으로 액세스할 수 있는 외부 콜백 URL을 제공합니다.

이 콜백 URL의 예로는 B2C Commerce 인스턴스, Managed Runtime 환경 또는 자체 서버가 있습니다.
SLAS 클라이언트를 구성합니다 . 콜백 URL 입력란에 공개적으로 액세스할 수 있는 콜백 URL을 입력합니다.

또는

b. Marketing Cloud 통합 사용

Marketing Cloud 라이선스가 있는 경우 계약 조건에 따라 이메일 또는 문자 메시지로 토큰을 보낼 수 있습니다. 이는 PWA Kit에 포함된 기본 구현입니다.

사전 요구 사항

Marketing Cloud 통합 사용에 적용되는 모든 전제 조건 및 단계는트랜잭션 전송 여정 만들기를참조하십시오.

통합 구성

아래의 Marketing Cloud 구성 값을 얻으려면OAuth 2.0 API 통합 만들기를참조하십시오.

Managed Runtime에서 이러한 환경 변수를 설정합니다.
- MARKETING_CLOUD_CLIENT_ID Marketing Cloud 클라이언트 ID로
- MARKETING_CLOUD_CLIENT_SECRET Marketing Cloud 클라이언트 시크릿으로
- MARKETING_CLOUD_SUBDOMAIN Marketing Cloud 하위 도메인으로
- MARKETING_CLOUD_RESET_PASSWORD_TEMPLATE Marketing Cloud에 저장한 이메일 템플릿에 첨부된트랜잭션 API 이벤트에대한 고유한 이벤트 정의 키를 추가합니다.
환경 변수를 참조하십시오.
SLAS 클라이언트에서 전체 콜백 URL을 구성합니다. 예를 들어 다음과 같습니다.https://example.com/reset-password-callback SLAS 클라이언트 구성의내용을 참조하십시오.

에서 콜백 경로를/reset-password-callback사용자 지정하려면 POST 엔드포인트가 설정된 위치에서도 업데이트ssr.js하십시오. 옵션 c를 참조하십시오. 아래 PWA Kit 프로젝트에서 사용자 지정 POST 끝점을 사용합니다.

또는

c. PWA Kit 프로젝트에서 사용자 지정 POST 끝점 사용

선택한 옵션(이메일 또는 텍스트)을 사용하여 토큰 전달을 처리하도록 사용자 지정 POST 엔드포인트를app/ssr.js구성합니다. 이 Marketing Cloud 구현을 예로 참조하십시오app/ssr.js .

SLAS 클라이언트를 구성합니다 . 콜백 URL 필드에 사용자 지정 POST 엔드포인트에서 설정한 콜백 URL을 입력합니다.

세 가지 콜백 URL 옵션 중 하나에 대해 구성한 콜백 URL이 사용 중인 SLAS 클라이언트의 필드에 허용 목록에Callback URL있는지 확인합니다. 방법은 다음과 같습니다.

** SLAS 관리 UI에 액세스:** Salesforce B2C Commerce 인스턴스에 로그인하고 SLAS 관리 섹션으로 이동합니다.
**클라이언트 생성 또는 편집:**콜백 URL을 관리할 SLAS 클라이언트를 선택합니다.
**허용된 URL 추가:**클라이언트 구성에서 사이트의 유효한 콜백 URL 목록을 제공합니다.

PWA Kit 프로젝트에서 암호 재설정을 구성하는 방법에는 두 가지가 있습니다.

a. template-retail-react-app/config/default.js업데이트
b. 환경 변수 사용

a. 업데이트 template-retail-react-app/config/default.js

PWA Kit 프로젝트에서 필수 구성 요소의 일부로 설정한 콜백 URL을 사용하여 다음과 같이 업데이트template-retail-react-app/config/default.js합니다.

또는

b. 환경 변수 사용

암호 재설정에 대한 환경 변수의 값은 에 추가한 모든 값을 재정의합니다template-retail-react-app/config/default.js .

이 환경 변수를 사용하여 암호 재설정을 위한 콜백 URL을 설정합니다.

RESET_PASSWORD_CALLBACK_URI

환경 변수를 참조하십시오.

암호 재설정의 남용을 방지하기 위해 속도 제한을 구현합니다. 예를 들어 임베디드 CDN(eCDN)을 사용하는 경우eCDN 속도 제한 규칙을적용할 수 있습니다.
강력한 보안 조치를 사용하여 구매자 계정을 보호하십시오. 예를 들어 Cloudfare와 같은 타사 CDN(콘텐츠 전송 네트워크)을 사용하는 경우위협 점수로 요청을 차단할수 있습니다.
구매자의 인증 옵션 사용을 추적하고 문제를 효율적으로 진단합니다. 예를 들어Log Center를 사용하여 MRT(Managed Runtime) 및 B2C Commerce 인스턴스의 로그에 액세스합니다.

이 섹션에서는 암호 재설정과 관련하여 발생할 수 있는 일반적인 오류에 대한 제안된 해결 방법을 제공합니다.

**잠재적 원인:**이메일 전송 서비스가 예상보다 오래 걸리거나 구매자가 이메일을 받지 못했습니다.

**제안된 솔루션:**재전송 옵션을 포함하거나 구매자가 백업 연락 방법을 입력하도록 허용합니다. 스팸 필터 문제를 확인합니다.

암호 재설정