This tutorial will help you integrating Fabrick Payment Orchestra and processing your first payment. Before getting started, make sure you have properly set up your merchant’s profile as shown in the previous chapters.

Integration types

Fabrick Payment Orchestra can be integrated on your website in two different ways:

Through the standard payment page
Through the customised payment page

The first part of this tutorial is the same for both integration .

Step-by-Step

Before you can actually redirect the user to Fabrick Payment Orchestra, you must do a POSTpayment/create call to initiate the payment process. Click on the link to see the API.

Remember: payment/create and payment/submit MUST be used in every transaction in order to create the payment process. The only case where you don’t need to call payment/submit is when the payment is performed from an alternative payment method.

The two endpoints available are test and production:

POST https://sandbox.gestpay.net/api/v1/payment/create/
POST https://ecomms2s.sella.it/api/v1/payment/create/

The POST call to payment/createrequests Fabrick Payment Orchestra to process a payment. Now set the authorization headers:

Authorization: apikey R0VTUEFZNjU5ODcjI0VzZXJjZW50ZSBUZX....

Content-Type: application/json

Every POST call must have the Content-type: application/json header.

and the body:

1{  
2  "shopLogin":"GESPAY65987",
3  "amount":"27.30",
4  "currency":"EUR",
5  "shopTransactionID":"your-custom-id"
6}

Fabrick Payment Orchestra will respond with:

1{
2  "error": {
3    "code": "0", // everything ok!
4    "description": "request correctly processed"
5  },
6  "payload": {
7    "paymentToken": "1c3f27af-1997-4761-8673-b94fbe508f31",
8    "paymentID": "1081814508",
9    "userRedirect": {
10      "href": null
11    }
12  }
13}

With the paymentToken (1c3f27af-1997-4761-8673-b94fbe508f31) and the paymentID (1081814508) you can now redirect the user to the payment page.

Now you have to choose which payment page you want to use: keep reading if you want to use the Lightbox solution, otherwise click the following link for learning how to integrate your customised payment page.

How to integrate the Lightbox solution

If you don’t need to customise your payment page, Fabrick Payment Orchestra lightbox is the best and fastest way to start accepting payments. It is responsive, meaning that it allows you to manage payments from any kind of devices (suche as mobile, desktop…) and it is very easy to integrate.

You can find more information in the lightbox documentation page

How to integrate your customised payment page

This solution is the ideal way to customise the payment process and offer a payment page layout that fits your needs and tunes with your Ecommerce design.

Assuming you have already made a POST payment/create call, the next step is to design an HTML form that will contain the credit card data: number, expiration date, CVV.

Then, once you have designed it, you must send a POSTpayment/submit call with the credit card data and the paymentToken generated by payment/create:

fetch('https://sandbox.gestpay.net/api/v1/payment/submit/',
    {
      method: 'POST',
      headers: {
        'paymentToken': `${PAYMENT_TOKEN}`,
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({
        "buyer":{
          "email":"test@email.com",
          "name":"Test Payment"
          },
        "paymentTypeDetails": {
          "creditcard": {
            "number":"4012001037141112",
            "expMonth":"05",
            "expYear":"27",
            "CVV":"444",
            "DCC":null
          }
        },
        "shopLogin":"GESPAY65987"
        }
      })
    }
  )

POST payment/submit call allows the user to pay with many other payment methods other than the credit card. For a full list, check the API documentation api link .

At this point two things can happen:

3D-Secure are not active on the credit card
3D-Secure are active on the credit card and must be redirected to the issuing bank's page for entering the security code

3D-Secure are not active on the credit card

In this case, the card does not require any special authorization and the response to the POST payment/submit call will be something like:

1{
2  "error":{
3    "code":"0",
4    "description":"request correctly processed"
5  },
6  "payload":{
7    "transactionType":"submit",
8    "transactionResult":"OK",
9    ...
10    "paymentID":"1700444660",
11    "userRedirect":{
12      "href":"https://hype-app.github.io/gestpay-doc-beta/demo/response.html"
13    }
14  }
15}

Now you can redirect the user to userRedirect.href, that will be populated based on your configuration in the Merchant Back-Office or your custom ones passed to POST payment/submit.

The credit card is 3D-Secure

If the credit card is 3D-Secure, we need to perform another step to complete the payment. Fabrick Payment Orchestra will answer with the transactionErrorCode 8006, that requires you to authenticate the card against the bank issuer:

1{
2  "error":{
3    "code":"0",
4    "description":"request correctly processed"
5  },
6  "payload":{
7    "transactionType":"submit",
8    "transactionResult":"",
9    "transactionErrorCode":"8006",
10    "transactionErrorDescription":"Verify By Visa",
11    "paymentID":"1546124641",
12    ...
13    "userRedirect":{
14      "href":"https://sandbox.gestpay.net/pagam/pagam3d.aspx?a=GESPAY65987&b=40cd411e-39a3-430f-b964-cb2018cd51a2&axerve3D=True"
15    }
16  }
17}

To complete the payment process, redirect the user to userRedirect.href and complete the payment process. Once it’s finished, you’ll be redirected to the success url page, as configured in the Merchant Back-Office.

Conclusions

In this tutorial, we have seen how easy it is to integrate Fabrick Payment Orchestra in your payment flow.

There’s much more! Fabrick Payment Orchestra allows you to pay with alternative payment methods and with different security checks, and offers an API to automate many operations of your Ecommerce.

Keep reading the docs!

Setup FTP/SFTP reporting

Administrative configurations