# Liste der Karten in Issuing

Zeigt eine Tabelle mit allen ausgestellten Karten an.

„Liste der Issuing-Karten“ zeigt eine Tabellenansicht aller [Karten](https://docs.stripe.com/api/issuing/cards.md) an, die an Ihre verbundenen Konten ausgestellt wurden.

Note: The following is a preview/demo component that behaves differently than live mode usage with real connected accounts. The actual component has more functionality than what might appear in this demo component. For example, for connected accounts without Stripe dashboard access (custom accounts), no user authentication is required in production.

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](https://docs.stripe.com/api/account_sessions/create.md) 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
curl https://api.stripe.com/v1/account_sessions \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d "account={{CONNECTEDACCOUNT_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](https://docs.stripe.com/connect/get-started-connect-embedded-components.md#account-sessions), können Sie die Komponente „Kartenliste in Issuing“ im Frontend anzeigen:

#### JavaScript

```js
// 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](https://docs.stripe.com/api/account_sessions/create.md#create_account_session-components-issuing_cards_list-features-disable_stripe_user_authentication), um zu steuern, ob die Komponente eine Stripe-Nutzerauthentifizierung erfordert.

Standardmäßig ist dieser Parameter „false“.

Dieser Wert kann nur für Konten gelten, bei denen `controller.requirement_collection` `application` ist.

Wir empfehlen die Implementierung von 2FA oder gleichwertigen Sicherheitsmaßnahmen als [Best Practice](https://docs.stripe.com/connect/risk-management/best-practices.md#prevent-account-take-overs). Bei Kontokonfigurationen, die diese Funktion unterstützen, wie z. B. Custom-Konten, übernehmen Sie die Haftung für verbundene Konten, wenn diese [Negativsalden](https://docs.stripe.com/connect/risk-management/best-practices.md#decide-your-approach-to-negative-balance-liability) nicht zurückzahlen können.

## Ausgabenkontrollen festlegen

Sie können die eingebetteten Connect-Komponenten von Issuing verwenden, um die [Ausgabenkontrollen](https://docs.stripe.com/issuing/controls/spending-controls.md) für Ihre Karten anzuzeigen und optional zu bearbeiten, indem Sie das Attribut `showSpendControls` der Issuing-Komponente aktivieren.

#### JavaScript

```js
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](https://docs.stripe.com/connect/connect-embedded-components/quickstart.md#server-endpoint).

```curl
curl https://api.stripe.com/v1/account_sessions \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d "account={{CONNECTEDACCOUNT_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](https://docs.stripe.com/issuing/elements.md) 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.
1. Einen asynchronen Rückruf an die Komponenten übergeben.

Stripe generiert eine `nonce` aus der [Karten-ID](https://docs.stripe.com/api/issuing/cards/object.md#issuing_card_object-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](https://docs.stripe.com/api/issuing/cards/object.md#issuing_card_object-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:

#### Node.js

```javascript
// 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 }));

// Don't put any keys in code. See https://docs.stripe.com/keys-best-practices.
const stripe = require('stripe')('<<YOUR_SECRET_KEY>>');

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: '2026-04-22.dahlia',
    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.&nbsp;h. eine [Karten](https://docs.stripe.com/api/issuing/cards/object.md#issuing_card_object-id)-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:

#### JavaScript

```js
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);
```