Overview

Initialize SDK
Create a token
Embed the tokenizer
Pay with token
Pay with Paypal

📘
This guide covers the Tokenizer Integration and Redirect payment systems

1. Initialize SDK

var mpay24 = require('mpay24-node');
mpay24.init('merchantID','password', 'TEST');

require_once('bootstrap.php');
use Mpay24\Mpay24;

$mpay24 = new Mpay24(); // or with soap username, password if not provided in config

2. Creating a token

To create a token, the CreatePaymentToken ( Tokenizer Integration ) call needs to be invoked

mpay24.createPaymentToken({
  pType: 'CC',
  templateSet: 'DEFAULT',
}).then(result => {
  result.location; // location of the tokenizer to embed
  result.token; // token to initialize the payment
});

$tokenizer = $mpay24->token("CC");
$tokenizerLocation = $tokenizer->getLocation();
$token = $tokenizer->getToken();

3. Embedding the tokenizer

The tokenizer is a simple form for handling the creditcard input.
The returned location should be embedded into your checkout/page.

After valid input of all creditcard information, an iFrame message will be sent to your page.
It could be used to enable the "pay" button.

window.addEventListener("message", checkValid, false);
function checkValid(form) {
  var data = JSON.parse(form.data);
  if (data.valid === "true") { 
    // enable the button
  } 
}

4. Pay with the token

After storing all the creditcard data on our site, it is possible to pay with this token.
This can be archived with an acceptPayment call.

mpay24.acceptPayment({
  tid: '123',
  pType: 'TOKEN',
  payment: {
    amount: 100,
    currency: 'EUR',
    token: 'y2hUtk9fn3mhv2yVox0yarawKzWQv0+vf/cp1NuzxFw=',
  }
}).then(result => {
  result.status; // OK
  result.returnCode; // OK or REDIRECT (3DS)
  result.location; // only set if REDIRECT
}).catch(err => {
  console.error(err);
});

$payment = array(
  "amount" => "100",
  "currency" => "EUR",
  "token" => "y2hUtk9fn3mhv2yVox0yarawKzWQv0+vf/cp1NuzxFw="
);
$additional = array(
  "customerID" => "customer123",
  "successURL" => "http://yourdomain.com/success",
  "errorURL" => "http://yourdomain.com/error",
  "confirmationURL" => "http://yourdomain.com/confirmation",
  "cancelURL" => "http://yourdomain.com/cancel"
);

$result = $mpay24->payment("TOKEN", "123", $payment, $additional);

5. Pay with Paypal

If a redirect payment should be initialized, the customer needs to be redirected to the returned URL.

mpay24.acceptPayment({
  tid: '123',
  pType: 'PAYPAL',
  payment: {
    amount: 100,
    currency: 'EUR',
  }
}).then(result => {
  result.status; // OK
  result.location; // redirect customer to this url
}).catch(err => {
  console.error(err);
});

$payment = array(
  "amount" => "100",
  "currency" => "EUR"
);
$additional = array(
  "customerID" => "customer123",
  "successURL" => "http://yourdomain.com/success",
  "errorURL" => "http://yourdomain.com/error",
  "confirmationURL" => "http://yourdomain.com/confirmation",
  "cancelURL" => "http://yourdomain.com/cancel"
);
$result = $mpay24->payment("PAYPAL", "123", $payment, $additional);
echo $result->getLocation(); // the redirect location to paypal

Example: Node.js

This example covers a seamless payment with creditcard and a redirect to paypal

To install dependencies run following script in a npm project

npm init
npm install express body-parser mpay24-node -S

Create a index.js with following code

var express = require('express');
var bodyParser = require('body-parser');
var mpay24 = require('mpay24-node');

var app = express();
app.use(bodyParser.urlencoded({ extended: true }));

mpay24.init('merchantID','password', 'TEST');

app.get('/', function (req, res) {
  mpay24.createPaymentToken({
    pType: 'CC',
    templateSet: 'DEFAULT',
  }).then( function (result) {
    res.send(`
      <iframe src="${result.location}" frameBorder="0"> </iframe>
      <form action="/pay" method="POST">
        <input name="token" type="hidden" value="${result.token}" />
        <button id="paybutton" name="type" value="TOKEN" type="submit" disabled="true">Pay with creditcard</button>
        <button name="type" value="PAYPAL" type="submit">Pay with paypal</button>
      </form>
      <script>
      window.addEventListener("message", checkValid, false);
      function checkValid(form) {
        var data = JSON.parse(form.data);
        if (data.valid === "true") {
          document.getElementById("paybutton").disabled=false;
        }
      }
      </script>
    `);
  }).catch(err => {
    res.send(err);
  });
});

app.post('/pay', function (req, res) {
  const payReq = {
    tid: 'test',
    pType: req.body.type,
    payment: {
      amount: 100,
      currency: 'EUR',
      token: req.body.token,
    }
  };
  mpay24.acceptPayment(payReq).then( function(result) {
    if (result.returnCode === 'REDIRECT' )
      res.redirect(result.location);
    else
      res.send(result);
  }).catch(err => {
    res.send(err);
  });
});

app.listen(3000, function () {
  console.log('Ready to create payments');
});

To start the server, just run

node index.js

Example: PHP

This example covers a seamless payment with creditcard and a redirect to paypal

Upload the PHP SDK from github: mpay24-sdk
If you are using composer - please check out the readme in our repository
Configure your SOAP username/password in /lib/config/config.php
Create two new files with following content

<?php
require("../bootstrap.php");

use Mpay24\Mpay24;

$mpay24 = new Mpay24();

// Each Line is Optional so only add the lines that you need
$tokenizerConfig = array(
    "language"    => "EN",
);

$tokenizer = $mpay24->token("CC", $tokenizerConfig);
?>

<iframe src="<?php echo $tokenizer->getLocation(); ?>" frameBorder="0"></iframe>

<form action="pay.php" method="POST">
    <input name="token" type="hidden" value="<?php echo $tokenizer->getToken(); ?>"/>
    <button id="paybutton" name="type" value="TOKEN" type="submit" disabled="true">Pay with creditcard</button>
    <button name="type" value="PAYPAL" type="submit">Pay with paypal</button>
</form>

<script>
    window.addEventListener("message", checkValid, false);
    function checkValid(form) {
        var data = JSON.parse(form.data);
        if (data.valid === "true") {
            document.getElementById("paybutton").disabled = false;
        }
    }
</script>

<?php
require("../bootstrap.php");

use Mpay24\Mpay24;

$mpay24 = new Mpay24();

$payment = array(
    "amount"         => "100",
    "currency"       => "EUR",
    "manualClearing" => "false",       // Optional: set to true if you want to do a manual clearing
    "useProfile"     => "false",       // Optional: set if you want to create a profile
);

// All fields are optional, but most of them are highly recommended
$additional = array(
    "customerID"      => "customer123", // Required if useProfile is true
    "customerName"    => "Jon Doe",
    "order"           => ["description" => "Your description of the Order"],
    "successURL"      => "http://yourdomain.com/success",
    "errorURL"        => "http://yourdomain.com/error",
    "confirmationURL" => "http://yourdomain.com/confirmation",
    "language"        => "EN",
);

if (isset($_POST["type"])) {
    $type = $_POST["type"];
    switch ($type) {
        case "TOKEN":
            $payment["token"] = $_POST["token"];
            break;
    }

    $result = $mpay24->payment($type, "123 TID", $payment, $additional);

    if ($result->getReturnCode() == "REDIRECT") {
        header("Location: " . $result->getLocation());
    } else {
        echo $result->getReturnCode();
    }
}