Validación de dirección para Checkout de comercio electrónico

Objetivo

En este documento, se describen métodos para combinar Place Autocomplete, la API de Address Validation1 y Maps en una confirmación de compra de comercio electrónico con el fin de capturar direcciones de alta calidad.

Requisitos previos

Google recomienda estar familiarizado con lo siguiente:

  • Documentación para desarrolladores de Place Autocomplete para JavaScript
    • Comprende desde un punto de vista técnico cómo funciona Place Autocomplete y sus opciones de implementación.
  • Guía de implementación de la confirmación de la compra de Place Autocomplete
    • Ejemplos de las prácticas recomendadas para la implementación de Place Autocomplete en una confirmación de compra de comercio electrónico.
  • Documentación del producto API de Address Validation, con un enfoque en Cómo compilar tu lógica de validación.
    • Comprende desde el punto de vista técnico cómo funciona la API de Address Validation y revisa los indicadores que determinan la calidad de las direcciones.

¿Qué es la validación de direcciones?

La API de Address Validation es un servicio que acepta una dirección. Identifica los componentes de la dirección y los valida. También estandariza la dirección para el envío de correos y encuentra las coordenadas de latitud y longitud más conocidas para ella. De manera opcional, para las direcciones de Estados Unidos y Puerto Rico, puedes habilitar el Sistema de asistencia de precisión de programación (CASSTM).

¿Por qué necesitas validar la dirección en la confirmación de la compra?

Recopila direcciones exactas durante el proceso de pedido:
Este es un paso importante para promover entregas exitosas, aumentar la entrega a tiempo y reducir los costos costosos de corrección de direcciones.

Guía a los clientes para que ingresen la dirección de forma rápida y precisa:
Place Autocomplete acelera el ingreso de direcciones y reduce los errores de entrada, lo que les permite a los clientes avanzar fácilmente por la confirmación de la compra. Address Validation ofrece comentarios sobre la calidad general de las direcciones, corrige errores como errores ortográficos o de estandarización, y mejora los metadatos (por ejemplo, proporciona un indicador residencial o comercial) (disponible en determinadas regiones).

Descripción general de la implementación

En esta sección, se describe el flujo de trabajo recomendado para ingresar direcciones en las confirmaciones de compras de comercio electrónico. El proceso consta de tres pasos:

  1. Utiliza Place Autocomplete para capturar inicialmente la dirección.
  2. Usa la API de Address Validation para confirmar la dirección ingresada.
  3. Muestra la ubicación de la dirección ingresada en un mapa para brindar confianza a los clientes sobre las entregas.

A continuación, profundizaremos en cada paso de manera individual.

Paso 1: Flujo de entrada de direcciones mediante el servicio Place Autocomplete

Implementa Place Autocomplete con la API de JavaScript en la primera línea del formulario de entrada de dirección.

Place Autocomplete proporciona sugerencias al cliente a medida que ingresa los detalles de su dirección. Cuando se implementa con la API de JavaScript, cuando los usuarios comienzan a escribir, aparece un menú desplegable debajo del campo del formulario de entrada de dirección que muestra los resultados del servicio Autocomplete que se actualizan cada vez que se presiona una tecla. Una vez que el usuario ingresa suficiente información para encontrar la dirección, la selecciona en el menú desplegable. Esta acción propaga automáticamente los campos del formulario con los datos de la dirección.

Con Place Autocomplete, puedes proporcionar dos estilos de entrada de formularios al usuario: uno con todos los campos de dirección o uno con un solo campo de entrada. Este único campo de entrada solicita al usuario que comience a buscar mientras escribe, en lugar de ingresar los componentes de la dirección de forma individual. Una vez que la función de autocompletar propaga la dirección, el flujo de trabajo expande los campos del formulario con los datos de la dirección, lo que le permite al cliente revisar y hacer modificaciones, por ejemplo, agregar un número de departamento o unidad.

