Weiter zum Inhalt
Konto erstellen oder anmelden
Das Logo der Stripe-Dokumentation
/
KI fragen
Konto erstellenAnmelden
Jetzt starten
Zahlungen
Umsatz
Plattformen und Marktplätze
Geldmanagement
Entwicklerressourcen
APIs und SDKsHilfe
ÜbersichtZahlung annehmenAktualisieren Sie Ihre Integration
Online-Zahlungen
ÜbersichtIhren Use case finden
Payment Links verwenden
Vorgefertigte Checkout-Seite verwenden
Erstellen Sie eine benutzerdefinierte Integration mit Elements
In-App-Integration erstellen
Verwenden Sie Managed Payments
Wiederkehrende Zahlungen
Präsenzzahlungen
Terminal
Zahlungsmethoden
Zahlungsmethoden hinzufügen
Zahlungsmethoden verwalten
Schnellerer Bezahlvorgang mit Link
Zahlungsvorgänge
Analytik
Salden und Abwicklungsdauer
Compliance und Sicherheit
Währungen
Abgelehnte Zahlungen
Anfechtungen
Betrugsprävention
Betrugsprävention von Radar
Auszahlungen
ZahlungsbelegeRückerstattungen und Stornierungen
Erweiterte Integrationen
Nutzerdefinierte Zahlungsabläufe
Flexibles Acquiring
Off-Session-Zahlungen
Multiprozessor-Orchestrierung
Mehr als Zahlungen
Unternehmensgründung
Krypto
Agentenbasierter Handel
    Übersicht
    Wichtige Konzepte
    Monetarisieren Sie Ihre MCP-App
      Zahlung annehmen
    Aktivieren Sie kontextbezogene Verkäufe auf KI-Agenten
Maschinelle Zahlungen
Financial Connections
Climate
Identitäten verifizieren
Vereinigte Staaten
Deutsch
StartseiteZahlungenAgentic commerceMonetize your MCP app

Zahlung akzeptieren

Zahlungen sicher akzeptieren mit Ihrer MCP-App.

Private Vorschau

  • Das Akzeptieren von Zahlungen in ChatGPT-Apps ist für von OpenAI zugelassene Unternehmen in den USA verfügbar.
  • Zahlungsmethoden, die in ChatGPT Instant Checkout unterstützt werden, sind Karten, Apple Pay, Google Pay und Link.

In diesem Leitfaden wird gezeigt, wie Sie mit Instant Checkout und Stripe eine Zahlung in Ihrer ChatGPT-App akzeptieren. Weitere Informationen zu diesem Framework finden Sie in der Dokumentation zu ChatGPT Instant Checkout.

Transaktionsdiagramm

Stripe-Profil erstellen und ChatGPT-App verbinden

Erstellen Sie ein Stripe-Profil und autorisieren Sie OpenAI, sich mit Ihrem Stripe-Konto zu verbinden. So kann ChatGPT auf sichere Weise ein Shared Payment Token (SPT) bereitstellen, das die Zahlungsdaten der Kundin/des Kunden darstellt.

  1. Erstellen Sie Ihr Stripe-Profil im Stripe-Dashboard.
  2. Akzeptieren Sie die allgemeinen Konditionen für Verkäufer/innen von Stripe und klicken Sie auf Autorisieren, um OpenAI zu aktivieren, um sich mit Ihrem Profil zu verbinden.
  3. Kopieren Sie Ihre Netzwerk-ID. Diese benötigen Sie, wenn Sie Checkout-Anfragen in Ihrer ChatGPT-App erstellen.

Stripe einrichten

Fügen Sie Ihrem Backend zunächst die Stripe-API-Bibliothek hinzu:

Command Line
Ruby
Python
PHP
Java
Node.js
Go
.NET
No results
# Available as a gem sudo gem install stripe
Gemfile
Ruby
Python
PHP
Java
Node.js
Go
.NET
No results
# If you use bundler, you can add this line to your Gemfile gem 'stripe'

Kauf-Widget mit Stripe erstellen

Richten Sie die Nutzeroberfläche für Ihre ChatGPT-App ein, indem Sie ein MCP-Tool und eine Nutzeroberfläche für Kaufprodukte erstellen. Dieser Ablauf:

  • Entnimmt ein Produkt aus dem Chat-Kontext.
  • Zeigt Produktinformationen an und erfasst die Versandadresse von der Kundin/dem Kunden.
  • Ruft window.openai.requestCheckout auf, wenn die Kundin/der Kunde bereit ist, fortzufahren.

Produkte und Preise erstellen

In diesem Beispiel können Sie einen Bezahlvorgang für ein Produkt in der ChatGPT-App anzeigen. Erfahren Sie, wie man Produkte und Preise im Dashboard oder mit der Stripe-CLI erstellt.

Hinweis

Wenn Sie Ihre eigene maßgeschneiderte Produktlogik haben, müssen Sie keine Stripe-Produkte erstellen. Ersetzen Sie stattdessen die Stripe Produkt-API-Aufrufe in den folgenden Abschnitten durch Ihre eigene Produktlogik.

