Los clientes de API de inicio de sesión de comprador y acceso a API (SLAS) permiten que su aplicación autentique y autorice a los compradores. Los clientes SLAS son de dos tipos: públicos y privados.
Los clientes privados de SLAS ofrecen varias ventajas sobre un cliente público, entre ellas:
Para aprovechar las ventajas de un cliente privado de SLAS, el proyecto debe ser capaz de almacenar de forma segura un secreto de cliente.
Considere la posibilidad de usar un cliente público si el proyecto se ejecuta del lado del cliente y debe comunicarse directamente con los SLAS.
PWA Kit 3.5 y superior admite el uso de clientes públicos y privados de SLAS.
Todas las versiones de PWA anteriores a PWA Kit 3.5 solo admiten clientes públicos de SLAS.
Note
Si ya tienes un sitio de PWA Kit que utiliza un cliente público de SLAS, te animamos a que sigas leyendo y consideres la posibilidad de cambiar a un cliente privado.
Antes de ejecutar los comandos de esta guía, sustituya los marcadores de posición por valores reales. Los marcadores de posición tienen el siguiente formato: .
Al trabajar con clientes privados, se debe tener cuidado de no exponer el secreto del cliente a los compradores y a los exploradores del lado del cliente.
Para ayudar a proteger el secreto de cliente, el PWA Kit Retail React App almacena el secreto en el lado del servidor mediante el uso de variables de entorno. Consulte Establecer variables de entorno para obtener información sobre cómo almacenar el secreto de cliente.
A grandes rasgos, hará lo siguiente para configurar un cliente privado de SLAS con su sitio de PWA Kit.
En este vídeo se muestra cómo configurar un cliente privado SLAS para el PWA Kit y una implementación sin periféricos por fases.
Comience por completar las instrucciones en Autorización para API de compradores y Configurar acceso a API para crear su cliente privado de SLAS.
Una vez que hayas creado tu cliente privado SLAS, sigue los pasos a continuación para usarlo con tu sitio de PWA Kit:
Si aún no lo has hecho, actualiza a PWA Kit v3.5 o superior.
En el archivoconfig/default.js de configuración de PWA Kit, establezca su commerceAPI clientId en su ID de cliente privado de SLAS.
1clientId: '$YOUR_SLAS_PRIVATE_CLIENT_ID',En su _app-config/index.js, establezca la enablePWAKitPrivateClient prop de ’true.
1CommerceApiProvider enablePWAKitPrivateClient={true}En su ssr.js, establezca la useSLASPrivateClient propiedad de options pass to runtime.createHandler to true:
1const options = {useSLASPrivateClient: true}
2const {handler} = runtime.createHandler(options, callback)Ejecute el siguiente comando para establecer la variable de PWA_KIT_SLAS_CLIENT_SECRET entorno localmente en un símbolo del sistema activo:
export PWA_KIT_SLAS_CLIENT_SECRET=$YOUR_CLIENT_SECRETset PWA_KIT_SLAS_CLIENT_SECRET=$YOUR_CLIENT_SECRETEn un entorno de desarrollo local, querrá establecer el PWA_KIT_SLAS_CLIENT_SECRET más permanentemente para que se incluya automáticamente cuando abra un nuevo símbolo del sistema.
En Mac / Unix, puede hacer esto configurando la variable de entorno en el PWA_KIT_SLAS_CLIENT_SECRET archivo de .bashrc su máquina.
En Windows, puede hacerlo configurando la variable de PWA_KIT_SLAS_CLIENT_SECRET entorno a través del Panel de control -> Sistema -> Avanzado -> Variables de entorno.
Note
Si está ejecutando el sitio de PWA Kit de forma remota en Managed Runtime, puede establecer la variable de PWA_KIT_SLAS_CLIENT_SECRET entorno ejecutando el siguiente comando en el terminal después de reemplazar las variables para que coincidan con su entorno.
Para obtener más información sobre cómo obtener una clave de API de Managed Runtime y otras propiedades de su entorno remoto, consulte nuestra guíade paquetes de inserción e implementación.
1curl "https://cloud.mobify.com/api/projects/$PROJECTID/target/$ENVIRONMENTID/env-var/" \
2 --request 'PATCH' \
3 --header 'Content-Type: application/json' \
4 --header 'Accept: application/json' \
5 --header "Authorization: Bearer $RUNTIME_ADMIN_API_KEY" \
6 --data '{ "PWA_KIT_SLAS_CLIENT_SECRET": {"value": "'$PWA_KIT_SLAS_CLIENT_SECRET'"} }'Para obtener más información, consulte Variables deentorno.
Esta configuración se aplica a un storefront híbrido que usa SLAS de complemento. No se aplica si usa autenticación híbrida.
Note
Además de los pasos de configuración del PWA Kit descritos anteriormente, en un escaparate de lanzamiento por fases que utilice tanto PWA Kit como SFRA, también querrá actualizar los SLAS del complemento para utilizar su cliente privado de SLAS. Consulte el complemento SLAS para obtener instrucciones sobre cómo configurar un cliente privado de SLAS para que funcione con SFRA.
Si va a ampliar la implementación de PWA Kit para usar otros puntos de conexión de SLAS que requieren clientes privados, como el inicio de sesión sin contraseña, puede ampliar el conjunto de puntos de conexión disponibles mediante la applySLASPrivateClientToEndpoints opción para runtime.createHandler:
1const options = {
2 useSLASPrivateClient: true,
3 applySLASPrivateClientToEndpoints: /oauth2\/(token|passwordless\/(login|token))/
4}
5const {handler} = runtime.createHandler(options, callback)Si ve llamadas HTTP 400 a SLAS /authorize, el sitio de PWA Kit está usando los flujos de cliente público de SLAS con su ID de cliente privado. En el _app-config/index.js archivo, establezca la enablePWAKitPrivateClient propiedad dentro de CommerceAPIProvider en true.
En un entorno de desarrollo local, el servidor de PWA Kit no se iniciará si la useSLASPrivateClient propiedad está habilitada ssr.js y la variable de PWA_KIT_SLAS_CLIENT_SECRET entorno no se ha establecido. Establezca la variable de entorno en su secreto de cliente SLAS para continuar.
Después de implementar el sitio de PWA Kit en Managed Runtime, si ve un error HTTP 501 al realizar una llamada a SLAS, podría significar que la variable de PWA_KIT_SLAS_CLIENT_SECRET entorno no se ha establecido. Después de configurarlo, espere unos minutos para que se aplique el cambio.
j