A continuación, se muestra un ejemplo de cómo podría aparecer este flujo con un solo campo de entrada:

imagen

Paso 2: Usa la API de Address Validation para validar direcciones

Después de que el usuario ingresa la dirección, Google recomienda que llames a la API de Address Validation durante la confirmación de la compra para confirmar que la dirección sea válida y esté completa. Activa una llamada a la API de Address Validation cuando el usuario haga clic en el botón Siguiente o Continuar del formulario de dirección. Este botón suele dirigir a la página de pagos.

Google recomienda llamar a la API de Address Validation para cada transacción.

En el siguiente diagrama de flujo, se ilustra un ejemplo de integración de extremo a extremo de la API de Address Validation dentro de una confirmación de la compra:

imagen

En este documento, se analizan más adelante las situaciones de aceptación de direcciones.

Paso 3: Proporciona una confirmación visual

Después de ingresar la dirección, muéstrale al usuario una confirmación visual de la ubicación de entrega mostrándola en un mapa. Esto ofrece al cliente una garantía adicional de que la dirección es correcta y reduce las fallas en la entrega o el retiro.

El mapa se puede mostrar durante el proceso de confirmación de la compra o se puede enviar en el correo electrónico de confirmación de la transacción. Ambos casos de uso se pueden lograr con las siguientes APIs.

La API de Maps JavaScript proporciona un mapa interactivo para mostrar la ubicación del usuario. La API de Maps Static permite incorporar imágenes en la página web o en una etapa posterior de un correo electrónico.

Descripción detallada: abordar las situaciones de aceptación

Las respuestas de la API de Address Validation se pueden clasificar en tres situaciones principales:

  • Corregir: La dirección es de baja calidad. Deberías solicitar más información.
  • Confirmar: La dirección es de alta calidad, pero tiene cambios desde la dirección ingresada. Es posible que solicites confirmación.
  • Aceptar: La dirección es de alta calidad. Puedes aceptar la dirección proporcionada.

Este concepto se aborda en la sección Crea tu lógica de validación de los documentos de la API de Address Validation y analizaremos cada situación en esta sección.

Corregir

imagen

En esta sección, se muestra cómo corregir una entrada de dirección. Si quieres obtener información sobre los indicadores específicos que muestra la API de Address Validation para indicar una dirección de baja calidad, consulta Cómo corregir una dirección en la documentación sobre cómo compilar tu lógica de validación.

Si la respuesta de la API de Address Validation indica una dirección no válida, redirecciona al cliente al formulario de entrada de direcciones para verificar los datos ingresados. Una vez que se haya corregido la dirección, el servicio debe reenviarla a la API de Address Validation para asegurarse de que las correcciones realizadas sean válidas.

También puedes destacar errores específicos en la línea de dirección usando los indicadores que se muestran a nivel del addressComponents. Un ejemplo de esto se puede ver en la captura de pantalla de la derecha.


Confirmar

imagen

En esta sección, se muestra cómo confirmar una dirección. Si quieres obtener información sobre los indicadores específicos que muestra la API de Address Validation para indicar que se debe confirmar una dirección, consulta Confirma una dirección en la documentación sobre cómo compilar tu lógica de validación.

A menudo, tu sistema querrá solicitarle al usuario que confirme una dirección. Por ejemplo, un cliente escribe mal el nombre de la ciudad, que luego se corregiría con la API de Address Validation. Debes confirmar esta corrección con el cliente. Esto se debe a que los cambios realizados por la API podrían alterar en gran medida lo que se ingresó en un principio.

Usa una ventana modal intersticial para mostrarle la información al cliente y habilitar tres opciones para continuar:

  1. Confirma la dirección como muestra la API, y el proceso de confirmación de la compra continúa con la dirección corregida.
  2. Selecciona la dirección tal como la ingresaste originalmente, ignorando la corrección de la API de Address Validation. El proceso de confirmación de la compra puede continuar como de costumbre, y el pedido puede marcarse para su revisión posterior antes del envío, si el proceso lo permite.
  3. El cliente cancela o revierte la ventana modal, y lo devuelve a la etapa de entrada de dirección del proceso de confirmación de la compra, en la que puede volver a ingresar la dirección desde cero y comenzar de nuevo el proceso.

