1. Tokenizar Tarjeta

❗️

ACTUALIZACION EN CHECKOUT CUSTOM

Por requerimeintos de nuestra herramienta de seguridad, se agregaron nuevos datos a la integración

  1. Nueva funcion JS deviceInformation() que devolvera nueva información del dispositivo que ejecuta la transacción
  2. Se agregan campos en el enpoint de charge v3.5 para la ejecucion correcta del 3ds v2. Estos campos se llenan con la información que devulve la función deviceInformation()

Para información mas detallada puede consultarla en esta documentación o solicitar una asesoria en la implementacion de estos nuevos datos en conjunto con el equipo de integraciones de Netay. Cita con integraciones por API.

Formulario para tokenización creado por NetPay

Para poder tokenizar una tarjeta puedes utilizar nuestra librería NetpayJS que se puede importar desde una CDN, o bien, se puede utilizar directamente descargando la librería JS y guardandola en tu proyecto.
Lo que nuestro librería NetpayJS hará es encriptar los datos bancarios de tu cliente para enviarlos a nuestros servidores y una vez procesada la información, nosotros te devolveremos un token con el cual el cliente podrá comenzar una transacción en nuestra API.

Ejemplo NetpayJS

CDN Sandbox: https://docs.netpay.mx/cdn/js/dev/netpay.min.js

CDN Productivo: https://docs.netpay.mx/cdn/v1.3/netpay.min.js

<!DOCTYPE html>
<html>
<head>
  <title>NetPay.js</title>
  <meta http-equiv="content-type" content="text/html;charset=utf-8" />
  <script type="text/javascript" src="https://docs.netpay.mx/cdn/v1.3/netpay.min.js"></script>
  
</head>
  <body style="padding: 50px;">
        <div id="netpay-form"></div>
        <script>  
            NetPay.setApiKey("pk_netpay_GjffDZwRpkuKNooyJJwVinajH");
            NetPay.setSandboxMode(true);
            //NetPay.saveCard(false);
        
            function success(e) {
                console.log("Token created successfully");
                console.log(e);
                console.log(e.message.deviceInformation.httpBrowserColorDepth)
            }
        
            function error(e) {
                console.log("Something went wrong!");
                console.log(e);
            }
        
            NetPay.form.generate("netpay-form", success, error, { title: "Pagos con tarjeta", submitText: "Continuar" });
            //NetPay.form.reset();
            let deviceInformation = NetPay.form.deviceInformation();
            console.log(deviceInformation);
            console.log(deviceInformation.httpBrowserColorDepth);
        </script>
  </body> 
</html>
299

👍

Ejemplo de token generado

token_q8L5Bf-35r0CnhcfJDEAGqg3ZdGNv

Anatomía NetpayJS

Inicialización

NetPay.setApiKey("PUBLIC_API_KEY");

Modo Sandbox
NetpayJS opera en dos ambientes: producción y sandbox.
Para operar sobre el modo sandbox es necesario indicarlo de la siguiente manera.

NetPay.setSandboxMode(true);

Manejo de respuestas

NetpayJS regresa los resultados de la operación por medio de funciones de respuesta ( callbacks ), estas funciones reciben objetos JSON con la respuesta.

Las funciones de respuesta se pasan como argumentos al momento de inicializar un formulario o al momento de llamar la función NetPay.form.generate();

NetPay.form.generate("netpay-form", success, error, { title: "Pago con tarjeta", submitText: "Pagar" });

La operación de tokenización puede concluir de dos maneras, satisfactoriamente o con error, para ambos casos se declara una función que recibe la respuesta.

🚧

Atención

Al momento de tokenizar una tarjeta con NetpayJS el token que te devolverá hasta este punto solo será de un solo uso y se invalidará para un segundo uso si no se le asigna un cliente antes de procesar otro pago con este token de la tarjeta.

Formulario para tokenización creado por el comercio

NetPayJS cuenta con herramientas para generar el token de una tarjeta sin necesidad de utilizar el formulario predeterminado de la librería. Solo se requiere invocar la función NetPay.token.create().

❗️

Importante

Al utilizar esta función se tendrá que validar en el código fuente que no se almacene ninguna información bancaria sin tokenizar por parte del comercio, solo se deberá usar en variables temporales para pasarlas como argumento a nuestra función y poder obtener el token de transacción. Lo anterior será validado durante la certificación en ambiente sandbox.
NetPay tendrá registro de esta certificación y en dado caso que se realice algún cambio al código fuente que afecte el flujo de pago anteriormente descrito será necesario agendar una nueva certificación.

Código de ejemplo

<html>

