On this page

Вградени Stripe Apps

Вградените Stripe Apps позволяват на платформи, изградени на Stripe Connect, да показват функционалността на app-и на трети страни директно в собствените им табла. С помощта на вградените компоненти на Connect можете да дадете на свързаните акаунти достъп до apps без да се налага да посещават таблото на Stripe.

Преглед

Вградените apps използват два ключови вградени компонента на Connect:

app-install: Рендерира бутон за инсталиране в UI на вашата платформа
app-viewport: Рендерира конкретен viewport на app в UI на вашата платформа

Tip

Интеграцията на Tajo Brevo може да бъде вградена в платформи на Connect, позволявайки на свързаните акаунти да синхронизират данните си от Stripe в Brevo чрез интерфейса на платформата.

Настройка с Account Sessions API

Сървърна страна: Създаване на Account Session

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

const accountSession = await stripe.accountSessions.create({
  account: 'acct_connected_account_id',
  components: {
    app_install: {
      enabled: true,
      features: {
        allowed_apps: [
          'com.tajo.brevo-integration',
        ],
      },
    },
    app_viewport: {
      enabled: true,
      features: {
        allowed_apps: [
          'com.tajo.brevo-integration'
        ],
      },
    },
  },
});

res.json({ clientSecret: accountSession.client_secret });

Клиентска страна: Инициализиране на Connect.js

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

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 Viewport (React)

import {
  ConnectAppViewport,
  ConnectComponentsProvider,
} from '@stripe/react-connect-js';

const BrevoCustomerView = ({ customerId }: { customerId: string }) => {
  return (
    <ConnectComponentsProvider connectInstance={stripeConnect}>
      <ConnectAppViewport
        app="com.tajo.brevo-integration"
        viewport="stripe.dashboard.customer.detail"
        objectContext={{
          id: customerId,
          object: 'customer',
        }}
      />
    </ConnectComponentsProvider>
  );
};

Съображения за сигурност

Account Sessions изтичат: Създавайте нови сесии при необходимост; не кешируйте клиентски секрети
Контрол на обхвата: Използвайте allowed_apps за ограничаване на инсталируемите apps
Изолиране на данни: Данните на всеки свързан акаунт са изолирани
CSP заглавки: Уверете се, че политиката за сигурност на съдържанието позволява връзки към https://connect-js.stripe.com

Caution

Вградените компоненти на app изискват интеграция на Connect с достъп до Account Sessions API. Стандартните акаунти в Stripe не могат да използват вградени компоненти.