Configuración de un storefront híbrido con autenticación híbrida

Con la versión 25.3 de B2C Commerce, la autenticación híbrida (auth) reemplaza la opción de cartucho de SLAS de complemento.

La autenticación híbrida es una solución independiente para implementaciones de sitios que necesitan autorización de Storefront Reference Architecture (SFRA)/SiteGenesis (SG) y autorización de Shopper Login and API Access Service (SLAS). Esto significa que necesita un dwsid token web (SFRA/Site Genesis) y un token web JSON (SLAS), y estos tokens deben mantenerse sincronizados. La autenticación híbrida es una mejora con respecto al enfoque Plugin SLAS, ya que ofrece un método más eficiente y optimizado.

La autenticación híbrida mejora el rendimiento y la estabilidad de los escaparates híbridos al desplazar la característica directamente a la plataforma B2C Commerce.

Recomendamos encarecidamente migrar a Hybrid Auth para que pueda aprovechar el rendimiento mejorado y el flujo de trabajo optimizado.

En esta guía, se explica cómo configurar la autenticación híbrida para un storefront híbrido que es en parte SFRA/SiteGenesis y en parte un storefront componible.

Para obtener más información sobre la autenticación híbrida, consulte Autenticación híbrida.

Las tareas implicadas en una implementación híbrida con autenticación híbrida incluyen:

Complete los pasos descritos en Autenticación híbrida.
Configurar la autenticación híbrida para el storefront componible (obligatorio).
Use zonas de CDN de API de Commerce para dirigir el tráfico a Managed Runtime. Consulte API de CDN para implementaciones desatendidas por fases (obligatorio).
Obtener analítica con Einstein Activities para implementaciones desatendidas por fases (opcional)

Para usar la autenticación híbrida, cree su sitio con:

commerce-sdk-react@3.3.0 o posterior
Kit de Progressive Web App (PWA) versión 3.10 o posterior

En la siguiente tabla, se compara la compatibilidad de las características del PWA Kit con los SLAS de complementos frente a la autenticación híbrida.

Nombre	de la característica compatible con PWA Kit w. Plugin SLAS	soportado en PWA Kit w. Notas de Hybrid Auth
SiteGenesis	N	Y
IDP de terceros e inicio de sesión	social N	Parcialmente admitido a partir del 30/04/2025.	IDP de terceros: Todas las interacciones con el IDP de terceros deben realizarse con SLAS. Si actualmente está utilizando la autenticación de comprador en B2C Commerce y ha configurado un proveedor de OAuth2 en Business Manager, debe hacer ajustes y cambiar el flujo de trabajo y la autenticación de la interfaz de usuario dentro de su aplicación SFRA/SiteGenesis. Utilice los proveedores de identidad de SLAS y cambie las pantallas de inicio de sesión de los compradores para interactuar con los SLAS. Inicio de sesión social: Esto es lo mismo que el soporte de IDP de terceros con la misma advertencia descrita en el párrafo anterior: los inicios de sesión deben fluir a través de SLAS.
Inicio de sesión	sin contraseña N	Y
SLAS Clientes Privados	Y	Y
La compatibilidad con SLAS Public Clients	Y	N*	Hybrid Auth está prevista para una versión futura.
Sistema de confianza SLAS (TSOB)	N	Y
Funcionalidad	"Recordar recuerdos" de Script API N	N/A La funcionalidad tradicional Recordar mis datos, mejorada con SLAS, prolonga los tiempos de caducidad y es redundante cuando se migra a alta disponibilidad.	Importante: Si va a migrar a alta disponibilidad y su implementación establece el indicador booleano para rememberMe al llamar a loginCustomer, actualmente hay problemas con la cookie resultante `dwcustomer_*` que se utiliza. Actualmente, Salesforce aconseja no implementar la autenticación híbrida si esta funcionalidad está en uso. `rememberMe`la funcionalidad se mejora con el inicio de sesión persistente de alta disponibilidad. El soporte para la transición del inicio de sesión persistente de rememberMe a Hybrid Auth está disponible en la versión 25.6 de B2C Commerce. En este caso, debe esperar hasta la versión 25.6 antes de migrar a HA.
PWA Kit versión 2.x	Y	N*	Para HA, la compatibilidad con PWA Kit 2.x depende de la compatibilidad con clientes públicos de SLAS y está prevista para una versión futura.
PWA Kit versión 3.x	Y	Y _	`salesforce/commerce-sdk-react` v3.2.0_ viene empaquetado con PWA Kit 3.9.0.
Do Not Track (DNT)	N	Y	Debe realizar pasos específicos para habilitar y sincronizar DNT. Consulte la guía de documentación.
Salesforce			recomienda que habilite el contexto del comprador para la autenticación híbrida, ya que es la única forma en que los datos de personalización están disponibles para las API. Consulte la documentación de Shopper Context. La personalización basada en la geolocalización deberá sincronizarse entre Shopper Context y SFRA/SiteGenesis. Consulte la guía de documentación. Nota: En la versión 25.5 de B2C Commerce, Script API para Shopper Context está disponible para la personalización basada en geolocalización.
Exclusión de controladoras	S	N	En la autenticación híbrida, no es necesario excluir ninguna controladora.
Personalización	de la configuración de cookies Y, a través de la personalización	N/A	En la autenticación híbrida, a diferencia plugin_SLAS de , ya no tiene acceso al objeto de la cookie y ya no puede anular la configuración de las cookies.