Puedes ver un ejemplo de esto en la captura de pantalla a la derecha.


Aceptar

En esta sección, se muestra cómo aceptar una dirección. Si quieres obtener información sobre los indicadores específicos que muestra la API de Address Validation para indicar que una dirección es de buena calidad y debe aceptarse, consulta Acepta una dirección en la documentación sobre cómo crear tu lógica de validación.

En esta situación, el proceso de confirmación de la compra debe pasar a la siguiente etapa, probablemente captura del pago, sin indicaciones al cliente sobre la calidad de la dirección. La API confirmó que la dirección ingresada por el cliente es de buena calidad y se debe entregar.

Recomendamos usar los datos de dirección que se muestran de la API de Address Validation en el orden, ya que esto podría contener correcciones y adiciones menores, como los siguientes:

  • Uso de mayúsculas
  • Correcciones de formato, por ejemplo
    • De la calle a la calle
    • Orden correcto de los componentes de la dirección
  • ZIP+4 en EE.UU.

Consideraciones para la implementación

Cuando crees tu lógica de aceptación de direcciones, asegúrate de que la implementación no impida que los clientes paguen debido a que ingresan una dirección no válida. Crea una lógica de una manera que evite la posibilidad de un bucle infinito si la API indica repetidamente que su entrada no es válida.

Google recomienda que les brindes a los clientes hasta dos oportunidades para ingresar su dirección y, en el segundo intento, aceptar su entrada, incluso si no se valida. En el segundo intento, el objetivo es permitirles continuar sin importar la validación.

Se sugieren dos métodos para aceptar el segundo intento:

  • Force-proceed: Muestra al cliente una ventana modal en la que se explique que no se está validando la dirección, pero permite que se pueda continuar con la dirección que escribió.
  • Aceptación silenciosa: Acepta automáticamente el segundo intento sin un paso de confirmación, incluso si la dirección no se valida por completo.

Si es posible, diseña el sistema para marcar las direcciones que no se validan, de modo que un representante del servicio de atención al cliente pueda revisarlas antes de que se envíe el pedido. Esta medida adicional garantiza que puedas detectar cualquier error.

La construcción de un nuevo edificio ofrece un buen ejemplo de por qué se recomienda esta verificación. Es posible que haya un intervalo entre el momento en que finaliza la construcción del nuevo edificio y el momento en que la dirección de ese edificio se propaga en las bases de datos de direcciones postales. Los clientes deben tener la opción de forzar el proceso en la página de confirmación de la compra con la dirección ingresada, incluso si no se valida.

Una vez que se complete la sesión de confirmación de la compra, puedes usar el método provideValidationFeedback para enviar comentarios a Google sobre un intento específico de validación de dirección.

Conclusión

En este documento, se ofrece una descripción general de un flujo de confirmación de la compra que implementa Autocomplete, Address Validation y la confirmación visual en un mapa de Google Maps. Usa este documento como punto de partida para diseñar tu implementación de acuerdo con los flujos recomendados para ingresar direcciones.

Próximos pasos

Descarga el informe Mejora la confirmación de la compra, la entrega y las operaciones con direcciones confiables y consulta el seminario en línea Mejora la confirmación de la compra, la entrega y las operaciones con la validación de direcciones .

Lecturas adicionales sugeridas:

Colaboradores

Henrik Valve | Ingeniero de soluciones
Thomas Anglaret | Ingeniero de soluciones
Sarthak Ganguly | Ingeniero de soluciones


  1. Licenciatario no exclusivo del Servicio Postal de Estados Unidos. Las siguientes marcas son propiedad del United States Postal Service® y se utilizan con los permisos correspondientes: CASSTM, USPS®, DPV®.