Implementar el restablecimiento de contraseña

PWA Kit viene listo para usar con la opción de usar el restablecimiento de contraseña para sus compradores. Incluya esta característica en su sitio del kit de Progressive Web App (PWA) para mejorar la experiencia del comprador. Con el restablecimiento de contraseña, si los compradores olvidan su contraseña, pueden utilizar un código de verificación o un vínculo en un correo electrónico o mensaje de texto para recuperar el acceso a su cuenta creando una nueva contraseña.

Nuestro sitio de demostración muestra la implementación predeterminada del restablecimiento de contraseña.

Para habilitar y configurar el restablecimiento de contraseña para tu sitio de PWA Kit, sigue los pasos de esta guía. A lo largo de esta guía, usamos un escaparate de ejemplo con la URL: https://www.example.com. Reemplácelo example.com con su nombre de dominio.

El restablecimiento de contraseña no se admite en storefronts híbridos.

Para usar el restablecimiento de contraseña, crea tu sitio usando Composable Storefront y Retail React App versión 6.0 o posterior.

Hay tres pasos de configuración.

  1. Configurar la URL de devolución de llamada
  2. Incluya en la lista permitida la URL de devolución de llamada
  3. Completa la configuración en tu proyecto de PWA Kit
  • Los compradores deben iniciar sesión en su sitio con su nombre de usuario y contraseña al menos una vez antes de poder utilizar el restablecimiento de contraseña.
  • A diferencia del campo URL de redireccionamiento, el campo URL de devolución de llamada no admite comodines. Incluya siempre la URL completa de una devolución de llamada, incluido el protocolo.

Proporcione una URL de devolución de llamada a SLAS. De esa manera, SLAS puede enviar a esa URL toda la información que su sitio necesita para crear un token (código de verificación o un enlace en un correo electrónico o mensaje de texto) para un comprador. Para obtener más información, consulte Restablecimiento de contraseña.

SLAS realiza una solicitud HTTP POST a la URL de devolución de llamada para reenviar las credenciales del comprador a un destino de su elección, generalmente un proveedor de servicios de marketing o correo electrónico. De forma predeterminada, PWA Kit genera un vínculo seguro y utiliza Salesforce Marketing Cloud para reenviar el vínculo en un correo electrónico. Para personalizar esta funcionalidad, describa el mecanismo que desea usar para asegurarse de que los compradores obtengan el token de ocho dígitos generado por el SLAS.

Estas son tres opciones posibles para describir el mecanismo para proporcionar una URL de devolución de llamada a SLAS. A continuación se describen en detalle.

  • a. Usar una URL de devolución de llamada externa
  • b. Usar una integración de Marketing Cloud
  • c. Usar un punto de conexión POST personalizado en el proyecto de PWA Kit

a. Usar una URL de devolución de llamada externa

  • Proporcione cualquier URL de devolución de llamada externa de acceso público que pueda procesar la entrega del token utilizando el correo electrónico del comprador.

    Ejemplos de esta URL de devolución de llamada son una instancia de B2C Commerce, un entorno de Managed Runtime o su propio servidor.

  • Configure un cliente SLAS. En el campo URL de devolución de llamada, ingrese su URL de devolución de llamada de acceso público.

o

b. Usar una integración de Marketing Cloud

Si tiene una licencia de Marketing Cloud, puede enviar el token por correo electrónico o mensaje de texto (según los términos de su contrato). Esta es la implementación predeterminada incluida en PWA Kit.

Requisitos previos

Para conocer todos los requisitos previos y pasos que se aplican al uso de una integración de Marketing Cloud, consulte Crear un recorrido de envío transaccional.

Configure su integración