*El soporte está previsto para una versión futura.

Para configurar la autenticación híbrida para un storefront híbrido que es en parte SFRA/SiteGenesis y en parte Storefront componible, sigue estos pasos que se describen en detalle en esta guía.

Configure las reglas de origen de la red de entrega de contenido integrada (eCDN).
Crea una Retail React App PWA Kit.
Actualice las rutas del PWA Kit.
Actualice @salesforce/commerce-sdk-react.
Habilite las cookies en Managed Runtime.
Elimine el SLAS del complemento de la ruta del cartucho.
Habilite/deshabilite la sincronización No realizar seguimiento.

Configura la red de entrega de contenido integrada (eCDN) para enviar solicitudes de página en la parte superior del embudo al escaparate componible: página de inicio (/), página de listado de categorías (/category) y página de detalles del producto (/product). Estas páginas se implementan en un entorno de Managed Runtime (MRT) que se ejecuta en mystorefront.mobify-storefront.com. Cuando el comprador decide realizar una compra, la eCDN redirige al comprador a la página de pago de SFRA/SG existente que se ejecuta en www.mystorefront.com.

Para usar las zonas de CDN de Commerce API para enrutar el tráfico a Managed Runtime, siga los pasos en API de CDN para implementaciones híbridas.

Para obtener más información sobre el enrutamiento del tráfico a MRT, consulte:

Haz 1 o 2.

Creación de una Retail React App con configuración de cliente privado de SLAS
- Para crear una aplicación PWA Kit, ejecute el siguiente comando generador en una ventana de terminal: npx @salesforce/pwa-kit-create-app my-hybrid-storefront
- Seleccione la aplicación Retail con su propia instancia de Commerce Cloud.
- Siga las instrucciones del terminal.
- Responda Sí cuando se le pregunte : ¿Su cliente SLAS es privado?

Como alternativa, puede generar una Retail React App con una configuración preestablecida y cambiar el ID de cliente de SLAS a su cliente privado una vez que se genere la aplicación.
- Siga los pasos descritos en Inicio rápido.
- Consulte Utilizar un cliente privado de SLAS.
- Asegúrese de que el cliente SLAS utilizado para la autenticación híbrida incluya el sfcc.session_bridge alcance.

Por defecto, PWA Kit usa la API de historial para la navegación. Cuando un comprador hace clic en un vínculo hecho con un componente de React Router, se activa una navegación suave hacia el componente que coincide con la ruta en el objeto de ruta definido en app/routes.jsx. Para vincular a un página que no sea de PWA Kit (una con tecnología de SFRA, por ejemplo), debe eliminar todas las rutas que coincidan con el nombre de la ruta de la URL de app/routes.jsx.

Si el proyecto de PWA Kit se generó con la versión 3.x de la plantilla de Retail React App mediante extensibilidad de plantillas, puede anular el archivo para filtrar los overrides/app/routes.jsx vínculos a páginas que no son de PWA Kit mediante JavaScript.

