Ask Moov Beta
Generative AI is experimental and can make mistakes.
Guides Dashboard Use cases API Changelog
  1. Moov.js
  2. Moov Drops

Issued card UI

The issued card Drop enables Moov customers to display a previously issued virtual card within a secure, Moov-hosted iframe.

With the moov-issued-card element, issued card information is displayed to the user and rendered directly by Moov. The issued card Drop interacts directly with the retrieve a spending cardGET endpoint using JWTs to securely send data between your end user’s browser and Moov. All information is displayed through an iframe and protected from programmatic access.

Note: To use the issued card drop, Moov support must first enable the issued-cards.read-secure scope for your account. 
1

<moov-issued-card></moov-issued-card>

Visit our Drops 101 guide to learn the basics of properties, attributes, and initializing Drops. Note that the use of the issued card Drop requires a secure HTTPS connection.

Moov Drops require a secure HTTPS connection. If you don’t have a test environment with HTTPS enabled, we suggest setting up a hosting environment with ngrok, Netlify, or Vercel.

Properties

Properties can be accessed through JavaScript using a reference to the moov-issued-card element.

Property Type Description
oauthToken String Auth Token used for hitting the API. Token must include the accounts/{accountID}/issued-cards.read and accounts/{accountID}/issued-cards.read-secure scopes.
accountID String ID of the Moov account to which the card was issued.
issuedCardID String ID of the issued card to display.

How to set a property 

1
2

const issuedCard = document.querySelector('moov-issued-card');
issuedCard.oauthToken = 'eyjh...';

1
2

const issuedCard = document.querySelector('moov-issued-card');
issuedCard.accountID = "abc123-x...";

Attributes

String-type properties can be set via attributes on the HTML <moov-issued-card> element.

Attribute Description
oauth-token Auth Token used for hitting the API. Token must include the accounts/{accountID}/issued-cards.read and accounts/{accountID}/issued-cards.read-secure scopes.
account-id ID of the Moov account to which the card was issued.
issued-card-id ID of the issued card to display.

Scopes

To display an issued card, your Moov API token must include the following scopes:

  • accounts/{accountID}/issued-cards.read
  • accounts/{accountID}/issued-cards.read-secure*

*The issued-cards.read-secure scope must be enabled by Moov support. If you’re looking to use the issued card Drop but haven’t had this scope enabled by a member of our team yet, contact support.

Theming

Read our themes guide to learn how to re-style Moov Drops.

Summary Beta