Liste der Karten in Issuing

„Liste der Issuing-Karten“ zeigt eine Tabellenansicht aller Karten an, die an Ihre verbundenen Konten ausgestellt wurden.

Die Berechtigungsgrenze für diese Komponente liegt auf der Ebene des verbundenen Kontos, nicht auf der individuellen card Ebene. Diese Nutzeroberfläche sollte Nutzern/Nutzerinnen angezeigt werden, die Zugriff auf alle cards haben, nicht Nutzern/Nutzerinnen, die eigenschränkten Zugriff auf ein einzelnes card haben.

Aktivieren Sie beim Erstellen einer Kontositzung die Komponente Kartenliste in Issuing, indem Sie issuing_cards_list im Parameter components angeben. Sie können einzelne Funktionen der Komponente Kartenliste in Issuing aktivieren oder deaktivieren, indem Sie den Parameter features unter issuing_cards_list angeben.

curl https://api.stripe.com/v1/account_sessions \
  -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:" \
  -d account=
{{CONNECTED_ACCOUNT_ID}} \
  -d "components[issuing_cards_list][enabled]"=true \
  -d "components[issuing_cards_list][features][card_management]"=true \
  -d "components[issuing_cards_list][features][cardholder_management]"=true \
  -d "components[issuing_cards_list][features][card_spend_dispute_management]"=true \
  -d "components[issuing_cards_list][features][spend_control_management]"=true

Nachdem die Kontositzung erstellt und ConnectJS initiiert wurde, können Sie die Komponente „Kartenliste in Issuing“ im Frontend anzeigen:

// Include this element in your HTML
const issuingCardsList = stripeConnectInstance.create('issuing-cards-list');
issuingCardsList.setShowSpendControls(true);
container.appendChild(issuingCardsList);

Stripe-Nutzerauthentifizierung deaktivieren

Verwenden Sie die Funktion disable_stripe_user_authentication, um zu steuern, ob für die Komponente eine Nutzerauthentifizierung durch Stripe erforderlich ist. Standardmäßig ist dieser Parameter „false“. Dieser Wert kann nur wahr sein für Konten, bei denen controller.requirement_collection gleich application ist.

Wir empfehlen die Implementierung von 2FA oder gleichwertigen Sicherheitsmaßnahmen als Best Practice. Bei Kontokonfigurationen, die diese Funktion unterstützen, wie z. B. Custom-Konten, übernehmen Sie die Haftung für verbundene Konten, wenn diese Negativsalden nicht zurückzahlen können.

Ausgabenkontrollen festlegen

Sie können die eingebetteten Connect-Komponenten von Issuing verwenden, um die Ausgabenkontrollen für Ihre Karten anzuzeigen und optional zu bearbeiten, indem Sie das Attribut showSpendControls der Issuing-Komponente aktivieren.

const issuingCardsList = stripeConnectInstance.create('issuing-cards-list');
issuingCardsList.setShowSpendControls(true);
document.body.appendChild(issuingCardsList);

Um die Bearbeitung der Ausgabenkontrollen in der Komponente zu ermöglichen, übergeben Sie spend_control_management: true als Funktion, wenn Sie eine AccountSession erstellen.

curl https://api.stripe.com/v1/account_sessions \
  -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:" \
  -d account=
{{CONNECTED_ACCOUNT_ID}} \
  -d "components[issuing_cards_list][enabled]"=true \
  -d "components[issuing_cards_list][features][spend_control_management]"=true

Anzeige sensibler Daten

Die eingebetteten Komponenten von Issuing Connect können in Issuing Elements integriert werden. Dadurch können Ihre Administratoren auf PCI-konforme Weise Kartennummern (PANs) und Prüfziffern/CVVs oder CVCs für virtuelle Karten anzeigen. Die sensiblen Daten werden in von Stripe gehosteten iFrames angezeigt und gelangen nicht auf Ihre Server.

Die Komponenten können einen temporären Schlüssel verwenden, um Karteninformationen sicher von der Stripe API abzurufen, ohne Ihre geheimen Schlüssel öffentlich anzuzeigen

Um diese Funktionalität zu aktivieren, müssen Sie:

1. Richten Sie einen Austausch für temporäre Schlüssel auf Ihrem Server ein.
2. Einen asynchronen Rückruf an die Komponenten übergeben.

Stripe generiert eine nonce aus der Karten-ID in der Komponente „Issuing-Karte“ oder „Liste der Issuing-Karten“, wenn eine Karte ausgewählt oder geladen wird. Stripe ruft dann Ihre Rückruf-Funktion auf, die einen temporären Schlüssel zurückgibt und die Schaltfläche Show numbers anzeigt, wenn der temporäre Schlüssel gültig ist.

Austausch der temporären Schlüssel

Ihr serverseitiger Endpoint muss eine Karten-ID und eine nonce akzeptieren. Der Endpoint kann dann über Stripe einen temporären Schlüssel erstellen.

So können Sie einen Endpoint zur Erstellung temporärer Schlüssel in den Frameworks der Webanwendung in verschiedenen Sprachen implementieren:

// This example sets up an endpoint using the Express framework.

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-05-28.basil',
    stripeAccount: '{{CONNECTED_ACCOUNT_ID}}',
  });

  response.json({
    ephemeralKeySecret: ephemeralKey.secret,
    nonce: nonce,
    issuingCard: card_id,
  });
});

Asynchroner Rückruf

Sie müssen eine asynchrone Funktion definieren, die ein benanntes Argument mit der Eigenschaft issuingCard, d. h. eine Karten-ID, und zusätzlich eine nonce-Eigenschaft akzeptiert. Diese Funktion muss ein Object mit den Eigenschaften issuingCard, nonce und ephemeralKeySecret zurückgeben. Diese werden von dem Endpoint abgerufen, den Sie im vorherigen Schritt eingerichtet haben.

So implementieren Sie einen Rückruf:

const issuingCard = stripeConnectInstance.create('issuing-card');
const fetchEphemeralKey = async (fetchParams) =>  {
  const { issuingCard, nonce } = fetchParams;

  // This may vary greatly based on your implementation
  const response = await myServer.getEphemeralKey({issuingCard, nonce})

  return {
    issuingCard: response.issuingCard,
    nonce: response.nonce,
    ephemeralKeySecret: response.ephemeralKeySecret
  }
}

issuingCard.setFetchEphemeralKey(fetchEphemeralKey);
document.body.appendChild(issuingCard);