¿Por qué no se cargan los campos de entrada de la tarjeta para el Componente de la tarjeta o el Drop-in?

En caso de que recibas el error Invalid client key or unknown origin en los iFrames de los campos de entrada de la tarjeta en tu Drop-in o tu Componente de la tarjeta, esto está relacionado con una clave incorrecta para tu autenticación del lado del cliente. Dependiendo de tu integración, puede ser la clave de cliente o la clave de origen. Puedes generar estas claves en el Customer Area navegando a Developers > API Credentials, donde puedes seleccionar la credencial de API para la que quieres generar la clave.

Si estás autenticando mediante una clave de origen, comprueba lo siguiente:

1. ¿Estás utilizando la clave de origen correcta en tu integración? Intenta generar de nuevo la clave de origen para los dominios en los que estás cargando el Componente de la tarjeta o el Drop-in.
2. ¿La clave de origen se genera para el dominio en el que se alojan los campos de la tarjeta? Puedes encontrar el origen de tu página comprobando window.location.origin en la consola del navegador como se explica aquí.
3. ¿La clave de origen se genera en el entorno correcto (de prueba/de producción)?

Si estás autenticando mediante una clave de origen, comprueba lo siguiente:

1. ¿Estás utilizando la clave de origen correcta en tu integración?
2. ¿Se añaden todos los dominios en los que se cargan los campos de entrada de la tarjeta al campo "Allowed Origins", como se explica aquí?
3. ¿Estás utilizando la clave del cliente en el entorno correcto (de prueba/de producción)?