Before beginning the integration process, ensure that you have the following:
- AMWAL Merchant Account: You need to have an active merchant account with AMWAL Payment Gateway. If you do not have one, please contact AMWAL’s support team using support@amwal-pay.com
- API Credentials: You will be provided with the credentials that include your Merchant ID, API Key, and any other information required to generate the secure hash.
- Access to Smartbox.js: The Smartbox.js file should be included or linked in your web application to initialize the AMWAL Checkout Page. Production: https://checkout.amwalpg.com/js/SmartBox.js?v=1.1 SIT environment: https://test.amwalpg.com:19443/js/SmartBox.js?v=1.1 UAT environment: https://test.amwalpg.com:7443/js/SmartBox.js?v=1.1
SSL Certificate: Your website must be hosted over HTTPS to ensure secure communication between your site and the payment gateway.
Integration #
The integration process consists of embedding the Smartbox.js file, configuring the required parameters, and ensuring secure communication between your website and AMWAL Payment Gateway using a secure hash. The following steps will guide you through the process:
Include Smartbox.js in Your Website
The first step is to include the Smartbox.js file in your website’s HTML file. You can do this by adding the following line of code within your or just before the closing tag:
<script src="path-to-your-js-folder/Smartbox.js"></script>
Make sure the file path is correct based on your project structure, it is better to link to the published Smartbox.js mainly for production to keep your web site updated with the new updates that may happen on the JS file in the future.
Configure Payment Settings
You will need to configure the necessary parameters to initialize the payment gateway. These configurations include details such as the amount to be paid, the currency, and the merchant information
Below is an example configuration that you can modify based on your specific business needs:
SmartBox.Checkout.configure = {
MID: /*your merchant Id*/,
TID: /*Your Terminal Id*/,
CurrencyId: /*only 512 is supported*/,
AmountTrxn: /*Amount to be paid*/,
MerchantReference: /*Merchant Reference code if exists*/,
LanguageId: /*display language either 'ar' for Arabic or 'en' English
*/,
PaymentViewType: /*either 1 for Popup or 2 for Full Screen*/,
TrxDateTime: /*transaction date time*/,
SessionToken: /* if the merchant is enabled for recurring payment, he can
request a session token from an API (Check Merchant API Integration Doc):
You can check this section for further info Get Smartbox Session Token */
SecureHash: /*secure hash value for all the configuration above,
you can check this section for further info Calculate Secure Hash */,
completeCallback: function (data) {
console.log("completeCallback Received Data", data);
},
errorCallback: function (data) {
console.log("errorCallback Received Data", data);
},
cancelCallback: function () {
console.log("cancelCallback Received Data", data);
},
}
Make sure to replace the placeholder values (your_merchant_id, order12345, etc.) with the actual values specific to your website and order.