Registrieren einer Produktressource und eines Produkttools in Ihrem MCP Server

Konfigurieren Sie ChatGPT so, dass Ihr Checkout-Widget gerendert wird, wenn Kundinnen und Kunden den Chat auffordern, ein bestimmtes Produkt zu kaufen.

server.js
import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js"; import { registerAppTool, registerAppResource, RESOURCE_MIME_TYPE, } from "@modelcontextprotocol/ext-apps/server"; import { readFileSync } from "node:fs"; import Stripe from "stripe"; import { z } from "zod"; const stripe = new Stripe(
"sk_test_BQokikJOvBiI2HlWgH4olfQ2"
) const server = new McpServer({ name: "my-mcp-server", version: "1.0.0" }); const resourceUri = "ui://widget/buy-product-template.html"; registerAppResource( server, "buy-product-widget", resourceUri, { title: "Buy Product", description: "Buy Product widget", mimeType: RESOURCE_MIME_TYPE, }, async () => { const html = readFileSync("dist/ui/buy-product.html", "utf8"); return { contents: [ { uri: resourceUri, mimeType: RESOURCE_MIME_TYPE, text: html, }, ], }; } ); registerAppTool( server, "show-buy-product-widget", { title: "Buy Product", description: "Kickstart a checkout flow for a specific product.", // Add inputs here to help you find the product id inputSchema: { product_name: z.string() }, _meta: { ui: { resourceUri } }, annotations: { readOnlyHint: true } }, async () => { // Add logic here to get product id from input schema const product = await stripe.products.retrieve('prod_123456'); const amount = (await stripe.prices.retrieve(product.default_price as string)).unit_amount; return { content: [], structuredContent: { productName: product.name, amount: amount, priceID: product.default_price, }, }; } );

Nutzeroberfläche des Kaufprodukts mit dem Apps SDK erstellen

Diese Nutzeroberfläche wird angezeigt, wenn das Tool aus dem vorherigen Schritt ausgeführt wird. Im folgenden Beispiel wird eine minimale Transaktionsgebühr verwendet. In einer Produktions-App können Sie ein Framework wie React verwenden. Weitere Beispiele finden Sie in der ChatGPT Apps SDK-Dokumentation.

ui/buy-product.html
<div id="root"></div> <script type="module" src="/ui/mcp-app.js"></script>
ui/mcp-app.js
import { App } from "@modelcontextprotocol/ext-apps"; const app = new App({ name: "BuyProduct", version: "1.0.0" }); await app.connect(); if (!window.openai?.requestCheckout) { throw new Error("requestCheckout is not available in this host"); } const root = document.getElementById("root"); let product = { name: "", amount: 0, priceID: "" }; const render = () => { root.innerHTML = ` <h1>${product.name || "Loading..."}</h1> <p>$${(product.amount / 100).toFixed(2)}</p> <form onsubmit="handleSubmit(event)"> <button type="submit">Proceed</button> </form> `; }; app.ontoolresult = (params) => { const { productName, amount, priceID } = params.structuredContent ?? {}; product = { name: productName ?? "", amount: amount ?? 0, priceID: priceID ?? "" }; render(); }; render(); </script>

Versandadresse und Steuer mit Stripe einziehen

Sie können die Stripe Tax-API verwenden, um die im nächsten Schritt verwendeten Steuern zu berechnen. Weitere Informationen finden Sie unter Steuern einziehen.

ChatGPT Instant Checkout-Modal öffnen

Dadurch werden Kundinnen und Kunden aufgefordert, eine Zahlungsmethode auszuwählen. Fügen Sie Logik hinzu, um eine Checkout-Sitzung zu erstellen, der der Preis-ID aus dem vorherigen Schritt zugeordnet wird. Der folgende Codeausschnitt fügt der Preis-ID eine UUID hinzu, um eine Checkout-Sitzung-ID zu erstellen.

ui/buy-product.html
const getTax = (priceID) => { // Add your tax integration }; const createCheckoutSession = (priceID) => { const uuid = crypto.randomUUID(); return `${priceID}::${uuid}`; }; const handleSubmit = (e) => { e.preventDefault(); const { name, amount, priceID } = product; const tax = getTax(priceID); window.openai.requestCheckout({ // This is priceID passed in from the MCP buy product tool id: createCheckoutSession(priceID), // remove this when you are ready for live mode payment_mode: "test", payment_provider: { provider: "stripe", // Insert your Network ID from the Stripe dashboard merchant_id: networkID, supported_payment_methods: ["card"], }, status: "ready_for_payment", currency: "USD", line_items: [ { id: "line_items_123", item: { id: priceID, quantity: 1, }, base_amount: product.amount, subtotal: product.amount, tax: tax, total: product.amount + tax, }, ], totals: [ { type: "items_base_amount", display_text: product.name, amount: product.amount, }, { type: "subtotal", display_text: "Subtotal", amount: product.amount, }, { type: "tax", display_text: "Tax", amount: tax, }, { type: "total", display_text: "Total", amount: product.amount + tax, }, ], fulfillment_options: [], fulfillment_address: null, messages: [], links: [ { type: "terms_of_service", url: "https://example.com/terms", }, ], }); }

MCP-Tool registrieren, um Bezahlvorgang abzuschließen

Wenn die Kundin/der Kunde auf der ChatGPT-Nutzeroberfläche für Zahlungen eine Zahlungsmethode auswählt und Bezahlen auswählt, ruft ChatGPT Ihr complete_checkout-Tool auf und gibt den SPT zurück, den Sie zum Erstellen eines PaymentIntent verwenden.

Registrieren Sie ein complete_checkout-MCP-Tool, das ein gewährtes gemeinsames Zahlungstoken als Eingabe nimmt und zur Verarbeitung an die Payment Intents API übergibt.

server.js
const retrievePriceID = (checkout_session_id: string) => { const [priceID, uuid] = checkout_session_id.split('::'); return priceID; }; server.registerTool( "complete_checkout", { description: "Complete the checkout and process the payment", inputSchema: { checkout_session_id: z.string(), buyer: z .object({ name: z.string().nullable(), email: z.string().nullable(), phone_number: z.string().nullable(), }) .nullable(), payment_data: z.object({ token: z.string(), provider: z.string(), billing_address: z .object({ name: z.string(), line_one: z.string(), line_two: z.string().nullable(), city: z.string(), state: z.string(), country: z.string(), postal_code: z.string(), phone_number: z.string().nullable(), }) .nullable(), }), }, }, async ({checkout_session_id, buyer, payment_data}) => { const price = (await stripe.prices.retrieve(retrievePriceID(checkout_session_id as string))) // Add your tax logic const tax = getTax() // confirms the SPT stripe.paymentIntents.create({ amount: price.unit_amount + tax, currency: price.currency, shared_payment_granted_token: payment_data.token, confirm: true, }); return { content: [], structuredContent: { id: checkout_session_id, status: "completed", currency: price.currency, buyer, line_items: [], order: { id: "123", checkout_session_id, permalink_url: "", }, }, }; } );

Testen

Verwenden Sie den Test-Modus für Zahlungen von ChatGPT mit einer Stripe-Testumgebung, um Ihre App zu testen, ohne echtes Geld zu bewegen.

  1. Geben Sie im Stripe-Dashboard eine Sandbox oder einen Test-Modus ein.
  2. Erstellen Sie ein Stripe-Testprofil, verbinden Sie sich mit ChatGPT in der Testumgebung und kopieren Sie Ihre Test-Netzwerk-ID.
  3. Aktualisieren Sie Ihre ChatGPT-App-Einstellungen, um des Test-Modus für Zahlungen zu verwenden, sodass Testkarten erwartet und Test-SPTs generiert werden.
  4. Wenn Sie einen Bezahlvorgang anfordern, geben Sie Ihre Testprofil-ID an und legen Sie payment_mode auf test fest, damit ChatGPT Testkarten erwartet und Test-SPTs generiert.
    server.js
    window.openai.requestCheckout({ id: priceID, payment_mode: "test", payment_provider: { provider: "stripe", merchant_id: "profile_test", supported_payment_methods: ["card"], },
  5. Verwenden Sie Ihren Stripe API-Testschlüssel in Ihrer MCP-Tool-Implementierung, um Test-SPTs aus ChatGPT zu verarbeiten.
  6. Richten Sie in Ihrer Live- und Testumgebung identische Webhook-Konfigurationen ein und stellen Sie sicher, dass sich Test-Webhook-Handler nicht auf Ihre Produktionssysteme auswirken können. Wenn beispielsweise Ihr Live-Webhook den Versand auslöst, sollte der Test-Endpoint nur protokollieren, dass er im Live-Modus versendet worden wäre.

Nachdem Sie diese Schritte ausgeführt haben, bewerten Sie den Zahlungsablauf in Ihrer App, ohne echtes Geld zu bewegen.

App im Live-Modus veröffentlichen

Wenn Sie bereit sind, Ihre App in den Live-Modus zu versetzen:

  1. Aktualisieren Sie Ihr MCP-Tool, um Ihren Stripe Live-Geheimschlüssel (sk_live_...) zu verwenden.
  2. Aktualisieren Sie die Checkout-Anfrage Ihrer App mit Ihrer Live-Profil-ID und entfernen Sie die Testoption payment_mode.

Ihre App ist dann bereit, Live-Zahlungen abzuwickeln. Dies ist erforderlich, bevor Sie zur Überprüfung an die ChatGPT-App übermitteln.

Vorsicht

Nachdem Sie Ihre ChatGPT-App eingereicht haben, dürfen Sie den Zahlungsmodus nicht mehr verwenden, da er für Live-Kundinnen und -Kunden sichtbar ist.

Siehe auch

  • Modellkontextprotokoll
  • ChatGPT AppSDK
War diese Seite hilfreich?
JaNein
  • Benötigen Sie Hilfe? Kontaktieren Sie den Kundensupport.
  • Schauen Sie sich unser Änderungsprotokoll an.
  • Fragen? Sales-Team kontaktieren.
  • LLM? Lesen Sie llms.txt.
  • Unterstützt von Markdoc