Thawani ECommerce API

https://docs.thawani.om/
Admin
Thawani ECommerce API is a payment gateway that enables merchants to collect payments from their...
Tokens:2,864
Snippets:32
Trust Score:8.5
Update:4 months ago
Show doc for...
Tokens:
Raw
### Configure WebView in Native Android Activity

Source: https://docs.thawani.om

Enable JavaScript, DOM Storage, and the Payment Request API in your WebView settings. Set a WebViewClient to handle navigation and load your checkout URL.

```kotlin
val settings = webView.settings


settings.javaScriptEnabled = true
settings.domStorageEnabled = true


if (WebViewFeature.isFeatureSupported(WebViewFeature.PAYMENT_REQUEST)) {
    WebSettingsCompat.setPaymentRequestEnabled(settings, true)
}


webView.webViewClient = WebViewClient()
webView.loadUrl("https://your-checkout-url")
```

--------------------------------

### Payment Initialized Webhook Sample

Source: https://docs.thawani.om

This JSON represents the payload received when a payment is initialized and in progress. It includes payment details, masked card information, and status.

```json
{
  "data": {
    "activity": "Car Washing",
    "payment_id": "123456",
    "masked_card": "4242 42XX XXXX 4242",
    "card_type": "Debit",
    "status": "InProccess",
    "reason": null,
    "amount": 100,
    "fee": 0,
    "refunded": false,
    "refunds": null,
    "checkout_invoice": "123456",
    "created_at": "2024-11-19T09:27:14.179289Z"
  },
  "event_type": "payment.pending"
}
```

--------------------------------

### Navigate to Payment Page in Flutter

Source: https://docs.thawani.om

Use Navigator.push to direct the user to the payment WebView page, passing the checkout URL with session ID and public key.

```dart
Navigator.push(
  context,
  MaterialPageRoute(
    builder: (context) => PaymentWebViewPage(url: 'https://uatcheckout.thawani.om/pay/<session_id>?key=<public_key>'),
  ),
);
```

--------------------------------

### Checkout Session Created Webhook Sample

Source: https://docs.thawani.om

This JSON represents the payload received when a checkout session is created. It includes details about the session, customer, products, and payment status.

```json
{
  "data": {
    "session_id": "checkout_randomsessionidgoeshere",
    "client_reference_id": "123412",
    "customer": null,
    "card": null,
    "invoice": "123456",
    "products": [
      {
        "name": "product 1",
        "unit_amount": 100,
        "quantity": 1
      }
    ],
    "total_amount": 100,
    "currency": "OMR",
    "payment_status": "unpaid",
    "save_card_on_success": false,
    "metadata": {
      "Customer name": "somename",
      "order id": "0"
    },
    "created_at": "2024-11-19T09:26:40.7131505Z",
    "expire_at": "2024-11-20T09:26:40.6107875Z"
  },
  "event_type": "checkout.created"
}
```

--------------------------------

### Add WebView Dependency for Native Android

Source: https://docs.thawani.om

Add the webkit dependency to your app/build.gradle.kts file to include the necessary WebView components for Android.

```kotlin
dependencies {
    implementation("androidx.webkit:webkit:1.14.0")
}


android {
    defaultConfig { minSdk = 26 }
    compileOptions {
        sourceCompatibility = JavaVersion.VERSION_11
        targetCompatibility = JavaVersion.VERSION_11
    }
    kotlinOptions { jvmTarget = "11" }
}
```

--------------------------------

### Configure WebView and Enable Google Pay in Flutter

Source: https://docs.thawani.om

Configure the WebViewController to enable JavaScript and the Payment Request API for Android. This allows the WebView to interact with Google Pay.

```dart
_controller = WebViewController()
  ..setJavaScriptMode(JavaScriptMode.unrestricted);


if (platformController is AndroidWebViewController) {
  final supported = await androidController.isWebViewFeatureSupported(
    WebViewFeatureType.paymentRequest,
  );
  if (supported) {
    await androidController.setPaymentRequestEnabled(true);
  }
}


_controller.loadRequest(Uri.parse('https://your-checkout-url'));
```

--------------------------------

### Payment Failed Webhook Sample

Source: https://docs.thawani.om

