Beágyazott Stripe Apps

A beágyazott Stripe Apps lehetővé teszik a Stripe Connect-re épített platformok számára, hogy harmadik fél app funkcióit közvetlenül saját vezérlőpultjukba integrálják. Connect beágyazott komponensek segítségével a csatlakoztatott fiókoknak hozzáférést adhat olyan appokhoz, mint a QuickBooks, Xero és Mailchimp, anélkül hogy a Stripe vezérlőpultot kellene felkeresniük.

Áttekintés

A beágyazott appok két kulcsfontosságú Connect beágyazott komponenst használnak:

• app-install: Egy telepítési gombot renderel egy Stripe Apphoz a platform UI-ban
• app-viewport: Egy konkrét app viewportot renderel a platform UI-ban

Beállítás az Account Sessions API-val

Az appok beágyazásához Account Sessions-t kell létrehoznia a megfelelő engedélyezett komponensekkel:

Szerver oldal: Account Session létrehozása

const stripe = require('stripe')('sk_live_...');

// Account Session létrehozása a csatlakoztatott fiókhoz
const accountSession = await stripe.accountSessions.create({
  account: 'acct_connected_account_id',
  components: {
    // App telepítési komponens engedélyezése
    app_install: {
      enabled: true,
      features: {
        allowed_apps: [
          'com.tajo.brevo-integration',
          'com.quickbooks.stripe-app'
        ],
      },
    },
    // App viewport komponens engedélyezése
    app_viewport: {
      enabled: true,
      features: {
        allowed_apps: [
          'com.tajo.brevo-integration'
        ],
      },
    },
  },
});

// Client secret visszaküldése a frontendnek
res.json({ clientSecret: accountSession.client_secret });

Kliens oldal: Connect.js inicializálása

import { loadConnectAndInitialize } from '@stripe/connect-js';

// Connect.js inicializálása az account session-nel
const stripeConnect = loadConnectAndInitialize({
  publishableKey: 'pk_live_...',
  fetchClientSecret: async () => {
    const response = await fetch('/api/account-session', {
      method: 'POST',
    });
    const { clientSecret } = await response.json();
    return clientSecret;
  },
});

App Install komponens

Az app-install komponens egy telepítési gombot renderel, amelyet a csatlakoztatott fiókok használhatnak egy Stripe App telepítéséhez:

// App telepítési elem létrehozása
const appInstall = stripeConnect.create('app-install');

// Telepítendő app beállítása
appInstall.setApp('com.tajo.brevo-integration');

// Csatolás DOM elemhez
const container = document.getElementById('app-install-container');
appInstall.mount(container);

// Telepítési eseményekre figyelés
appInstall.on('app_installed', (event) => {
  console.log('App telepítve:', event.app_id);
  showAppViewport();
});

Biztonsági szempontok

Appok beágyazásakor a platformon:

• Account Sessions lejárnak: Szükség esetén hozzon létre új session-öket; ne gyorsítótárazzon client titkokat
• Hatókör szabályozás: Használja az allowed_apps beállítást a telepíthető appok korlátozásához
• Adatizoláció: Minden csatlakoztatott fiók adatai el vannak különítve; a platform nem férhet hozzá az app adataihoz
• CSP fejlécek: Győződjön meg arról, hogy a platform Content Security Policy engedélyezi a https://connect-js.stripe.com csatlakozásokat