# Stripe アプリの仕組み

Stripe でアプリを作成する方法をご紹介します。

StripeApps では、Stripe ダッシュボードにカスタムのユーザー機能を直接埋め込み、Stripe API を調整できます。以下に使用するアプリを構築することができます。

- 顧客情報、注文、請求書などの Stripe データを作成および変更する
- Stripe データを他のシステムに同期
- Stripe のユーザーインターフェイスへのカスタマイズを追加する

Stripe Apps で構築できる内容の詳細な例については、[サンプルアプリ](https://docs.stripe.com/stripe-apps/sample-apps.md)をご覧ください。

Stripe Apps の基本コンポーネント:
Stripe Apps の基本コンポーネント (See full diagram at https://docs.stripe.com/stripe-apps/how-stripe-apps-work)
Stripe Apps を使用すると、自分のアカウント用のカスタムアプリを作成したり、[Stripe App Marketplace](https://docs.stripe.com/stripe-apps/distribution-options.md) 経由で他の Stripe ユーザーが自分のアプリを使用できるようにしたりできます。

このガイドを使用して、構築できる 3 つの Stripe Apps タイプと、権限を使用してアプリが必要とする情報にアクセスする方法をご確認ください。

## フルスタックアプリケーション

ほとんどの Stripe Apps には、次の 2 つのコンポーネントがあります。

- *UI 拡張機能* (A set of APIs that allow you to inject user interface elements into the Stripe Dashboard using TypeScript and React)を使用する、Stripe ダッシュボードのフロントエンドコンポーネント
- 状態の保存とバックグラウンド操作の実行を行うバックエンドコンポーネント
![フルスタックアプリケーションのコンポーネント](https://b.stripecdn.com/docs-statics-srv/assets/stripe-apps-full-stack-app.2a8251568ced0f8fa10193d8150aad23.png)

フルスタックアプリケーションのコンポーネント

アプリの UI と、それに対応するバックエンドサービスとの間の認証は、[OAuth](https://docs.stripe.com/stripe-apps/pkce-oauth-flow.md) と[共有シークレット](https://docs.stripe.com/stripe-apps/build-backend.md#authenticate-ui-to-backend)のいずれかを使用して機能します。

> フルスタック Stripe アプリを構築するときは、まず [UI Extensions の仕組み](https://docs.stripe.com/stripe-apps/how-ui-extensions-work.md)を、次に、必要に応じて[サーバー側のロジック](https://docs.stripe.com/stripe-apps/build-backend.md)をご覧ください。

## バックエンド専用アプリケーション

UI のない Stripe アプリを構築できます。たとえば、アプリで Stripe から注文データを収集し、フルフィルメントのためにそのデータを別のサービスに送信することが考えられます。

バックエンド専用アプリケーションのコンポーネント:
バックエンド専用アプリのコンポーネント (See full diagram at https://docs.stripe.com/stripe-apps/how-stripe-apps-work)
アプリのバックエンドで実行できる内容について、詳細は[サーバー側のロジック](https://docs.stripe.com/stripe-apps/build-backend.md)をご覧ください。

## フロントエンド専用アプリケーション

Stripe ダッシュボードを拡張し、追加のバックエンド機能を含めないアプリを構築できます。*UI* (A set of APIs that allow you to inject user interface elements into the Stripe Dashboard using TypeScript and React) のみで Stripe アプリを構成できます。UI 拡張機能を使用して、カスタムの UI を作成し、Stripe ダッシュボードのどこにどのように表示されるかを制御します。
![フロントエンド専用アプリケーションのコンポーネント](https://b.stripecdn.com/docs-statics-srv/assets/stripe-apps-frontend-only-app.f8a4611260e353f1d19028ad5efda70f.png)

フロントエンド専用アプリケーションのコンポーネント

UI 拡張機能を使用したフロントエンド専用アプリケーションをお勧めするのは、次の場合です。

- アプリケーションがバックエンドサービスと通信する必要がない場合。
- アプリケーションが Stripe API と通信する必要があるのは、Stripe ダッシュボードにサインインしているユーザーの代理としてのみである場合。
- アプリケーションがユーザーの認証と、他のサービスとの対話に OAuth プロバイダーを使用する場合。

詳細については、[UI Extensions の仕組み](https://docs.stripe.com/stripe-apps/how-ui-extensions-work.md)をご覧ください。

## Stripe Apps の制限事項

### Connect アカウントアクセス

Connect プラットフォームがアプリをインストールすると、そのアプリはプラットフォームのデータにアクセスできます。ただし、プラットフォームの Connect アカウントのデータにはアクセスできず、それらの Connect アカウントに代わって API コールを行うこともできません。

Connect アカウントが直接アプリをインストールした場合、そのアプリは完全な機能を持ちます。アプリをインストールできるのは特定の Connect アカウントのみで、完全な Stripe ダッシュボードへのアクセス権を持つアカウント ([Standard アカウント](https://docs.stripe.com/connect/standard-accounts.md) を含む) や [Embedded Stripe Apps](https://docs.stripe.com/stripe-apps/embedded-apps.md) を通じたアカウントなどが該当します。

## アプリの権限

すべての Stripe アプリは、タイプに関係なく、データにアクセスするための明示的な権限を必要とします。この権限は、次の 2 つの種類に分類されます。

- アプリケーションが読み書きできる Stripe オブジェクトを決定する Stripe 権限
- ユーザーの Stripe データにアクセスできる他のサービスを決定するサードパーティー権限

*アプリマニフェスト* (In a Stripe App, the app manifest is a stripe-app.json file in your app's root directory. It defines your app's ID, views, permissions, and other essential properties)には、アプリに付与された Stripe とサードパーティーの権限が保存されます。

### Stripe 権限

アプリが Stripe データにアクセスできるようにするには、そのデータに対する権限をアプリに付与する必要があります。すべての[権限](https://docs.stripe.com/stripe-apps/reference/permissions.md)のリストをご覧ください。

権限は、いくつかの方法で適用されます。

- アプリが Stripe オブジェクトの *Webhook イベント* (A webhook is a real-time push notification sent to your application as a JSON payload through HTTPS requests)をリッスンできるのは、そのオブジェクトを読み取る権限がある場合のみです。
- アプリが Stripe API コールを実行できるのは、その API がアプリケーションに権限を付与している場合のみです。
- アプリが UI 拡張機能から Stripe API を呼び出すときは、アプリとサインインユーザーの両方に、その API にアクセスする権限がある必要があります。

UI 拡張機能は、サインインユーザーの代わりに Stripe API を呼び出します。アプリには、サインインユーザーができないデータへのアクセスやアクションの実行はできません。アプリが要求しなかった権限がサインインユーザーにある場合でも、アプリはそのデータの読み書きを実行できません。ただし、サインインユーザーにない権限がアプリにある場合、アプリにその実行権限がある限り、アクションを実行できます。この場合、バックエンドサービスが、ユーザーの権限を確認します。

### サードパーティーサービス

Stripe Apps では、Stripe データを受け取る可能性がある Stripe 以外のサービスの URL を明示的にリストする必要もあります。

UI 拡張機能では、コンテンツセキュリティーポリシー (CSP) を適用することでアクセス可能な URL が実行されます。このポリシーにより、`fetch` コールは、*アプリマニフェスト* (In a Stripe App, the app manifest is a stripe-app.json file in your app's root directory. It defines your app's ID, views, permissions, and other essential properties)に明示的にリストされていない限り、すべて失敗します。

### 権限の付与

*アプリマニフェスト* (In a Stripe App, the app manifest is a stripe-app.json file in your app's root directory. It defines your app's ID, views, permissions, and other essential properties)には、アプリケーションの権限がすべて保管されます。特定の Stripe オブジェクトやバックエンドサービスに権限を付与する場合は、アプリをアップロードする際に `stripe app grant` コマンドを使用します。詳細については、すべての[権限](https://docs.stripe.com/stripe-apps/reference/permissions.md)のリストをご覧ください。

## See also

- [アプリを作成する](https://docs.stripe.com/stripe-apps/create-app.md)
- [Stripe App CLI リファレンス](https://docs.stripe.com/stripe-apps/reference/cli.md)
- [UI Extensions の仕組み](https://docs.stripe.com/stripe-apps/how-ui-extensions-work.md)
- [サーバー側のロジック](https://docs.stripe.com/stripe-apps/build-backend.md)
- [認証フロー](https://docs.stripe.com/stripe-apps/pkce-oauth-flow.md)