クレジットカード決済を受け取る

商品の代金、イベントの参加費、予約金などを、作ったアプリの中からクレジットカードで受け取れます。決済会社 Stripe（ストライプ）のアカウントをアプリにつなぎ、受け取る料金を登録するだけで、カード情報の入力画面も、支払い完了の受け取りも、すべて用意された仕組みが動きます。

この機能で受け取れるのは1回ごとの支払いです。「注文が入るたびに支払う」「申し込みのときに参加費を支払う」といった使い方に向いています。

利用者から見た流れ

アプリで「支払う」を押す → Stripeの決済ページが開く → カード番号を入力 → アプリに戻ると「支払い済み」

「支払う」を押すと、別のタブで Stripe の決済ページが開きます。利用者はそこでカード番号を入力します。支払いが済むとアプリに戻り、注文や申し込みが「支払い済み」に切り替わります。

Stripe の決済ページ。左に商品名「イベント参加費」と金額 ¥3,000、右にメールアドレス・カード番号・有効期限・CVC・カード名義の入力欄と「支払う」ボタンが表示されている — 利用者が見る Stripe の決済ページ。左上の店名は Stripe に登録した事業名、商品名と金額は登録した料金の表示名がそのまま出る

カード番号は Stripe が直接受け取ります。あなたのアプリにも、Bakusoku.AIPlatio Canvas AIのサーバーにも、カード番号は保存されません。カード会社から追加の本人確認（3Dセキュア）を求められたときも、Stripe の決済ページの中で完結します。

決済ページに表示される支払い方法は、Stripe 側で有効にしているものがそのまま出ます。クレジットカードのほかに、コンビニ決済や銀行振込を Stripe で有効にしていれば、それも選べるようになります。

あらかじめ知っておくこと

Stripe のアカウントが必要です。売上を受け取る口座にあたるものです。登録は無料で、stripe.com から作れます。
手数料は Stripe に支払います。Bakusoku.AIPlatio Canvas AIは決済手数料を受け取りません。金額は Stripe の料金ページでご確認ください。
入金は Stripe からあなたの銀行口座へ直接届きます。Bakusoku.AIPlatio Canvas AIを経由しません。
受け取る金額は、あらかじめ「料金」として登録します。アプリはその登録の中から料金を選んで請求します。登録していない金額を請求することはできません。日本円で 1 円単位、1 件の料金は 1,000 万円までです。
設定はアプリごとです。同じ Stripe アカウントを複数のアプリで使えますが、キー・料金・Webhook の登録はアプリごとに行います。

設定は4ステップ。順番どおりに進めてください

アプリの設定タブ → 決済を開き、Stripe の設定を押します。キーの入力欄が3つと、その下に商品・料金の登録欄が出てきます。

アプリの設定画面。左のメニューで「決済」が選ばれ、決済プロバイダー設定に Stripe の行と「設定」ボタンが表示されている — 設定 → 決済。Stripe の「設定」を押すと入力欄が開く

Stripe の設定フォーム。シークレットキー、パブリックキー、Webhook Secret の入力欄と、その下に商品・料金の登録欄、本番モードのチェック、保存ボタンが並んでいる — 上がキーの入力欄、下が商品・料金の登録欄

1シークレットキーを入れる

Stripe の画面で左下の開発者を押し、APIキーのタブを開きます（直接開く）。「標準キー」の表に「シークレットキー」があるので、その値をコピーします。値が隠れている場合は、値の部分を押すと表示されます。

Stripe の開発者画面の APIキータブ。標準キーの表に公開可能キーとシークレットキーの2行が並んでいる — 開発者 → APIキー。「標準キー」の表の「シークレットキー」をコピーする（画像ではキーの値を伏せています）

sk_test_ で始まるもの … テスト用。実際のお金は動きません
sk_live_ で始まるもの … 本番用。実際に請求されます

まずはテスト用を、Bakusoku.AIPlatio Canvas AIのシークレットキーに貼り付けます。パブリックキーの欄は、このページの決済では使いません。空のままで構いません。

シークレットキーは他人に見せないでください。このキーがあれば、あなたの Stripe アカウントで請求や返金ができてしまいます。チャットや仕様書に貼らず、この設定画面にだけ入れてください。保存したあとは、画面に一部しか表示されません。

2商品・料金を登録して、保存する

同じフォームの下にある商品・料金で料金を追加を押すと、1件分の入力欄が出ます。受け取りたい金額の種類ごとに1件ずつ登録します。

商品・料金の登録欄。商品・プランの表示名にイベント参加費、金額に3000、通貨にjpy、課金方法に一回払いが入力され、新しい申し込みを受け付けるにチェックが入っている — 「料金を追加」で1件ずつ登録する。この例は参加費 3,000 円

欄	入れるもの
商品・プランの表示名	利用者が決済ページで目にする名前。「イベント参加費」「予約金」など
商品ID・料金ID	自動で入ります。そのままでも構いませんが、`event_fee` のような分かりやすい名前に変えておくと、アプリを作るときに伝えやすくなります。使えるのは半角の英数字と `_` `-` です
金額	円で入れます。3,000 円なら `3000`
通貨	`jpy` のままにします
課金方法	一回払いを選びます
新しい申し込みを受け付ける	チェックを入れたままにします。外すと、その料金では新しい支払いを受け付けなくなります