Hemos creado una anulación de ejemplo del overrides/app/routes.jsx archivo con todos los cambios en su lugar para filtrar /cart y /checkout enrutar. Personaliza el código de anulación de ejemplo en este gist público para filtrar los vínculos a páginas que no son de PWA Kit.
Por último, actualice la ruta universal de PWA (/*) en app/routes.jsx. Reemplace el componente <PageNotFound /> de PWA con un redireccionamiento al origen predeterminado.

Si su sitio usa commerce-sdk-react, actualice a @salesforce/commerce-sdk-react@3.2.0 o posterior.

Cuando se habilita la autenticación híbrida, las solicitudes de SLAS /oauth2/token contienen un puente dwsid de sesión mediante el Set-Cookie encabezado de la respuesta.

En Managed Runtime, habilite el paso a través de cookies:

Inicie sesión en Managed Runtime Admin.
Navegue hasta el proyecto y el entorno.
Haga clic en Configuración delentorno.
Desplácese hasta la sección Avanzado y seleccione el botón Editar.
Habilite el interruptor junto a Cookies.
Desplácese hasta la sección Avanzado y seleccione Actualizar. ****
Espere a que se vuelva a implementar el paquete del storefront.

Estos pasos se aplican solo si anteriormente usó SLAS de complemento en su storefront híbrido. Si tienes un nuevo storefront híbrido y nunca antes usaste Plugin SLAS, puedes omitir estos pasos.

Con la migración a la autenticación híbrida de B2C Commerce, PWA Kit ya no usa SLAS de complemento. Para eliminar los SLAS de complementos de su storefront híbrido:

Vaya a Administración > Sitios > Administrar sitios > Seleccione Sitio.
Vaya a la pestaña Configuración.
Elimine Plugin SLAS de la ruta del cartucho.
Si tiene alguna personalización de código en torno a la autenticación del comprador, pero no específica para el SLAS del complemento, debería seguir funcionando como está.
- Si has realizado alguna personalización específica del SLAS del plugin, revísala. Es posible que esos cambios no sean necesarios o que tenga que volver a implementarlos en un cartucho diferente.
- Siga las prácticas recomendadas. Todas las personalizaciones de código deben implementarse en un cartucho separado en lugar de directamente en el código del cartucho SFRA listo para usar.
- Asegúrese de que cuando cambie a la autenticación híbrida, ninguno de los códigos de cartucho personalizados invoque puntos de conexión de puente de sesión. Esto causará problemas en las sesiones de los compradores. La autenticación híbrida ahora se encarga de las sesiones de compra por usted.

Para los sitios exclusivos de SFRA, cuando la autenticación híbrida está habilitada para la extensión de inicio de sesión del comprador, el valor DNT se sincroniza automáticamente con la sesión extendida, lo que garantiza una experiencia fluida en todas las sesiones.

Para habilitar/deshabilitar la sincronización Do not track (DNT) en Business Manager, navegue a Herramientas > del comerciante Seleccione sitio > Preferencias > del sitio Configuración de autenticación híbrida.

Cuando habilita la autenticación híbrida y la sincronización de DNT, el consentimiento de seguimiento proporcionado por un comprador en un sitio se sincroniza automáticamente con el otro sitio. Por ejemplo, en un sitio híbrido donde la página de inicio se ejecuta en PWA Kit y la página del carrito se ejecuta en SFRA:

En la página de inicio (PWA Kit), se presenta al comprador un formulario de consentimiento y proporciona su preferencia de seguimiento.
Cuando el comprador navega a la página del carrito (SFRA), el valor DNT de PWA Kit se sincroniza con SFRA.
Como resultado, la página del carrito de SFRA no vuelve a solicitar al comprador el consentimiento de seguimiento.

Si ha personalizado o planea personalizar la implementación predeterminada de DNT, es posible que la sincronización predeterminada no sea necesaria ni funcione según lo esperado. En tales casos, puede deshabilitar la sincronización de DNT mediante una preferencia del sitio. Todavía puede habilitar la autenticación híbrida incluso si la sincronización DNT está desactivada.

Hay una diferencia clave en la caducidad de las cookies DNT entre SFRA y PWA Kit:

SFRA establece la cookie DNT para que caduque al final de la sesión.
PWA Kit establece la caducidad para que coincida con la vida útil del token de actualización (por ejemplo, 30 días para compradores invitados).

Cuando un comprador pasa de una página de PWA Kit a una página de SFRA, la caducidad de la cookie DNT cambia de la caducidad del token de actualización a una caducidad basada en la sesión. Si el comprador cierra el navegador, la cookie se elimina. Como resultado, cuando el comprador regresa, el banner de consentimiento de seguimiento se muestra nuevamente como se esperaba.

Recomendamos encarecidamente probar su configuración híbrida en un entorno local. Para ello, debe configurar un proxy inverso porque la eCDN no admite SIG ni ODS. Para configurar y probar su sitio híbrido localmente en instancias SIG, debe usar su propio proxy inverso o CDN para dividir el tráfico.

Hemos creado una aplicación de Node.js de muestra que se puede utilizar para desarrollar y probar flujos de compradores de implementación híbrida en PWA Kit y SFRA/SiteGenesis. Las instrucciones de instalación, configuración y prueba para configurar el proxy inverso se mencionan en el archivo LÉAME del repositorio.

Puede configurar su ODS para usar una configuración de alias que sea similar a su configuración de producción. Esto puede ayudar a mantener las configuraciones locales y de producción idénticas. Por ejemplo, al configurar su sandbox para que su sitio híbrido esté disponible en la URI /, se asegura de que las URL enviadas por PWA Kit no deban traducirse para incluir la identificación del sitio. Así es como normalmente se configura un sitio de Producción (Production).

Para habilitar los alias en Business Manager, siga las instrucciones en este módulo para Alias del nombre del servidor de Salesforce B2C Commerce en Trailhead.

Puede configurar sus rutas de PWA Kit para prefijar que todas las URL salientes (por ejemplo, las diseñadas para SFRA) incluyan el prefijo /s/SiteID. Esto garantiza que su instancia reciba las URL de controller de una manera generalmente utilizada en los sandboxes sin necesidad de configurar explícitamente los alias del nombre del servidor. Tenga en cuenta que esto podría no ser apropiado para la configuración de Producción (Production), por lo que quizás debería tener una ruta de dirección predeterminada diferente para las implementaciones de Producción (Production) frente a las de sandbox.

Para configurar los prefijos de las rutas, actualice la ruta de dirección predeterminada de PWA (/*) en app/routes.jsx o overrides/app/routes.jsx.