Integratiehandleiding voor Smart Checkout

Met Viva.com Smart Checkout kunt u online betalingen accepteren via een gehoste betaalpagina.

In deze handleiding worden de belangrijkste stappen uitgelegd voor het integreren van Smart Checkout met uw website of app, van het instellen van uw Viva.com-account en betaalbron tot het doorsturen van klanten en het verifiëren van het betaalresultaat.

1. Kies uw Viva.com-omgeving

Viva.com biedt twee omgevingen. Zorg ervoor dat u de omgeving gebruikt die past bij wat u wilt doen.

Omgeving	Gebruik deze voor	Aan de slag
Productie	Echte betalingen accepteren	Registratieproces voor Viva.com-account \| Viva.com Support
Demo	Uw integratie en testbetalingen testen	Aan de slag met een sandbox/demo account \| Viva.com Support

Zorg ervoor dat u in de juiste omgeving werkt wanneer u uw integratie instelt en test.

2. Maak een betaalbron voor online betalingen aan

Een betaalbron bevat de instellingen die Viva.com gebruikt voor betalingen die via uw website of app worden uitgevoerd.

Configureer bij het instellen van uw betaalbron uw domein en de URL's waarnaar klanten moeten terugkeren nadat ze het betaalproces hebben voltooid.

Bijvoorbeeld:

een pagina voor een geslaagde betaling, zoals ‘Bedankt voor uw bestelling’
een pagina voor een mislukte betaling, zoals ‘Er is iets misgegaan met uw betaling’

Om een betaalbron voor online betalingen aan te maken, gaat u in uw Viva.com-dashboard naar Verkoop > Online betalingen.

Nadat u de betaalbron hebt aangemaakt, bewaart u de 4-cijferige broncode. U hebt deze code nodig wanneer u uw integratie configureert.

Voorbeeld van de configuratie van een betaalbron met broncode 2861

Raadpleeg voor gedetailleerde configuratie-instructies Bron voor online betalingen | Viva.com Support.

3. Integreer Smart Checkout

Er zijn drie belangrijke stappen voor het integreren van Smart Checkout:

Stap 1: Maak een betaalopdracht aan

Maak een betaalopdracht aan voordat u een betaling van een klant aanvraagt.

Aan elke betaalopdracht wordt een unieke 16-cijferige ID toegewezen, de orderCode.

Maak de betaalopdracht vanaf uw server aan met behulp van Create Payment Order API en geef vervolgens de orderCode door aan uw website of app.

Ga voor API-parameters en implementatiedetails naar Viva.com Developer Portal. Selecteer in het menu aan de linkerkant APIs for payments en vervolgens Payment API. Selecteer onder Payments Create payment order.

Stap 2: Stuur de klant door naar Smart Checkout

Nadat u de betaalopdracht hebt aangemaakt, stuurt u de klant door naar Smart Checkout. De klant kan vervolgens de betaalgegevens invoeren en het betaalproces voltooien op de Smart Checkout-pagina.

Stap 3: Verwerk de terugkeer van de klant en verifieer het betaalresultaat

Na het betaalproces wordt de klant doorgestuurd naar de URL die voor het betreffende resultaat is geconfigureerd:

Success URL voor geslaagde betalingen
Failure URL voor mislukte betalingen

U kunt deze URL's configureren in uw Viva.com-dashboard onder Verkoop > Online betalingen > Websites / Apps.

Verifieer het betaalresultaat

Verifieer de transactiestatus in uw systeem met behulp van de betaalinformatie die door Viva.com wordt teruggestuurd. De transactiegegevens die voor de validatie worden gebruikt, omvatten:

Amount
transactionId
statusId

Viva.com biedt de volgende methoden om het betaalresultaat te controleren.

Webhooks

Webhooks stellen uw systeem in staat om meldingen over geslaagde of mislukte betalingen te ontvangen en ondersteunen zowel synchrone als asynchrone betaalmethoden.

Ga voor implementatiedetails, gebeurtenisparameters en voorbeeldpayloads naar Viva.com Developer Portal en selecteer Webhooks For Payments in het menu.

Retrieve Transaction API

U kunt transactiegegevens ook ophalen met behulp van Retrieve Transaction API. Ga voor API-parameters en implementatiedetails naar Viva.com Developer Portal. Selecteer in het menu aan de linkerkant APIs for payments en vervolgens Payment API. Selecteer onder Transactions Retrieve transaction.

Optionele Smart Checkout-instellingen

U kunt ook aanvullende Smart Checkout-instellingen configureren op basis van de behoeften van uw integratie.

Geef uw merklogo weer

U kunt uw merklogo via de instellingen van uw betaalbron aan Smart Checkout toevoegen. Ga voor instructies naar Viva.com Developer Portal, ga naar Tutorials, selecteer Smart Checkout Configuration en klik vervolgens op Add your brand logo.

Zorg ervoor dat u een duidelijk logo met de juiste afmetingen uploadt voor een optimale weergave.

Geef een Cancel-knop weer

U kunt een Cancel-knop configureren in de geavanceerde configuratie-instellingen van de betaalbron. Hiermee kunnen klanten hun bestelling annuleren.

De Cancel-knop wordt ondersteund voor directe Smart Checkout-integraties en plugins voor Shopify en PrestaShop.

U kunt ook webhooks configureren om meldingen te ontvangen over gebeurtenissen met betrekking tot het annuleren van bestellingen. Ga naar Viva.com Developer Portal, selecteer Webhooks For Payments en vervolgens Order Updated voor meer informatie.

Aanvullende betaalopties

Smart Checkout ondersteunt ook aanvullende betaalconfiguraties, waaronder:

Terugkerende betalingen: De handelaar initieert na de eerste betaling automatisch afschrijvingen volgens een vooraf bepaald schema.
Pre-autorisaties: Een bedrag wordt gereserveerd en de overdracht van het geld wordt later geïnitieerd.

Ga voor technische implementatiedetails en andere beschikbare Smart Checkout-configuraties naar Viva.com developer portal.

Hebt u nog hulp nodig? Ons team staat voor u klaar. Neem contact met ons op via de optie Chat met ons in uw Viva.com-account.