入れ終わったら保存を押します。Stripe の行に ON と TEST の表示が付けば、キーと料金が登録できています。

保存した料金は、あとから金額を変えられません。すでに支払った人の記録と料金の中身がずれないようにするためです。金額を変えたいときは、新しい料金を追加して、古い料金の「新しい申し込みを受け付ける」を外してください。料金を削除することもできません。

3Webhook を登録して、Webhook Secret を入れる

Webhook（ウェブフック）は「支払いが完了しました」という連絡を Stripe からアプリが受け取るための仕組みです。これがないと、利用者がお金を払ってもアプリ側は「支払い済み」になりません。

保存したあと、もう一度 Stripe の編集を押します。フォームのいちばん下に Webhook URL が表示されるので、コピーします

保存後に Stripe の編集を開き直した状態。フォームの下に「Webhook URL（プロバイダーに登録してください）」と URL が表示されている — 保存後に「編集」を開き直すと、いちばん下に Webhook URL が出る。これをそのまま Stripe に登録する

Stripe の画面で左下の開発者を押し、Webhook のタブを開きます（直接開く）。送信先を追加を押します
「イベントを選択」の画面で、検索欄に checkout.session と入れると4つ出てくるので、すべてにチェックを入れます。続けて charge.refunded を検索してチェックを入れ、合計5つになったら続行を押します

Stripe の「イベントの送信先を作成する」画面。イベントを選択のステップで、選択されているイベントが5件と表示されている — イベントを選択。検索欄で探してチェックを入れ、「選択されているイベント」が 5 になったら続行

イベント名	何のためか
`checkout.session.completed`	支払いが完了した（カード）
`checkout.session.async_payment_succeeded`	後払いの入金が確認できた（コンビニ・銀行振込）
`checkout.session.async_payment_failed`	後払いが期限切れなどで失敗した
`checkout.session.expired`	決済ページが使われないまま期限切れになった
`charge.refunded`	返金した

「送信先のタイプ」は Webhook エンドポイント のまま続行を押します
「エンドポイント URL」に、コピーしておいた Webhook URL を貼り付けて送信先を作成するを押します（送信先名と説明は空のままで構いません）

送信先を設定するステップ。エンドポイント URL の欄にアプリの Webhook URL が貼り付けられ、右下に「送信先を作成する」ボタンがある — エンドポイント URL にBakusoku.AIPlatio Canvas AIの Webhook URL を貼る

作成すると送信先の詳細画面が開きます。右側の「署名シークレット」で目のアイコンを押すと whsec_ で始まる値が表示されるので、それをBakusoku.AIPlatio Canvas AIの Webhook Secret に貼り付けて保存します

作成した送信先の詳細画面。エンドポイント URL、リッスン対象イベント5件、署名シークレット whsec_ の欄が表示されている — 作成後の画面。「署名シークレット」の値が Webhook Secret に入れるもの

カード決済だけなら最初の1つで動きますが、5つとも選んでおいてください。コンビニ決済を後から有効にしたときや、返金したときに、アプリ側の表示が正しく変わらなくなります。

4アプリに料金を組み込む

決済専用のメニューはありません。いつもどおりチャットで伝えるだけです。登録した料金の名前や料金IDを添えると、意図どおりの場所に支払いボタンが付きます。

「イベントの申し込み画面で、登録した料金『イベント参加費』をカードで支払えるようにして」
「注文確定のときに、料金ID order_fee で決済できるようにして」
「予約のときに予約金を受け取りたい。料金は決済設定に登録してある」

アプリは、登録した料金の一覧を読み取って請求します。アプリの中に金額を書き込むのではなく、この設定画面の料金が使われます。

アプリづくりと Stripe の設定はどちらが先でも構いません。ただし料金の登録が済むまでは、利用者が「支払う」を押しても「決済料金が未設定です」と表示されます。利用者に配る前に、必ずステップ1〜3を済ませてください。

本番の前にテストする

シークレットキーがテスト用（sk_test_）のあいだは、実際のお金を動かさずに一通り試せます。カード番号のかわりに次の番号を使ってください。有効期限は未来の日付、セキュリティコードは任意の3桁で通ります。コンビニ決済や他のカードブランドなど、ほかのテスト用の番号は Stripe 公式のテストカード一覧にまとまっています。

カード番号	どうなるか
`4242 4242 4242 4242`	そのまま成功します
`4000 0025 0000 3155`	本人確認の画面が出ます
`4000 0000 0000 0002`	カードが拒否されます

確かめておきたいのは次の3つです。

支払ったあと、アプリに戻ると「支払い済み」に変わるか（変わらなければ Webhook の設定が疑わしいです）
Stripe の取引の一覧に、登録した表示名と金額で載っているか
決済ページを閉じて支払わずに戻ったとき、アプリ側が「支払い済み」になっていないか

本番に切り替える