Para obtener los valores de configuración de Marketing Cloud que se indican a continuación, consulte Creación de una integración de API de OAuth 2.0.

  • Establezca estas variables de entorno en Managed Runtime.

    • MARKETING_CLOUD_CLIENT_ID a su ID de cliente de Marketing Cloud
    • MARKETING_CLOUD_CLIENT_SECRET a su secreto de cliente de Marketing Cloud
    • MARKETING_CLOUD_SUBDOMAIN a su subdominio de Marketing Cloud
    • MARKETING_CLOUD_RESET_PASSWORD_TEMPLATE a la clave de definición de evento única para el evento de API transaccional adjunta a la plantilla de correo electrónico que almacenó en Marketing Cloud.

    Consulte Variables de entorno.

  • Configure la URL de devolución de llamada completa en su cliente SLAS. Por ejemplo, https://example.com/reset-password-callback. Consulte Configuración de un cliente SLAS.

Si desea personalizar la ruta de devolución de llamada desde , actualícela también en el lugar donde ssr.js está configurado el punto de /reset-password-callback conexión POST. Véase la opción c. Utilice un punto de conexión POST personalizado en su proyecto de PWA Kit a continuación.

o

c. Usar un punto de conexión POST personalizado en el proyecto de PWA Kit

  • Configure un punto app/ssr.js de conexión POST personalizado para gestionar la entrega de tokens mediante la opción elegida: correo electrónico o mensaje de texto. Vea esta implementación de Marketing Cloud como app/ssr.js ejemplo.
  • Configure un cliente SLAS. En el campo URL de devolución de llamada, escriba la URL de devolución de llamada que configuró en el punto de conexión de POST personalizado.

Para cualquiera de las tres opciones de URL de devolución de llamada, asegúrese de que la URL de devolución de llamada que configuró esté en la lista permitida en el Callback URL campo del cliente SLAS que está utilizando. Para ello:

  • Acceda a la interfaz de usuario de administración de SLAS: Inicie sesión en su instancia de Salesforce B2C Commerce y vaya a la sección Administración de SLAS.
  • Crea o edita un cliente: Seleccione su cliente SLAS donde desea administrar las URL de devolución de llamada.
  • Agregue URL permitidas: En la configuración del cliente, proporcione una lista de las URL de devolución de llamada válidas para su sitio.

Hay dos formas de configurar el restablecimiento de contraseña en el proyecto de PWA Kit.

  • a. Actualice template-retail-react-app/config/default.js
  • b. Uso de variables de entorno

a. Actualización template-retail-react-app/config/default.js

En tu proyecto de PWA Kit, usa la URL de devolución de llamada que configuraste como parte de los requisitos previos para actualizar template-retail-react-app/config/default.js de la siguiente manera.

o

b. Uso de variables de entorno

El valor de la variable de entorno para el restablecimiento de contraseña anula cualquier valor que haya agregado en template-retail-react-app/config/default.js.

Utilice esta variable de entorno para establecer la URL de devolución de llamada para el restablecimiento de contraseña.

RESET_PASSWORD_CALLBACK_URI

Consulte Variables de entorno.

  • Implemente la limitación de velocidad para evitar el uso indebido del restablecimiento de contraseña. Por ejemplo, si está utilizando una CDN integrada (eCDN), puede aplicar reglas de limitación de velocidad de eCDN.
  • Use medidas de seguridad sólidas para proteger las cuentas de los compradores. Por ejemplo, si usa una red de entrega de contenido (CDN) de terceros, como Cloudfare, puede bloquear solicitudes por puntuación de amenaza.
  • Realice un seguimiento del uso de las opciones de autenticación por parte de los compradores y diagnostique los problemas de manera eficiente. Por ejemplo, use Log Center para acceder a los registros de Managed Runtime (MRT) y su instancia de B2C Commerce.

Esta sección proporciona una solución sugerida para un error común que puede encontrar relacionado con el restablecimiento de contraseña.

Posible causa: El servicio de entrega de correo electrónico tarda más de lo esperado o el comprador no recibió el correo electrónico.

Solución sugerida: Incluya una opción de reenvío o permita que los compradores introduzcan un método de contacto alternativo. Compruebe si hay problemas con los filtros de spam.