Issuing カード
個人に発行されたカードを表示します。 Issuing カードは、連結アカウントに対して発行された個別の card (カード)
このコンポーネントに対するアクセス許可の境界は連結アカウントレベルであり、個々のcardレベルではありません。この UI は、単一のcardにアクセスが制限されているユーザーではなく、すべてのcardsにアクセスできるユーザーに表示する必要があります。
アカウントセッションを作成する components パラメーターの issuing_ を指定して、 Issuingカードのコンポーネントを有効にします。
curl https://api.stripe.com/v1/account_sessions \
-u "sk_test_BQokikJOvBiI2HlWgH4olfQ2
\
-d account = "{{CONNECTED_ACCOUNT_ID}}"
\
-d "components[issuing_card][enabled]" = true \
-d "components[issuing_card][features][card_management]" = true \
-d "components[issuing_card][features][cardholder_management]" = true \
-d "components[issuing_card][features][card_spend_dispute_management]" = true \
-d "components[issuing_card][features][spend_control_management]" = true アカウントセッションを作成して ConnectJS を初期化
const issuingCard = stripeConnectInstance . create ( 'issuing-card' ) ;
issuingCard . setDefaultCard ( '{{ISSUING_CARD_ID_ID' ) ;
issuingCard . setShowSpendControls ( true ) ;
container . appendChild ( issuingCard ) ;
この埋め込みコンポーネントは、次の属性に対応します。
Setter タイプ 説明 setDefaultCard(string) => void初回の読み込み時に表示する Issuing Card setCardSwitching(boolean) => voidカードのドロップダウンセレクターを表示するかどうかを設定します。デフォルトは true です。 setFetchEphemeralKey(function) => voidカードの一時キーを取得するコールバックを設定します。機密データの表示
支出管理を設定する Issuing Connect の埋め込みコンポーネントを使用して Issuing コンポーネントの showSpendControls 属性をオンにすることで、カードの支出管理
const issuingCard = stripeConnectInstance . create ( 'issuing-card' ) ;
issuingCard . setShowSpendControls ( true ) ;
document . body . appendChild ( issuingCard ) ;
コンポーネントで支出管理の編集を有効にするには、AccountSession の作成 spend_ を機能として渡します。
curl https://api.stripe.com/v1/account_sessions \
-u "sk_test_BQokikJOvBiI2HlWgH4olfQ2
\
-d account = "{{CONNECTED_ACCOUNT_ID}}"
\
-d "components[issuing_card][enabled]" = true \
-d "components[issuing_card][features][spend_control_management]" = true 機密データの表示 Issuing Connect の埋め込み型コンポーネントは Issuing Elements
コンポーネントでは、シークレットキーを公開することなく、一時キーを使用して Stripe API からカード情報を安全に取得できます。
この機能を有効にするには、以下を行う必要があります。
サーバーで一時キー交換を設定します。 非同期コールバックをコンポーネントに渡します。 Stripe は、カードが選択または読み込まれると、Issuing カードまたは Issuing カードのリストコンポーネントの Card ID nonce を生成します。その後、Stripe は、一時キーを返すコールバック関数を呼び出し、一時キーが有効である場合は Show numbers ボタンを表示します。
一時キー交換 サーバー側のエンドポイントは、Card ID nonce を受け入れる必要があります。その後、Stripe を使用して一時キーを作成できます。
さまざまな言語のウェブアプリケーションフレームワークに一時キー作成エンドポイントを実装する方法を以下に示します。
const express = require ( 'express' ) ;
const bodyParser = require ( 'body-parser' ) ;
const app = express ( ) ;
app . use ( bodyParser . urlencoded ( { extended : true } ) ) ;
const stripe = require ( 'stripe' ) ( 'sk_test_BQokikJOvBiI2HlWgH4olfQ2'
) ;
app . post ( '/ephemeral-keys' , async ( request , response ) => {
const { card_id , nonce } = request . body ;
const ephemeralKey = await stripe . ephemeralKeys . create ( {
nonce : nonce ,
issuing_card : card_id ,
} , {
apiVersion : '2025-10-29.clover' ,
stripeAccount : '{{CONNECTED_ACCOUNT_ID}}' ,
} ) ;
response . json ( {
ephemeralKeySecret : ephemeralKey . secret ,
nonce : nonce ,
issuingCard : card_id ,
} ) ;
} ) ; 非同期コールバック プロパティ issuingCard (Card nonce プロパティを持つ、名前付き引数を受け入れる非同期関数を定義する必要があります。この関数は、前のステップで設定したエンドポイントから取得したプロパティ issuingCard、nonce、ephemeralKeySecret を持つ Object を返す必要があります。
以下は、このコールバックを実装する方法です。
const issuingCard = stripeConnectInstance . create ( 'issuing-card' ) ;
const fetchEphemeralKey = async ( fetchParams ) => {
const { issuingCard , nonce } = fetchParams ;
const response = await myServer . getEphemeralKey ( { issuingCard , nonce } )
return {
issuingCard : response . issuingCard ,
nonce : response . nonce ,
ephemeralKeySecret : response . ephemeralKeySecret
}
}
issuingCard . setFetchEphemeralKey ( fetchEphemeralKey ) ;
document . body . appendChild ( issuingCard ) ;