A continuación, los pasos para el desarrollo.

Generación de Hash

Cada una de las transacciones realizadas a través de la solución Connect requiere incluir un hash de seguridad para poder garantizar la integridad del mensaje en nuestro servidor.

Para ello necesitaremos como mínimo los siguientes parámetros dentro de nuestro formulario HTML en el siguiente orden (es posible que según la operación se requieran más parámetros).

Parámetros del formulario

Paso 1 - El Hash necesita ser calculado utilizando TODOS los parámetros que vayas a enviar.

Crea una lista de todos los parámetros a enviar y ordénalos alfabéticamente según el nombre del parámetro (exceptuando sharedsecret y hashExtended).

Con la lista de parámetros ordenada, se debe unir los valores de los parámetros separados por pipes “|” para generar un único string.

stringForExtendedHash =

13.00|combinedpage|978|HMACSHA256|https://localhost:8643/webshop/response_failure.jsp|https//localhost:8643/webshop/response_success.jsp|10123456789|Europe/Berlin|2021:09:0616:43:04|sale

Paso 2 – Debemos encriptar el string creado con anterioridad a usando el algoritmo HMCASHA256 y con el SharedSecret que te fue compartido como la llave para generar el valor calculado del Hash.

Es importante que el valor obtenido de esta operación se mantenga como binario sin formato y no se convierta a un string ya que esto podría ocasionar problemas en el segundo paso.

HmacSHA256(stringToExtendedHash, sharedsecret)

En php la sintaxis correcta para este paso es incluir el parámetro raw_output como true. Cuando se establece en true la salida serán datos binarios sin formato:

 hash_hmac("sha256", stringToExtendedHash, sharedsecret, true)

Paso 3 - Codificar el valor retornado del algoritmo HMACSHA256 usando Base64, este valor es el que podrás utilizar para el parámetro hashExtended dentro del formulario HTML a enviar.

 Base64: EapafBqqOF6N/kch8USkHPGh+fwSko24h6FpQnQHfQ8=

 <input type="hidden" name="hashExtended" value="EapafBqqOF6N/kch8USkHPGh+fwSko24h6FpQnQHfQ8="/>

Validación de Hash

Una muy buena práctica de seguridad también es validar el hash obtenido a la respuesta de cada transacción. Esto para validar que la integridad del mensaje se haya conservado a la hora de obtener una respuesta.

Para ello realizaremos los siguientes pasos:

1. Genera un string con el siguiente orden:
   approval_code|chargetotal|currency|txndatetime|storename

str = “N:-5010:Hosted data was not found|10.00|484| 2023:02:17-09:13:19|6266666”

remplazando los parámetros con los valores obtenidos en tu respuesta, ejemplo:

2. Usa el string del paso anterior y encríptalo usando tu SharedSecret y el algoritmo HMACHSHA256
3. Pasa el valor a base64 y compara con el valor obtenido en response_hash si coinciden es prueba de que la información proviene de Fiserv y no de un agente malicioso.

Order ID (oid)

Este es el parámetro que nos ayudará a identificar cada una de nuestras transacciones. Por default, no hace falta agregarlo dentro del formulario ya que el gateway automáticamente genera este campo y nos lo regresa en la respuesta como "oid".

Ejemplo: C-424d61f0-2225-4ec8-b2e0-db2a8f926422

Sin embargo, si nosotros deseamos utilizar nuestro propio "oid" es posible enviarlo en el formulario de la siguiente manera, no debemos olvidar agregar también este parámetro en el cálculo del hash:

<input type="hidden" name="oid" value="yourOrderId" />

Tiene un límite de 78 caracteres con los siguientes rangos de caracteres permitidos A-Z, a-z, 0-9, "-".

Cabe recalcar que para cada transacción necesitamos generar un “oid” único para asegurar una correcta identificación de cada transacción (sin importar si fuera aprobada o declinada) y también asegurarnos de que el usuario no pueda reutilizar un “oid” ya que en este caso obtendremos un error.

