Documentation Index
Fetch the complete documentation index at: https://docs.caibo.digital/llms.txt
Use this file to discover all available pages before exploring further.
Overview
This example demonstrates a complete credit card payment request including all required fields and browser information for 3D Secure verification.
Payment Request
{
"name": "Test User",
"number": "4111111111111111",
"expiration": "10/25",
"cvv": "123",
"email": "test.user@email.com",
"phoneNumber": "1234567890",
"address": "10 Unknown Street",
"city": "Far Town",
"state": "NA",
"postalCode": "123456",
"country": "US",
"amount": 10.50,
"unit": "USD",
"originDomain": "example.com",
"referenceId": "123-GA-456",
"notifyUrl": "https://notify.me",
"successUrl": "https://success.payment.com",
"failureUrl": "http://fail.payment.com",
"browserInfo": {
"browserAcceptHeader": "application/json, text/plain, */*",
"browserColorDepth": "24",
"browserIP": "127.0.0.1",
"browserJavaEnabled": false,
"browserJavascriptEnabled": true,
"browserLanguage": "en-US",
"browserScreenHeight": "1080",
"browserScreenWidth": "1920",
"browserTZ": "300",
"browserUserAgent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36"
}
}
Key Features
- Test Card: Visa test card number (4111111111111111)
- Expiration: MM/YY format (10/25)
- CVV: 3-digit security code (123)
- Cardholder: Test User name
Customer Details
- Contact Info: Email and phone number for notifications
- Billing Address: Complete address for verification
- Country Code: ISO 2-letter country code (US)
Transaction Details
- Amount: $10.50 USD
- Reference: Custom merchant reference (123-GA-456)
- URLs: Notification, success, and failure callback URLs
The browserInfo object contains essential data for 3D Secure authentication:
| Field | Value | Purpose |
|---|
browserAcceptHeader | application/json, text/plain, */* | Browser accept header |
browserColorDepth | 24 | Screen color depth |
browserIP | 127.0.0.1 | Customer’s IP address |
browserJavaEnabled | false | Java support status |
browserJavascriptEnabled | true | JavaScript support status |
browserLanguage | en-US | Browser language setting |
browserScreenHeight | 1080 | Screen height in pixels |
browserScreenWidth | 1920 | Screen width in pixels |
browserTZ | 300 | Timezone offset in minutes |
browserUserAgent | Chrome 126 string | Full browser user agent |
Implementation
JavaScript Example
const creditCardPayment = {
name: "Test User",
number: "4111111111111111",
expiration: "10/25",
cvv: "123",
email: "test.user@email.com",
phoneNumber: "1234567890",
address: "10 Unknown Street",
city: "Far Town",
state: "NA",
postalCode: "123456",
country: "US",
amount: 10.50,
unit: "USD",
originDomain: "example.com",
referenceId: "123-GA-456",
notifyUrl: "https://notify.me",
successUrl: "https://success.payment.com",
failureUrl: "http://fail.payment.com",
browserInfo: {
browserAcceptHeader: navigator.userAgent,
browserColorDepth: screen.colorDepth.toString(),
browserIP: "127.0.0.1", // Get from server
browserJavaEnabled: navigator.javaEnabled(),
browserJavascriptEnabled: true,
browserLanguage: navigator.language,
browserScreenHeight: screen.height.toString(),
browserScreenWidth: screen.width.toString(),
browserTZ: new Date().getTimezoneOffset().toString(),
browserUserAgent: navigator.userAgent
}
};
// Send payment request
const response = await fetch('https://your-h2h-endpoint.com', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'X-API-Key': 'your-api-key'
},
body: JSON.stringify(creditCardPayment)
});
Collecting Browser Info
function collectBrowserInfo() {
return {
browserAcceptHeader: document.querySelector('meta[http-equiv="Accept"]')?.content || "*/*",
browserColorDepth: screen.colorDepth.toString(),
browserIP: "127.0.0.1", // Must be collected server-side
browserJavaEnabled: navigator.javaEnabled ? navigator.javaEnabled() : false,
browserJavascriptEnabled: true,
browserLanguage: navigator.language || navigator.userLanguage,
browserScreenHeight: screen.height.toString(),
browserScreenWidth: screen.width.toString(),
browserTZ: new Date().getTimezoneOffset().toString(),
browserUserAgent: navigator.userAgent
};
}
Security Considerations
PCI DSS Compliance
- Never log or store complete card numbers
- Use HTTPS for all communications
- Implement proper input validation
- Follow PCI DSS requirements for card data handling
3D Secure Authentication
- Browser info is crucial for 3DS verification
- Collect accurate browser fingerprinting data
- Handle 3DS challenge flows properly
- Test with different browsers and devices
Testing
Test Cards
- Visa: 4111111111111111
- Mastercard: 5555555555554444
- American Express: 378282246310005
Test Scenarios
- Successful Payment: Use test card with valid data
- Declined Payment: Use declined test card numbers
- 3DS Challenge: Test 3D Secure authentication flow
- Invalid Data: Test validation error handling
Next Steps
After implementing credit card payments:
- Test with different card types and scenarios
- Implement proper error handling
- Set up webhook notifications
- Add payment status checking
- Consider implementing digital wallets