テストが済んだら、本番用に入れ替えます。Stripe のテスト環境と本番環境は完全に別物なので、キーと Webhook の両方を本番側で登録し直す必要があります。登録した料金はそのまま使えます。

Stripe で本番の利用を有効にします（事業情報と入金口座の登録が求められます）
Stripe を本番環境に切り替えて、本番用のシークレットキー（sk_live_）を取り、Bakusoku.AIPlatio Canvas AIのシークレットキーに上書きします
本番環境の Webhook で、同じ Webhook URL をもう一度登録し、新しく表示された whsec_ を Webhook Secret に上書きします
本番モード (LIVE) にチェックを入れて保存します。Stripe の行の表示が LIVE に変わります

Webhook の登録し直しを忘れるのが、最も多いつまずきです。キーだけ本番用にすると、支払いは通るのにアプリ側が「支払い済み」にならない状態になります。「本番モード (LIVE)」のチェックは画面の目印で、実際にテストか本番かはキーの種類（sk_test_ か sk_live_）で決まります。

支払いの記録はどこで見るか

Stripe の取引画面。決済タブの一覧に、金額 ¥3,000、ステータス成功、カード末尾 4242、顧客のメールアドレス、日付が1行で表示されている — Stripe の「取引」。誰がいくら払ったかはここで見る。テストの支払いもテスト環境のここに載る

したいこと	どこで
誰がいくら払ったか、入金の予定を見る	Stripe の取引と残高
返金する、領収書を送る	Stripe の取引で該当の支払いを開きます（Bakusoku.AIPlatio Canvas AIの画面には返金の機能はありません）
注文や申し込みが支払い済みか見る	アプリの画面。作るときに「注文一覧に支払い状況を出して」と伝えておくと一覧で見られます
決済を一時的に止める	アプリの設定 → 決済で Stripe の ON を押して OFF にします。利用者が「支払う」を押してもエラーになります
Stripe との接続をやめる	Stripe の行の削除を押します。キーは消えますが、登録した商品・料金は残り、再接続からキーを入れ直せば元に戻ります

うまくいかないとき

症状	まず確認すること
「決済料金が未設定です」と出る	商品・料金が登録されていません。いちばん多い原因です。設定 → 決済で Stripe の編集を開き、料金を追加して保存してください
「登録料金と一致しません」と出る	アプリが使っている料金と、登録してある料金が食い違っています。料金の「新しい申し込みを受け付ける」を外していないか、料金IDを変えていないか確認してください。アプリ側を直す場合はチャットで「料金ID ○○ を使うように直して」と伝えます
「支払う」を押すとエラーになる	そのアプリの設定 → 決済で Stripe が設定済みで ON になっているか。設定はアプリごとなので、別のアプリで設定していても使えません。シークレットキーの頭が `sk_` で始まっているか（`pk_` を貼っていないか）もご確認ください
決済ページが開かない	決済ページは別のタブで開きます。ブラウザのポップアップブロックが働いていないか、画面上部の表示をご確認ください
支払ったのに「支払い済み」にならない	Webhook です。URL がそのアプリのものか、5つのイベントを選んだか、`whsec_` の値が合っているか。テスト用と本番用を混ぜていないかもご確認ください
テストでは動いたのに本番で動かない	本番用のキーに入れ替えたあと、Webhook を本番環境で登録し直したか。ここが最も多いつまずきです
コンビニ決済を選んだ人が「処理中」のまま	正常です。コンビニや銀行振込は、入金が確認できた時点で「支払い済み」に変わります。期限までに入金がなければ「失敗」になります
「決済ページの有効期限が切れました」と出る	決済ページは開いてから 24 時間で無効になります。アプリで「支払う」を押し直すと、新しい決済ページが開きます

よくあるご質問

カード情報はどこに保存されますか。
Stripe に保存されます。あなたのアプリにもBakusoku.AIPlatio Canvas AIにも保存されません。カード番号は Stripe の決済ページで入力されるので、アプリのプログラムを通りません。

金額をあとから変えられますか。
保存した料金そのものは変えられません。新しい金額の料金を追加し、古い料金の「新しい申し込みを受け付ける」を外してください。アプリが料金IDを直接指定している作りの場合は、あわせてチャットで「新しい料金を使うように直して」と伝えてください。

料金を複数登録できますか。
できます。「一般 3,000 円」「学生 1,500 円」のように、受け取りたい金額の種類ごとに登録してください。アプリを作るときにどの料金をどこで使うかを伝えると、その料金で請求されます。

返金はできますか。
Stripe の取引で該当の支払いを開くと行えます。返金すると、Webhook を通じてアプリ側の記録も「返金済み」に変わります。

利用者に領収書を出せますか。
Stripe が自動でメールを送る設定にできます。Stripe の設定にある顧客向けメールの項目でご確認ください。

複数のアプリで同じ Stripe アカウントを使えますか。
使えます。ただし Webhook URL はアプリごとに異なるので、アプリの数だけ Stripe 側に Webhook を登録してください。

毎月自動で引き落としたいのですが。
このページの決済は 1 回ごとの支払いです。月会費のような定期的な請求をご希望の場合は、運営までご相談ください。

アプリの設定アプリに入れられる機能アプリを公開する