Una forma fácil de integrar el pago de Bizzon con su tienda virtual es a través del Checkout, que se encargará de crear formularios, validar la entrada y asegurar los datos de la tarjeta de sus clientes.
El Checkout es un nivel bastante alto de integración.
Aún puede usar sus propios formularios a través de la próxima función Bizzon.js si no se ajusta a su caso de uso.
Para ver cómo funciona, intente hacer clic en el siguiente ejemplo, completar el formulario con uno de los números de tarjeta de prueba Bizzon (4200000000000018 Visa o 5500000000000012 MasterCard), cualquier código CVC de tres dígitos, cualquier fecha de vencimiento en el futuro y cualquier nombre de titular de tarjeta.
Insertar el Checkout
La integración es simple. El archivo JavaScript en su página web expone un objeto global "agentcash" responsable para la comunicación con la plataforma Bizzon y el manejo del formulario de pago.
Si el archivo JS se carga con el parámetro clave, el objeto se inicializará automáticamente y no se necesita ninguna otra acción. De lo contrario, el objeto debe configurarse manualmente al enviar la clave API al método agentcash.configure().
Las claves API se pueden encontrar en el administrador: vaya a la sección "API" en "Tienda web" y genere una. Una vez inicializado, AgentCASH.js estará disponible instantáneamente al alcance de sus manos.
Tras la inicialización, AgentCASH.js buscará todos los elementos DOM que tengan establecido el atributo data-agentcash. Según el valor del atributo, pueden ocurrir diferentes escenarios y se pueden esperar atributos adicionales.
Ejemplo: Cobro de 50 €
Este ejemplo muestra la forma más sencilla de cómo integrar el flujo de cobro en su sitio web. La moneda comercial supuesta es el euro.
El script se incluye en HTML una vez (por ejemplo, en <head>):
<script src="https://www.bizzon.com/js/agentcash.js?key={key}"></script>
Todos los botones que sirven como puntos de inicio del flujo de cobro, deben marcarse con el atributo reconocible data-agentcash = "charge" y tener un importe válido en el importe de datos para acompañarlo.
<button
data-agentcash="charge"
data-amount="50.00"
data-language="en"
data-callback-url="{callback_url}"
data-external-id="{external_id}"
data-success-url="{success_url}"
data-failure-url="{failure_url}"
data-cancel-url="{cancel_url}">Buy</button>
Este botón le indica a AgentCASH.js cobrar 50 € al usuario.
Al hacer clic en este botón, se abre un diálogo emergente y se inicia el flujo de cobro dentro de él. El usuario debe proporcionar datos de su tarjeta de crédito. Si se aprueba la transacción de 50 €, Bizzon envía una solicitud POST a la URL definida con el atributo opcional data-callback-URL y muestra un diálogo de confirmación al usuario.
Si usted desea asignar un identificador personalizado al pago (por ejemplo, un número de pedido), lo debe proporcionar en el atributo data-external-id.
El cuerpo del mensaje POST enviado a la retrollamada URL contiene información sobre el pago. En caso del pago con éxito, el cuerpo de solicitud POST contiene los siguientes datos:
{
payment_id: "...",
external_id: "...",
type: "purchase",
status: "approved",
receipt_url: "http://www.bizzon.com/p/3423235",
amount: "50.00",
currency: "EUR",
approval_code: "123456",
card_brand: "mastercard",
card_masked_pan: "654321****1234",
card_cardholder_name: "Andy Jervis",
card_fingerprint: "...",
created_at: "2015-08-11T12:01:33Z",
signature_order: "...",
signature: "..."
}
Si desea mostrar su propia página en lugar del mensaje predeterminado de éxito/falla de Bizzon, puede definir las URL de esas páginas con los atributos opcionales data-success-url, data-failure-url y data-cancel-url.
Signatura de retrollamada
Para prevenir retrollamadas de servidor backend falsificadas, cada retrollamada originada desde el servidor backend Bizzon contiene dos campos de seguridad: signature_order y signature.
Ejemplo de retrollamada:
{
"amount": "30.01",
"card_cardholder_name": "Bob Gordon",
"card_masked_pan": "550000******0012",
"created_at": "2015-08-12T17:59:33Z",
"currency": "EUR",
"payment_id": "c2efcaf2-e222-405c-b9d4-6f9932d07f76",
"receipt_url": "http://test.host/i/vXMM9letRr2NJ_Ej4K2e6w",
"status": "approved",
"signature_order": "payment_id,status,receipt_url,amount,currency,card_masked_pan,card_cardholder_name,signature_order,secret",
"signature": "79e3fd76f392a9fe226b02646a8d2a3fb5d4f6e211298a0577f830955217a9a6d254831f1be0f4457f7649d961d4f1f93b25d9af8fad78b2f87bd3d708962b6c"
}
La signatura es un hash SHA-512 de todos los valores de objetos ordenados y unidos (sin delimitadores) así como lo especifica signature_order. También se incluye un valor secreto y el hash se calcula para la cadena de caracteres (string) final.
El ejemplo anterior muestra intencionalmente los campos ordenados en orden alfabético para demostrar que su orden para el cálculo de la signatura está de hecho especificado por el campo signature_order.
El secreto del ejemplo es "MeetTheFlintstones".
Por lo tanto, los valores ordenados según el campo signature_order del ejemplo son:
[
"c2efcaf2-e222-405c-b9d4-6f9932d07f76", // payment_id
"approved", // status
"http://test.host/i/vXMM9letRr2NJ_Ej4K2e6w", // receipt_url
"30.01", // amount
"EUR", // currency
"550000******0012", // card_masked_pan
"Bob Gordon", // card_cardholder_name
"", // signature_order
"MeetTheFlintstones" // secret
]
Los elementos matriz ahora se unen sin delimitadores en una cadena de caracteres, se cifran y la signatura se convierte en:
"79e3fd76f392a9fe226b02646a8d2a3fb5d4f6e211298a0577f830955217a9a6d254831f1be0f4457f7649d961d4f1f93b25d9af8fad78b2f87bd3d708962b6c"
Si la signatura calculada coincide con la de la solicitud, se puede confiar en ella. De lo contrario, puede no originarse de una fuente confiable.
Secreto
El secreto se combina con la clave API utilizada para identificar el sitio web y se puede recuperar desde la interfaz del usuario administrador Bizzon (Tienda web -> API). Sólo los administradores comerciales tienen acceso a estos datos.
El secreto no se debe compartir públicamente con nadie.
Elegir el idioma de la interfaz de usuario
El idioma del diálogo emergente se deduce del idioma predeterminado del comerciante. Sin embargo, si usted desea anular esta configuración predeterminada, puede establecer explícitamente el idioma de diálogo de la tarjeta al utilizar el atributo opcional de idioma de datos. Su valor debe ser un código de idioma de 2 letras:
- data-language = "en" - establece el idioma en inglés
- "de" - alemán
- "fr" - francés
- "it" - italiano
- "es" - español
- "pt" - portugués
- "ru" - ruso
- "cs" - checo
- "hr" - croata
- "sl" - esloveno
HTTPS para su sitio
Todos los envíos de información de pago mediante Checkout se realizan a través de una conexión segura HTTPS.
Sin embargo, para protegerse de ciertas formas de ataques intermedios, le sugerimos que también atienda la página que contiene el formulario de pago con HTTPS.
Esto significa que cualquier página en la que pueda existir un formulario Checkout debe comenzar con https:// en lugar de solo http://.
Comentarios
0 comentarios
El artículo está cerrado para comentarios.