Venta Directa

A continuación, un formulario que representa una venta de $100.00 MXN que se está realizando el día 02 de enero de 2020 a las 12:51:05 PM que se está efectuando sobre la tienda con ID 399000002. Al finalizar la transacción, el comprador es redirigido a las URLs especificadas en responseFailURL o responseSuccessURL.

<form method="POST"  action="https://test.ipg-online.com/connect/gateway/processing">

        <input type="hidden" name="chargetotal" value="100.00" />

        <input type="hidden" name="checkoutoption" value="combinedpage" />

        <input type="hidden" name="currency" value="484" />

        <input type="hidden" name="hash_algorithm" value="HMACSHA256" />

        <input type="hidden" name="hashExtended" value="EapafBqqOF6N/kch8USkHPGh+fwSko24h6FpQnQHfQ8=" />

        <input type="hidden" name="responseFailURL" value="https://myurl.com/checkout/success" />

        <input type="hidden" name="responseSuccessURL" value="https://myurl.com/checkout/error" />

        <input type="hidden" name="storename" value="399000002" />

        <input type="hidden" name="timezone" value="America/Mexico_City" />

        <input type="hidden" name="txndatetime" value="2020:01:02-12:51:05" />

        <input type="hidden" name="txntype" value="sale" />

</form>

iFrame

Si quieres embeber tu formulario dentro de un iframe considera los siguientes pasos:

1. Agrega el siguiente fragmento de código javascript a tu página de "Checkout". De esta forma podrás recibir la notificación de las transacciones realizadas y redirigir al comprador a la página de "ÉXITO" o de "ERROR".

window.addEventListener( "message", receiveMessage, false) ;

function receiveMessage(event) { if (event.origin "https://test.ipg-online.com") return; var elementArr = event.data.elementArr;

forwardForm(event.data, elementArr);

}

function forwardForm( responseobj, elementArr) { var newForm = document.createElement ("form");

newForm.setAttribute('method', ' post ') ;

newForm.setAttribute('action ', responseObj.redirectURL); newForm.setAttribute('id', 'newForm '); newForm.setAttribute('name', 'newForm'); document.body.appendChiId(newForm) ;

for (var i = 0; i < elementArr.length; i++) { var element = elementArr[i];

var input = document.createElement(' input' ) ; input.setAttribute( 'type ' , 'hidden '); input.setAttribute( ' name ' , element.name) ; input.setAttribute( ' value ' , element.value) ;

document.newForm.appendChiId (input) ;

}

document.newForm.submit( ) ;

}

2. Crea un formulario de pago simple con HTML dentro de tu sitio Web y en la página de "Checkout". Donde, adicionalmente a los parámetros de Venta directa, agregaremos el atributo target al elemento form y el parámetro parentUri.

<form method="POST" target="myFrame"  action="https://test.ipg-online.com/connect/gateway/processing">

        <input type="hidden" name="chargetotal" value="100.00" />

        <input type="hidden" name="checkoutoption" value="combinedpage" />

        <input type="hidden" name="currency" value="484" />

        <input type="hidden" name="hash_algorithm" value="HMACSHA256" />

        <input type="hidden" name="hashExtended" value="EapafBqqOF6N/kch8USkHPGh+fwSko24h6FpQnQHfQ8=" />

        <input type="hidden" name="parentUri" value="URL WHERE IFRAME IS LOADED" />

        <input type="hidden" name="responseFailURL" value="https://myurl.com/checkout/success" />

        <input type="hidden" name="responseSuccessURL" value="https://myurl.com/checkout/error" />

        <input type="hidden" name="storename" value="399000002" />

        <input type="hidden" name="timezone" value="America/Mexico_City" />

        <input type="hidden" name="txndatetime" value="2020:01:02-12:51:05" />

        <input type="hidden" name="txntype" value="sale" />

</form>

<iframe name="myFrame"></iframe>