This JSON represents the payload received when a payment fails. It includes the 'Failed' status, masked card details, and the reason for failure if available.

```json
{
  "data": {
    "activity": "Car Washing",
    "payment_id": "123456",
    "masked_card": "4000 00XX XXXX 0002",
    "card_type": "Debit",
    "status": "Failed",
    "reason": null,
    "amount": 100,
    "fee": 0,
    "refunded": false,
    "refunds": null,
    "checkout_invoice": "123456",
    "created_at": "2024-11-19T09:30:26.6758281Z"
  },
  "event_type": "payment.failed"
}
```

--------------------------------

### Checkout Session Completed Webhook Sample

Source: https://docs.thawani.om

This JSON represents the payload received when a checkout session is successfully completed. It indicates a 'paid' payment status and includes session details.

```json
{
  "data": {
    "session_id": "checkout_randomsessionidgoeshere",
    "client_reference_id": "123412",
    "customer": null,
    "card": null,
    "invoice": "123456",
    "products": [
      {
        "name": "product 1",
        "unit_amount": 100,
        "quantity": 1
      }
    ],
    "total_amount": 100,
    "currency": "OMR",
    "payment_status": "paid",
    "save_card_on_success": false,
    "metadata": {
      "Customer name": "somename",
      "order id": "0"
    },
    "created_at": "2024-11-19T09:26:40.7131505",
    "expire_at": "2024-11-20T09:26:40.6107875"
  },
  "event_type": "checkout.completed"
}
```

--------------------------------

### Payment Completed Webhook Sample

Source: https://docs.thawani.om

This JSON represents the payload received when a payment is successfully completed. It indicates a 'Successful' status and includes payment and transaction details.

```json
{
  "data": {
    "activity": "Car Washing",
    "payment_id": "123456",
    "masked_card": "4242 42XX XXXX 4242",
    "card_type": "Debit",
    "status": "Successful",
    "reason": null,
    "amount": 100,
    "fee": 0,
    "refunded": false,
    "refunds": null,
    "checkout_invoice": "123456",
    "created_at": "2024-11-19T09:27:14.179289"
  },
  "event_type": "payment.succeeded"
}
```

--------------------------------

### Add WebView Dependency for Flutter

Source: https://docs.thawani.om

Add the webview_flutter dependency to your pubspec.yaml file to enable web view functionality in your Flutter application.

```yaml
dependencies:
  webview_flutter: ^4.13.0
```

--------------------------------

### Update AndroidManifest.xml for Google Pay

Source: https://docs.thawani.om

Declare necessary permissions and query intents in your AndroidManifest.xml to allow your app to communicate with Google Pay services.

```xml
<uses-permission android:name="android.permission.INTERNET"/>


<!-- Required for Android 11+ to communicate with Google Pay -->
<queries>
    <intent><action android:name="org.chromium.intent.action.PAY" /></intent>
    <intent><action android:name="org.chromium.intent.action.IS_READY_TO_PAY" /></intent>
    <intent><action android:name="org.chromium.intent.action.UPDATE_PAYMENT_DETAILS" /></intent>
</queries>
```

--------------------------------

### Webhook Signature Verification

Source: https://docs.thawani.om

This Node.js function calculates the HMAC-SHA256 signature for webhook verification. It requires the request body, the timestamp from the header, and your webhook secret key. Ensure the body and timestamp are concatenated with a hyphen before hashing.

```javascript
//These values are returned as part of header in webhook
thawani-timestamp = 1733807121;
thawani-signature = aa454c8f8170145b78f2747763f38aec44c91d1bb455558fdf78d76bde920747;




function getHmacSignature(body, key) {
    const crypto = require('crypto');


    const textBytes = Buffer.from(body, 'ascii'); // or 'utf8' if needed
    const keyBytes = Buffer.from(key, 'ascii'); // or 'utf8' if needed


    const hmac = crypto.createHmac('sha256', keyBytes);


    hmac.update(textBytes);


    return hmac.digest('hex');
}


// Example usage
const body = 'example_body_text';
const key = 'example_secret_key'; //The webhook secret key set at portal.
const signature = getHmacSignature(body + '-' + thawani-timestamp, key);
console.log('HMAC Signature:', signature);

```
Tokens:
Raw