Implementar el inicio de sesión sin contraseña

PWA Kit viene listo para usar con la opción de usar el inicio de sesión sin 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 inicio de sesión sin contraseña, los compradores pueden iniciar sesión en su sitio de forma segura utilizando un código de verificación o un vínculo en un correo electrónico o un mensaje de texto en lugar de una contraseña.

Nuestro sitio de demostración muestra la implementación predeterminada del inicio de sesión sin contraseña.

Para habilitar y configurar el inicio de sesión sin 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 inicio de sesión sin contraseña no es compatible con los storefronts híbridos.

Para usar el inicio de sesión sin contraseña:

  • Crea tu sitio usando Composable Storefront y Retail React App versión 6.0 o posterior.
  • Configure un cliente privado de inicio de sesión de comprador y acceso a API (SLAS). Para conocer los detalles de la configuración de un cliente privado SLAS para el inicio de sesión sin contraseña, consulte Configurar el inicio de sesión sin contraseña.

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 inicio de sesión sin 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 de inicio de sesión (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 Inicio de sesión sin contraseña con SLAS e Inicio de sesión sin contraseña con SMS.

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 sin contraseña de ocho dígitos generado por 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 privado 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 estas guías.

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_PASSWORDLESS_LOGIN_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/passwordless-login-callback. Consulte Configuración de un cliente privado 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 /passwordless-login-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 privado 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.

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

Si aún no lo ha hecho, complete los Requisitos previos.

Para configurar el inicio de sesión sin contraseña en el proyecto de PWA Kit, actualícelo template-retail-react-app/config/default.js como se muestra en este ejemplo.

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.

b. Opcional: Uso de una variable de entorno para establecer la URL de devolución de llamada

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

Opcionalmente, puede establecer la URL de devolución de llamada utilizando una variable de entorno en lugar de template-retail-react-app/config/default.js. Úselo template-retail-react-app/config/default.js para habilitar el inicio de sesión sin contraseña. Configure esta variable de entorno para establecer la URL de devolución de llamada.

PASSWORDLESS_LOGIN_CALLBACK_URI

Consulte Variables de entorno.

  • Implemente la limitación de velocidad para evitar el abuso de la característica de inicio de sesión sin 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 inicio de sesión sin contraseña.

Posible causa: El alcance o la URL de devolución de llamada son incorrectos.

Solución sugerida: Asegúrese de que el alcance y la URL de devolución de llamada estén configurados correctamente. Consulte Configuración de un cliente privado SLAS.