Estado de pago
Para supervisar los pagos, puede utilizar una de las soluciones de estado de supervisión proporcionadas por Yuno. Puede utilizar una de estas dos opciones:
- Estado: Puede utilizar el SDK de Estado para actualizar al usuario sobre el proceso de pago. Proporciona información visual para los clientes.
- Status Lite: Puede utilizar el Lite SDK para obtener información sobre el estado actual del pago. Sin embargo, el Status Lite no monta ningún elemento.
Ambas soluciones initialize de la misma manera. Tras añadir el SDK de Yuno a tu sistema y crear una instancia, consulta la solución de estado deseada para aprender a utilizarla.
Paso 1: Incluya la biblioteca en tu proyecto.
Asegúrese de que el archivo SDK de Yuno esté incluido en su página web antes de cerrar el <body> . Vea el ejemplo a continuación:
<script src="https://sdk-web.y.uno/v1.5/main.js"></script>Paso 2: Initialize el SDK con la clave pública
En su aplicación JavaScript, cree una instancia del archivo Yuno proporcionando un PUBLIC_API_KEY. Ver el Obtenga sus credenciales de API .
Como en el ejemplo siguiente, utiliza la clase inicializada que se atribuye a la clase yuno constante:
<script src="https://sdk-web.y.uno/v1.5/main.js"></script>Una vez creada la instancia, elige entre utilizar las soluciones Estado o Estado Lite para acceder al estado de pago.
Paso 3: Usar estado
Para usar el Status, debes montarlo. Utiliza mountStatusPayment para definir el checkoutSession relacionado con el pago, el countryCode, la language, y la callback yunoPaymentResult.
El callback se ejecutará cuando se reciba el estado, informando al usuario. Definir el elemento para montar el Estado es innecesario ya que cubrirá toda la pantalla. El siguiente bloque de código muestra un ejemplo de configuración de parámetros:
yuno.mountStatusPayment({
checkoutSession: '438413b7-4921-41e4-b8f3-28a5a0141638',
countryCode: 'FR',
language: 'fr',
yunoPaymentResult(data) {
console.log('yunoPaymentResult', data)
}
})Parámetros
| Parámetro | Descripción |
|---|---|
checkoutSession | El ID de la sesión de pago que desea supervisar |
countryCode | El código de país para el proceso de pago. Consulte Cobertura de países para conocer los países admitidos |
language | Idioma de la pantalla de estado. Opciones admitidas: en, fr, jp |
yunoPaymentResult | Función callback que recibe el estado del pago. El parámetro de datos puede ser: 'READY_TO_PAY', 'CREATED', 'SUCCEEDED', 'REJECTED', 'CANCELLED', 'ERROR', 'DECLINED', 'PENDING', 'EXPIRED', 'VERIFIED', 'REFUNDED'. |
Usar Estado Lite
Para recibir el estado de pago actual usando Status Lite, debe llamar al método yunoPaymentResult proporcionando el checkoutSession relacionados con el pago, como se muestra en el siguiente ejemplo:
const status = await yunoyunoPaymentResultcheckoutSession)El objeto yunoPaymentResult devuelve el estado actual del pago sin mostrar ningún elemento de la interfaz de usuario. El estado devuelto puede ser uno de los siguientes valores:
READY_TO_PAYCREATEDSUCCEEDEDREJECTEDCANCELLEDERRORDECLINEDPENDINGEXPIREDVERIFIEDREFUNDED
Integración de estado de pago personalizadoSi prefiere utilizar su propia página de Estado de pago personalizada en lugar de personalizar la proporcionada por nuestro SDK, puede hacerlo editando el archivo HTML para conectarse a una página editada.
status-lite.jsScript. Esto le permite personalizar completamente la apariencia y el comportamiento de la visualización del estado de pago sin dejar de usar la funcionalidad de estado de Yuno. Por ejemplo, después de llamar alyunoPaymentResultFunción, puede manejar el resultado del estado en su propia versión de lastatus-lite.jsscript, que luego actualizará su archivo HTML personalizado.
Mantente al día
Visita el registro de cambios para ver las últimas actualizaciones del SDK y el historial de versiones.
Actualizado hace 26 días