<head>
    <script type="text/javascript" src="https://docs.netpay.mx/cdn/v1.3/netpay.min.js"></script>
</head>

<body style="padding: 50px;">
    <script>
        let deviceFingerPrint;
        NetPay.setSandboxMode(true); // Esta línea se debe de llamar antes de la generación del device fingerprint

        //La generación del device fingerprint debe de estar al momento en que se visualiza el formulario de pago
        function generateDevice(callback) {
            deviceFingerPrint = NetPay.form.generateDeviceFingerPrint();
            callback();
        }
        
        generateDevice(function() { 
            console.log(deviceFingerPrint);
            let cardInformation = {
                cardNumber: "4000000000000002",
                expMonth: "04",     
                expYear: "25",
                cvv2: "999",
                vault: true,
                simpleUse:false,//true si no se va hacer guardado de tarjeta o false si se realizara guardado de tarjeta
                deviceFingerPrint : deviceFingerPrint
            };
            NetPay.setApiKey("pk_netpay_JGFtQNUFIENMlhkoBXdgiozmQ");

            var validateNumber = NetPay.card.validateNumber(cardInformation.cardNumber);
            var validateExpiry = NetPay.card.validateExpiry(cardInformation.expMonth, cardInformation.expYear);
            var validateCVV = NetPay.card.validateCVV(cardInformation.cvv2, cardInformation.cardNumber);
            var validateNumberLength = NetPay.card.validateNumberLength(cardInformation.cardNumber);

            if (!validateNumberLength || !validateNumber 
                || !validateExpiry || !validateCVV) {
                alert("Por favor, verifica los datos de tu tarjeta");
                return false;
            }
            NetPay.token.create(cardInformation, success, error);

            function success(e) {
                console.log("Token created successfully");
                console.log(e.message.data);
            }

            function error(e) {
                console.log("Something went wrong!");
                console.log(e);
            }
          
          	let deviceInformation = NetPay.form.deviceInformation();
            console.log(deviceInformation);
        });
    </script>
</body>
</html>

🚧

Manejo del atributo simpleUse en tokenizacion

El campo simpleUse se debe de enviar como false si se va a realizar un guardado de tokens para usos futuros, ya que en el endpoint de charge se debe de enviar el CVV o CVC nueva mente en cada nueva transaccion con las tarjetas guardadas. En caso contrario si no se va a realizar un guardado de tokens el campo simpleUse siempre debe de ir en true.

👍

Ejemplo de token generado

token_q8L5Bf-35r0CnhcfJDEAGqg3ZdGNv

Manejo de respuesta

NetPay.js regresa los resultados de la operación por medio de funciones de respuesta ( callbacks ), estas funciones reciben objetos JSON con la respuesta.

Las funciones de respuesta se pasan como argumentos al momento de inicializar un formulario o al momento de llamar la función NetPay.token.create().

Validaciones

NetPayJS cuenta con funciones que ayudan a validar los datos utilizados para la tokenización de una tarjeta.
Las validaciones de la tarjeta se hacen a través del objeto NetPay.card, este objeto cuenta con las siguientes funciones de validación:

validateCVV

Esta función ayuda a validar si el CVV es válido en función del número de tarjeta a tokenizar. La función regresa true o false según la validación.

ParámetroDescripciónTipo de dato
CVVValor del cvv de la tarjeta a tokenizarString
cardNumberNúmero de la tarjeta a tokenizarString

Ejemplo de uso

NetPay.card.validateCVV("123","400000000000002");

validateExpiry

Esta función ayuda a validar la fecha de expiración, tanto el formato "mm/aa", así como validar que la fecha ingresada no está expirada. La función regresa true o false según la validación.

ParámetroDescripciónTipo de dato
monthRecibe el mes en formato de 2 dígitosString
yearRecibe el año en formato de 2 dígitosString

Ejemplo de uso

NetPay.card.validateExpiry("01","25");

validateNumberLength

Esta función ayuda a validar la longitud de la tarjeta en función del tipo de tarjeta que sea (VISA, MasterCard o AmericanExpress). La función regresa true o false según la validación.

ParámetroDescripciónTipo de dato
cardNumberRecibe el número de la tarjetaString

Ejemplo de uso

NetPay.card.validateNumberLength("5200000000000007");

validateNumber

Esta función ayuda a validar el número de la tarjeta, es decir, que la tarjeta introducida sea correcta y no solo número aleatorios que simulen pertenecer a una tarjeta. La función regresa true o false según la validación.

ParámetroDescripciónTipo de dato
cardNumberRecibe el número de la tarjetaString

Ejemplo de uso

NetPay.card.validateNumber("5200000000000007");