Webform payment process

Webform payment process

To consider

To use the card payment form, the following aspects should be considered:
  1. The form is available at:
    1. Sandbox: https://sandbox-checkoutform.greenpay.me/
    2. Producción: https://checkout-form.greenpay.me/
  2. Get a session and token of a valid payment order (A session and token is valid within 30 minutes from the creation of the order) and include de callback param. In order to create session, token and include callback, you can check this article Create payment order.
  3. The card payment form is only available for web apps.
  4. Recommended: Implement a webhook to receive the responses in a backend, you can review the article Payment responses in webhook.


Step to use the payment form

1. Redirect to payment form

After receiving the payment order response (session and token), redirect to the payment form from the merchant site, this way:
  1. Generate the session and token in sandbox or live according to the environment.
  2. Create de url, this way:
    1. Sandbox: http://sandbox-checkoutform.greenpay.me/%7B%7Bsession%7D%7D
    2. Production: https://checkout-form.greenpay.me/{{session}}
The following is a javascript example to redirect.


const express = require("express");
const app = express();

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
extended: true
}));
app.get("/order", async function (req, res) {
try {
const security = await postOrder(order);
//console.log(security);
} catch (err) {
res.send(err);
}
});


When the redirection is done, the following form have to appear.



2. Capture form response

Once the user has completed the form fields and the data is processed, the form is going to redirect to callback URL with the answer in base64 format, this way: callbackURL/base64Response.


In the callback URL destination a function must exist to capture the base64 response and decode it. The following is a javascript example to capture the response.

app.get("/callback/:data", async function (req, res) {
try {
//get the response in base64
const data = req.params.data;

//decode the response in base64
var responsejson = Buffer.from(data, 'base64').toString();
console.log(responsejson);
res.send(JSON.parse(responsejson));
} catch (err) {
res.send(err);
}
});


The following is a response example decoded.

  2. {
  3.     "statusCode": 200,
  4.     "body": {
  5.         "status": 200,
  6.         "orderId": "xwr-123455",
  7.         "authorization": "533793",
  8.         "last4": "7777",
  9.         "brand": "Visa",
  10.         "result": {
  11.             "time_local_tran": "165407",
  12.             "systems_trace_audit_number": "000283",
  13.             "success": true,
  14.             "retrieval_ref_num": "701016540713",
  15.             "resp_code": "00",
  16.             "reserved_private4": null,
  17.             "proc_code": "000000",
  18.             "network_international_id": "0003",
  19.             "mti": "0210",
  20.             "merchant_id": 485,
  21.             "date_local_tran": "0110",
  22.             "card_acceptor_terminal_id": "00112478",
  23.             "authorization_id_resp": "533793"
  24.         },
  25.         "errors": [],
  26.         "callback": "http://yourcallback.url/getcheckoutform/response%22,
  27.         "_signature": "2e9d23b194905314561b8c750f7a7...beab114d717ec6"
  28.     }
  29. }

3. Get the payment response on webhook.

As mentioned in the widget considerations section, it is recommended to have a webhook enabled. Please review the article Receive the answer in the webhook.
The webhook allows obtaining the response in a backend event if an event like API timeout or disconnection of the user from the internet.

    • Related Articles

    • Widget payment process

      To consider Para utilizar el widget de pago de Greenpay, se debe considerar los siguiente: You must have a sandbox or production account, to obtain a sandbox account visit About sandbox or test account. The payment widget is a web element that can be ...

    • Manual payment

      For this service, the following endpoint must be consumed:  https://sandbox-merchant.greenpay.me/subscriptions/pay Step by step to process a successful manual payment in our API:  1.Create the JSON object to be sent. JSON structure example {   ...

    • Create payment order

      To consider A payment order is created to prepare the Greenpay API for a make a payment process. The following aspects have to be consider: Use these endpoints: Sandbox: https://sandbox-merchant.greenpay.me/ Production: https://merchant.greenpay.me/ ...

    • API Tokenization process

      To consider To invoke the payments api, the following aspects should be considered: Use the service on the endpoints: Sandbox: https://sandbox-checkout.greenpay.me/tokenize Production: https://checkout.greenpay.me/tokenize Get a session and token of ...

    • Webhook payment response

      1. Description If the merchant requires receiving the payments responses or card tokenization response in a backend, either to update orders, information or only store the response in the database as a backup, then they have to enable a webhook. A ...