Skip to main content
Mode: card_connect
Opal Card Connect is the primary way to connect user credit cards with Method. This pre-built flow gathers a user’s consent, verifies their identity, and completes any needed verifications to ensure their cards are connected to the Method ecosystem. account-verification-hero

​
What this mode does

Card Connect lets users select and verify credit cards. Configure whether users may select a single card or multiple cards. Verified cards are eligible for payments and transactions.

​
Parameters

​
Create a token

You can create a card connect session token using one of the supported patterns:
  • Existing entity: provide entity_id + mode + card_connect
  • Create new entity: provide entity + mode + card_connect
  • Resume session: provide session_id only (omit mode and card_connect)

​
Existing Entity

{
  "entity_id": "ent_...",
  "mode": "card_connect",
  "card_connect": {
    "selection_type": "single",
    "account_filters": {
      "exclude": {
        "mch_ids": ["mch_123"],
        "unverified_account_numbers": true
      }
    }
  }
}

​
Create New Entity

{
  "entity": {
    "type": "individual",
    "individual": {
      "first_name": "Kevin",
      "last_name": "Doyle",
      "phone": "+15125551234"
    }
  },
  "mode": "card_connect",
  "card_connect": {
    "selection_type": "multiple"
  }
}

​
Response

{
  "token": "otkn_...",
  "valid_until": "2025-06-10T22:50:53.024Z",
  "session_id": "osess_..."
}

​
Testing in Development

When testing the frontend for Card Connect in the dev environment, use the following test values:
  • Verification code: When the modal prompts you to enter a six-digit verification code, you can use any six-digit code. For example: 123456. This applies to any test case (e.g. identity verification, connect, etc.).
  • Card verification: Select the Chase card ending in 1580 and use 878 as the CVV.

​
Launch Opal

import { OpalProvider, useOpal } from "@methodfi/opal-react";

function Screen() {
  const { open } = useOpal({ env: "dev", onEvent: (e) => {} });
  const start = async () => {
    const { token } = await getTokenFromBackend();
    open({ token });
  };
  return <button onClick={start}>Connect Card</button>;
}