Netpay3ds

Netpay3ds es una librería que facilita la integración de 3d Secure v2.

Quick start

Typescript

Primero, ejecuta npm install netpay3ds --save en tu aplicación. Después, en tu app:

1.- Crea el token de tarjeta utilizando la librería netpayjs tokenizar tarjeta.

2.- Implementa la librería de netpay3ds.

app.modules.ts

import { Netpay3dsModule } from 'netpay3ds';

@NgModule({
  imports: [
    Netpay3dsModule,
  ],
})

app.component.ts

import { Netpay3dsService } from 'netpay3ds';

constructor(private netpay3ds: Netpay3dsService) {}

let _this = this;
this.netpay3ds.setSandboxMode(true);
this.netpay3ds.init(function () {
  _this.netpay3ds.config(_this, {{amount}}, _this.callback);
});

callback(_this: any, referenceId: string) {
  console.log('referenceId: ' + referenceId);
  _this.charges(referenceId);
}

charges(referenceId: string) {
  console.log('charges: ' + referenceId);
}

Toma el valor de referenceId para realizar el charge.

3.- Realiza el charge acorde a la documentación.

4.- Con la información de la respuesta del charge, ejecutar la función canContinue, si es true, ejecutar el método de continue y confirm posteriormente.

let status = charge.status;
let responseCode = charge.threeDSecureResponse.responseCode;
let acsUrl = charge.threeDSecureResponse.acsUrl;
let paReq = charge.threeDSecureResponse.paReq;
let authenticationTransactionID =  charge.threeDSecureResponse.authenticationTransactionID;

let canProceed = _this.netpay3ds.canProceed({{status}}, {{responseCode}}, {{acsUrl}});
if(canProceed) {
    this.netpay3ds.proceed(_this, {{acsUrl}} , {{paReq}}, {{authenticationTransactionID}}, this.callbackProceed);
}
else {
  this.confirm(null);
}

callbackProceed(_this: any, processorTransactionId: string, status: string) {
  console.log('processorTransactionId: ' + processorTransactionId);
  if(status == 'success') {
    _this.confirm(processorTransactionId);
  }
  else {
    //Rechazar transacción, mostrar mensaje de transacción rechazada
    console.log('error');
  }
}

confirm(processorTransactionId: string) {
  console.log('confirm: ' + processorTransactionId);
}

5.- Ejecuta el servicio de confirm acorde a la documentación.

Javascript

Si deseas utilizar la librería de Javascript, sólo cambia los puntos 2 y 4 anteriores por lo siguiente:

6.- Este punto es equivalente al punto 2.
Sandbox:

<script src="https://cdn.netpay.mx/js/dev/netpay3ds.js"></script>

Live:

<script src="https://cdn.netpay.mx/js/latest/netpay3ds.js"></script>

  let _this = this;
  netpay3ds.setSandboxMode(true);
  netpay3ds.init(function () {
    netpay3ds.config(_this, {{amount}}, _this.callback);
});

  const callback = function(_this, referenceId) {
    console.log('referenceId: ' + referenceId);
    charges(referenceId);
}

  const charges = function(referenceId) {
  console.log('charges: ' + referenceId);
}

7.- Este punto es equivalente al punto 4.

  let canProceed = netpay3ds.canProceed({{status}}, {{responseCode}}, {{acsUrl}});
  console.log(canProceed);
  if(canProceed) {
  netpay3ds.proceed(_this, {{acsUrl}} , {{paReq}}, {{authenticationTransactionID}}, callbackProceed);
}
  else {
    confirm(null);
}

  const callbackProceed = function(_this, processorTransactionId, status) {
    console.log('processorTransactionId: ' + processorTransactionId);
    if(status == 'success') {
      confirm(processorTransactionId);
    }
    else {
      //Rechazar transacción, mostrar mensaje de transacción rechazada
      console.log('error');
    }
  }

  const confirm = function(processorTransactionId) {
    console.log('confirm: ' + processorTransactionId);
  }

Si tienes problemas de conflicto con jquery, puedes utilizar la siguiente versión:
Sandbox:

<script src="https://cdn.netpay.mx/js/dev/netpay3ds-noConflict.js"></script>

Live:

<script src="https://cdn.netpay.mx/js/latest/netpay3ds-noConflict.js"></script>

Further help

Para mas información envia un correo a [email protected]