先行利用を申し込む

お名前と会社のメールアドレスを入力してください。Tajoへのアクセス申請を確認するためのリンクをメールでお送りします。

このページの内容

Stripe Apps 連携ガイド

Stripe Apps を使うと、独自の機能を Stripe のダッシュボードに直接組み込めます。このセクションは構築ガイドであり、Tajo と Brevo の連携のためのアプリをどのように構築、テスト、公開することになるかを解説します。

Caution

ステータス: 計画中です。 現時点で Stripe App Marketplace に Tajo のアプリはありません。これらのページに登場するアプリ識別子、URL、認証情報はすべて説明用のプレースホルダーであり、実際に動作するエンドポイントではありません。今すぐ Stripe を Tajo に接続するには、Stripe コネクタ（制限付き API キー、読み取り専用同期）を利用してください。

Tip

目標は Brevo 連携を Stripe App Marketplace で公開し、Stripe の加盟店が顧客データ、注文、イベントを Brevo に直接同期して、マーケティング自動化と CRM に活用できるようにすることです。

Stripe Apps とは

Stripe Apps は、独自の UI コンポーネントとバックエンド連携によって Stripe のダッシュボードを拡張します。サードパーティの開発者は次のことができます。

  • Stripe ダッシュボードの各ページ（顧客、支払い、請求書など）に独自のビューを追加する
  • スコープを限定した権限で Stripe のデータにアクセスする
  • Stripe と Brevo などの外部プラットフォームの間でデータを同期する
  • ダッシュボード内でオンボーディングや設定のフローを提供する

Tajo + Brevo 連携の目標

Tajo の Stripe App は Stripe と Brevo を接続し、次の価値を提供します。

  • 顧客インテリジェンス: Stripe の顧客プロフィール、支払い履歴、ライフタイムバリューを Brevo の連絡先に同期します
  • イベントトラッキング: Stripe のイベント（支払い、サブスクリプション、返金）を Brevo のトランザクションイベントとして送信します
  • 自動キャンペーン: Stripe 上のアクティビティにもとづいて Brevo のメール、SMS、WhatsApp キャンペーンをトリガーします
  • ロイヤルティプログラム: Brevo に同期した Stripe の購買データを使ってリテンションのワークフローを構築します

アーキテクチャの概要

  1. Stripe Dashboard
    Stripe App の UI
    顧客ビュー
    支払いの詳細
    アプリの設定
  2. Tajo
    ミドルウェア
    データ同期
    イベントのルーティング
    Webhook の処理
  3. Brevo
    CRM + メール
    連絡先
    キャンペーン
    自動化
Stripe アプリのデータが流れる先 Stripe のダッシュボードと Tajo が顧客データと支払いデータをやり取りし、Tajo が連絡先、キャンペーン、自動化を Brevo と同期します。

ガイドの内容

このドキュメントは、Stripe App を構築して公開するまでのライフサイクル全体を扱います。

はじめかた

ガイド説明
Marketplace への公開アプリを審査に提出するための要件と手順
アプリ審査の要件承認に必要な品質、セキュリティ、UX の基準

設定とリファレンス

ガイド説明
アプリマニフェストリファレンスstripe-app.json マニフェストファイルの完全なスキーマ
権限リファレンスStripe API の権限一覧とリクエストの方法
ビューポートリファレンスアプリの UI を表示できるダッシュボード上の場所

機能と連携

ガイド説明
埋め込み型 Stripe Appsプラットフォーム連携で Connect の埋め込みコンポーネントを使う
インストールリンクとディープリンクインストール用 URL を生成し、特定のアプリ画面へディープリンクする
インストール後のアクションアプリのインストール後のオンボーディングフローを設定する

運用と成長

ガイド説明
アプリのアナリティクスインストール数、表示回数、コンバージョン指標を計測する

前提条件

Stripe App を構築する前に、次のものを用意してください。

  1. Stripe アカウント: 有効化済みの Stripe アカウント（テストモードに限定されていないもの）
  2. Stripe CLI: ローカル開発とアプリのアップロードのために Stripe CLI をインストールします
  3. Node.js: アプリの UI 拡張に必要なバージョン 16 以降
  4. Tajo プラットフォームへのアクセス: Brevo の API 認証情報を設定済みの有効な Tajo アカウント

クイックスタート

Terminal window
# Install Stripe CLI
brew install stripe/stripe-cli/stripe


# Login to your Stripe account
stripe login


# Create a new Stripe App project
stripe apps create tajo-brevo-integration


# Start local development
stripe apps start

主要な概念

アプリマニフェスト

すべての Stripe App には、権限、ビューポート、設定を宣言する stripe-app.json マニフェストがあります。完全なスキーマはアプリマニフェストリファレンスを参照してください。

UI 拡張

Stripe Apps は、ダッシュボードの特定のビューポートに React ベースの UI コンポーネントを描画できます。UI ツールキットには、Stripe ダッシュボードのデザインシステムに合わせた既製のコンポーネントが用意されています。

権限

アプリは、アクセスを必要とする Stripe API のリソースを明示的に宣言する必要があります。ユーザーはインストール時にこれらの権限を承認します。権限リファレンスを参照してください。

署名シークレット

各アプリには、インストール署名の検証と、バックエンドと Stripe の間の通信を保護するための署名シークレットが発行されます。

開発の流れ

  1. 必要な権限とビューポートを含むマニフェストを定義します
  2. Stripe の React コンポーネントライブラリを使って UI 拡張を構築します
  3. Tajo 経由で Brevo とデータを同期するバックエンドのエンドポイントを実装します
  4. stripe apps start を使ってローカルでテストします
  5. stripe apps upload でアップロードします
  6. Stripe のダッシュボードから審査に提出します
  7. 公開し、アナリティクスで監視します

Caution

Stripe は、マーケットプレイスで配布するアプリを英語で記述することを求めています。アプリの掲載情報、UI のテキスト、ドキュメントはすべて英語である必要があります。

次のステップ

まず公開ガイドで要件の全体像を把握し、その後で技術リファレンスを読み進めてアプリのマニフェストと権限を設定してください。

先行利用を申し込む

お名前と会社のメールアドレスを入力してください。Tajoへのアクセス申請を確認するためのリンクをメールでお送りします。

AIアシスタント

こんにちは！ドキュメントについて何でもお聞きください。