Gestpay diventa Axerve Ecommerce Solutions

Lightbox

La pagina di pagamento Lightbox è sotto forma di pop-up che compare sopra la pagina del carrello dell’Ecommerce dopo che il cliente ha cliccato sul pulsante di pagamento. La user experience di questa soluzione è molto apprezzata a livello globale grazie alla sua usabilità e nonostante sia poco personalizzabile.

Una volta integrato, il pop-up di checkout apparirà come mostrato nell’immagine.

Si possono scegliere i metodi di pagamento da visualizzare (es. carte di credito e debito, PayPal, MyBank, Alipay, ecc.) tra quelli attivati dal merchant.

Nel caso di chiamate da dispositivi mobili, la Lightbox verrà mostrata su una nuova pagina.

Come integrare la soluzione Lightbox

Come detto nei capitoli precedenti, la Lightbox è la soluzione più immediata da integrare e offre ai merchant una pagina di pagamento responsive e di facile utilizzo per i clienti.

Per prima cosa, occorre importare lo script js nella pagina di pagamento:

Dopodiché, si devono inizializzare lo shopLogin ed usare il PaymentToken e il PaymentID ricevuti nello step precendente (payment/create) e, in javascript, chiamare:

axerve.lightBox.shop = shopLogin;
axerve.lightBox.open(paymentID, paymentToken);

La pagina Lightbox così comparirà al cliente con i campi per inserire le informazioni della carta di credito.Per l’ambiente di sandbox, utilizzare solo una delle nostre carte di credito di test.

Una volta completato il pagamento, la Lightbox ridireziona all’endpoint specificato nel backoffice.

È possibile sovrascrivere la funzionalità di redirect passando una callback alla Lightbox:

axerve.lightBox.open(paymentID, paymentToken, callback);

Sempre a pagamento completato, viene richiamata la funzione di callback e riceve un oggetto di response come discussione:

function callback(response) {
  console.log(response); 
}
/* example response:  
{ 
  error: { 
    code: null,
    description: null
  }, 
  paymentId: "1100274624", 
  responseURL: " http://<your-server>/?a=GESPAY65987&Status=OK&paymentID=1100274624",
  status: "OK"
}
*/

Come visto, il pagamento è stato correttamente processato; vediamo qual è la responseURL?

Un pagamento può essere accettato o rifiutato, e in base all’esito è possibile specificare dove debba esser reindirizzato il cliente all’interno delle impostazioni del backoffice. Così facendo, il gateway fornirà un link con quattro parametri: