Skip to main content
This page is part of Supported Payment Methods. View all payment methods →
CardPay displays a secure card entry form where customers enter their card details. The form handles validation, formatting, and card brand detection automatically.

Availability

CardPay is available on all browsers and devices. It appears in checkAvailability() results when properly configured.
PlatformAvailability
Desktop browsersYes
Mobile browsersYes
iOS appsYes
Android appsYes

Requirements

CardPay requires:
// Server-side session creation
const session = {
  operation: 'CHARGE',
  paymentGatewayAccountId: 'your-psp-account',
  allowedeWalletAccountIds: ['your-cardpay-account'],
  allowedBrands: ['VISA', 'MASTERCARD', 'AMEX'],
  amount: 25.00,
  currencyCode: 'USD',
  countryCode: 'US',
  mode: 'LIVE'
};

Button Setup

<div id="card-button"></div>
engine.payBy(
  [{ name: 'CardPay', domEntitySelector: '#card-button' }],
  handleResult,
  { color: 'Dark', text: 'Pay' }
);

How It Works

  1. Customer clicks the CardPay button
  2. A secure popup window opens with the card entry form
  3. Customer enters card number, expiry, CVV, and name
  4. The form validates input in real-time
  5. If 3D Secure is required, the authentication flow is handled automatically with no additional code required
  6. Orchestra processes the payment through your PSP
  7. On completion, the popup closes and results are returned to the client, ready to be sent to your server for validation

Supported Operations

OperationSupportedDescription
CHARGEYesProcess payment immediately
TOKENIZEYesStore card for future use
CHARGE_AND_TOKENIZEYesProcess payment and store card

3D Secure

3D Secure is triggered when:
  • Your CardPay eWallet account is configured to require 3DS, AND
  • Your PSP integration in Orchestra supports passing 3DS data (see supported 3DS integrations)
When both conditions are met, the library handles the entire 3DS challenge flow automatically with no additional code required. See 3D Secure for more details.