Manage the Return and Callback URLs

PayTabs provides you with the backend packages that make the integrating with PayTabs payment gateway very easy by providing ready-made classes that handle the payment process.

This article is dedicated to walking you through how to manage and pass the return and the callback URLs.

---

Method Specification

Description	Create the Payment Page.
Since	1.0.0
Required	✔
Signature	/** * @function createPaymentPage * @param {Array} payment_code - List of accepted payment methods. * @param {Array} transaction - Transaction type and class. * @param {Array} cart - Cart details including ID, currency, amount, and description. * @param {Array} customer - Customer details. * @param {Array} shipping - Shipping details. * @param {Array} urls - Callback and return URLs. * @param {string} lang - Language code (e.g., "en"). * @param {Function} callbackFunction - Function to handle the response. * @param {boolean} [framed=false] - Whether to use a framed payment page. */ PayTabs.createPaymentPage(payment_code, transaction_details, cart_details, customer_details, shipping_address, response_URLs, lang, callback, framed);
Sample	PayTabs.createPaymentPage( paymentMethods, transaction_details, cart_details, customer_details, shipping_address, response_URLs, lang, callbackMethod, frameMode );

---

Method Parameters:

Response URLs

Name	response_URLs
Type	Array
Array Element values:	First return The return URL is the URL that PayTabs will redirect the customer to after he finishes the payment process (whether it's authenticated or not). It will redirect the customer with a POST response that is sent with the client/cardholder redirection through his browser containing the basic transaction information once the payment process ends (whether the customer cancels, paid, or failed to pay). It depends on the customer's actions, which means if the customer closes the browser right after the payment without waiting to be redirected back to your system, you will not receive this response. Type Validation Rules Required String Valid URL ✘ Second callback The callback response is a server-to-server POST response that is sent (to a pre-defined HTTPS URL) with the full detailed transaction information once the payment process has ended (whether the customer cancels, paid, or failed to pay). It does not depend on the customer's actions; the response will be sent anyway. Type Validation Rules Required String Valid URL ✘
Description	This is the sixth parameter of the createPaymentPage() function, which manage and pass the return and the callback URLs
Description	can be empty array.
Default	-
Required	✘
Example	let url = { callback:"https://domain.com/api/callback", response:"https://domain.com/response/order/"+cart.id } let response_URLs = [ url.callback, url.response ];

---

Expected payment flow behaviour:

1. As a merchant you would initiate a payment request per the above Specifications, which include a sample code.


2. Then, after generating the payment page use the result to redirect the customer to the payment page.
   

   function callbackMethod(result) {
       //failed to create the payment page.
       if (result['response_code:'] === 400) {
            // get the message
            console.log(result['result']);
            // Next step
       }
       //success to create the payment page.
       else {
           //On success, redirect the customer to complete the payment.
           console.log(result.redirect_url);
           // Next step
       };
   }
   
   PayTabs.createPaymentPage(
       paymentMethods,
       transaction_details,
       cart_details,
       customer_details,
       shipping_address,
       response_URLs,
       lang,
       callbackMethod,
       frameMode
   );


3. After this, your customer would proceed normally with payment by choosing the preferred payment method (if available), and providing his card information.
   
   


4. Then, he will be redirected to his issuer bank 3DS/OTP page to authenticate the used card


5. Finally, he would be redirect to a success/error page accordingly. By this time, you will be able to see his transaction on your merchant dashboard, whether it's accepted/authorized or not.