ハコヅミを作る #73：Stripe のアカウントを作り、知らせを受け取る（画面のない課金の土台）
#72 で、課金を作る前に決めることを決めました。今回は、その最初の1歩です。
ただし、ハコヅミの画面は、1つも増えていません。作ったのは、Stripe から届く知らせを受け取って、「この人は有料か、無料か」を切り替える仕組みだけです。
- Stripe のアカウントを、自分の手で作る
- 選ばなかったもの
- 料金に、名前を付けておく
- 知らせを受け取る入口
- 同じ知らせが、2回届いても
- 開発環境の守りに、止められる
- 本物の契約を作って、確かめる
- 画面のない変更を、先に本番に出す
Stripe のアカウントを、自分の手で作る
課金を作る目的は、#69 に書いたとおり、Stripe で課金の仕組みを作る経験を積むことです。
なので、Stripe の画面の操作は、全部わたしが自分でやることにしました。Claude Code には、1画面ずつ、何を入れるか、なぜそうするかを説明してもらいます。わたしが画面を撮って見せ、次に進む。その繰り返しです。
Stripeの手順を覚える意図もあるので、順次進めていきたい
途中で、わたしが迷ったところがありました。
氏名を「じるラボ」で登録してしまったが、実際の氏名じゃなくても問題ない？
今の段階では、問題ありませんでした。Stripe には、本物のお金が動かない「サンドボックス」という練習用の環境があります。そこを使うあいだは、ログインする人の名前は、どこにも出ません。本当の氏名が要るのは、本番で売り始めるときの本人確認だけです。
選ばなかったもの
アカウントを作る途中で、いくつか「おすすめ」を出されました。選ばなかったものを、並べておきます。
| 出されたもの | 中身 | 選ばなかった理由 |
|---|---|---|
| Stripe Tax | 国ごとの税金を計算して集める | 日本の人に、税込みの月額で売るだけなので、要らない |
| Managed Payments | 税の申告まで Stripe に任せる | 1取引あたり 3.5% の手数料が、上乗せされる |
| 請求書の送信 | 請求書をメールで送って払ってもらう | 毎月カードから自動で引き落とす形なので、要らない |
| AI ツールから始める | Claude などに Stripe の道具をつなぐ | お金のアカウントなので、つなぐなら線を引いてから |
いちばん迷いやすいのは、Managed Payments でした。「推奨」の札が付いていて、最初に目に入ります。
左の「推奨」は、1取引 3.5% の上乗せ
海外にたくさん売るなら、税の申告まで任せられるのは、心強いと思います。でも、ハコヅミは日本の人に向けた、安めの月額です。3.5% の上乗せは、重すぎます。
料金に、名前を付けておく
サンドボックスに、商品「ハコヅミ 有料プラン」を作りました。料金は、月額の仮の額です。本当の料金は、売り始めるときに決めます。
サンドボックスの商品（料金は仮の額）
ここで1つ、Claude Code にすすめられて、料金に「検索キー」を付けました。hakozumi_paid_monthly という名前です。
Stripe の料金には、price_ で始まる番号が付きます。この番号は、練習用の環境と本番とで、別々になります。アプリに番号を書くと、本番に出すときに、書き換えが要ります。
検索キーを付けておくと、アプリは「hakozumi_paid_monthly という名前の料金」で探せます。本番の料金にも同じ名前を付ければ、アプリは直さなくて済みます。本当の料金を決めて作り直すときも、同じです。
知らせを受け取る入口
ここからが、ハコヅミの側の作業です。
申し込みも、解約も、支払いも、Stripe の画面で行われます。ハコヅミのサーバーは、それを知りません。Stripe が「この人の契約が作られた」「解約された」と、ハコヅミに知らせてくれます。これを Webhook といいます。
ハコヅミに、その知らせを受け取る入口を1つ作りました。
- 届いた知らせが本当に Stripe からのものかを、署名で確かめる。合わなければ、何もしない
- 契約の状態から、有料か無料かを決める。有効なら有料、解約されたら無料
- 無料に戻っても、上限を超えている画像は消さない（前からの決まり）
署名の確かめは、Stripe の公式のパッケージに任せました。ハコヅミでは、パッケージを足すときは、理由を書く決まりにしています。署名の確かめは、時刻のずれの許し方や、比べ方のこまかい気配りが要るところです。自分で書くより、Stripe が書いたものを使うほうが、安全だと考えました。
同じ知らせが、2回届いても
知らせを受け取る入口には、気をつけることが2つありました。
1つ目は、同じ知らせが、2回届くことがあること。Stripe は、ハコヅミからの返事がなかったり、遅れたりすると、同じ知らせを送り直します。受け取った知らせの番号を覚えておいて、2回目は何もしないようにしました。
2つ目は、知らせの順番が、入れ替わって届くことがあること。「解約された」のあとに、その前の「有効になった」が遅れて届くと、解約した人が有料に戻ってしまいます。知らせが作られた時刻を覚えておいて、それより古い知らせでは、上書きしないようにしました。
どちらも、ふだんはめったに起きません。でも、お金と「有料かどうか」に関わるところです。めったに起きないことほど、起きたときに気づきにくいので、最初から入れておきました。
開発環境の守りに、止められる
入口を作って、開発環境に出したところで、Claude Code が1つ気づきました。
ハコヅミの開発環境は、Cloudflare Access という仕組みで、わたししか開けないようにしてあります。そのままだと、Stripe のサーバーからの知らせも、Access のログインの画面に止められて、届きません。
開発環境の守りは、外したくありません。そこで、入口のパスだけ、Access を通さない設定を足しました。
入口では、Stripe の署名で本物かを確かめています。だれかが入口に何かを送っても、署名が合わなければ、何も変わりません。Access を外すのは入口だけで、ほかの画面は、今までどおり守られています。
設定のあと、ログインしていない状態で、2つを開いて確かめました。トップページは、今までどおり Access のログインの画面へ。入口は、Access を通って、ハコヅミまで届きました。
本物の契約を作って、確かめる
次は、Stripe に「この入口に知らせて」と登録します。受け取る知らせは、契約の作成・変更・削除の3つだけにしました。
受け取る知らせを選ぶ（updated も選んでいて、全部で3つ）
登録すると、署名の鍵ができます。この鍵を、開発環境のサーバーに入れました。鍵は、チャットにも貼らず、わたしが写して入れます。Claude Code は、鍵を見ません。
確かめ方は、少し回り道をしました。Stripe の画面には「テストイベントを送信する」というボタンがあります。押すと、Stripe の道具（CLI）を入れてください、という画面が出ました。
道具を入れる代わりに、サンドボックスで、本物の契約を作ることにしました。
- テストの顧客を作る
- テスト用のカード番号（
4242 4242 4242 4242）を付ける - 「ハコヅミ 有料プラン」の契約を作る。契約のメモ（メタデータ）に、ハコヅミの利用者の番号を入れる
契約を作ると、ハコヅミの開発環境のアカウントの画面で、会員区分が「有料」に変わりました。Stripe で契約をキャンセルすると、「フリー」に戻りました。
Stripe の側でも、2つの知らせが届いたことが分かる
テストの知らせではなく、本物の契約の知らせで確かめられたのは、よかったと思います。署名が合うこと、守りに止められないこと、だれの契約かを読めること。全部を、一度に確かめられました。
画面のない変更を、先に本番に出す
この段階で本番に出すかを、Claude Code に聞きました。
このタイミング（348）の段階で本番に一度出しておいた方がいいの？
返事は「出しておくほうがよい」でした。理由の中で、いちばん大きかったのは、これです。
ハコヅミの本番リリースは、「開発中のものを、まるごと本番へ」という形です。次の段階では、アカウントの画面に「有料プランにする」のボタンが入ります。それが開発中のものに入ったあとで、別の急ぎの直しを本番に出したくなると、そのボタンも一緒に、本番に出てしまいます。本番には、まだ Stripe の鍵を入れていないので、押しても申し込めません。
今回の土台は、画面が変わりません。今のうちに出せば、開発中のものを、きれいな状態に戻せます。本番では、鍵がないので、入口は何もしません。
もう1つ、ここで決まりを足しました。課金の画面は、Stripe の鍵が入っている環境でだけ出す。開発環境では見えて試せて、本番では、売り始めるまで見えません。これなら、課金の画面が開発中のものに入ったままでも、ほかの直しを、いつでも本番に出せます。
小さなつまずき
作っている途中で、2つ、つまずきました。
1つは、管理の画面のテストが、手元で時間切れになったこと。前に書いたフォローのテストで、500人の利用者を作っていました。それが、テストを流すたびに手元のデータベースにたまり、5,000人近くになっていました。全員を並べる管理の画面が、遅くなっていたのです。たくさん作るテストは、終わったら消すようにしました。
もう1つは、わたしの側の決まりの話です。手元のパソコンからは、サーバーに出すコマンドを打たない、と決めています。Claude Code が、出来上がりの大きさを測るために、「試しに組み立てるだけ」の形でそのコマンドを打ちました。どこにも出してはいません。でも、決まりの文字どおりには外れるので、そう報告してきて、もう使わないことにしました。
おわりに
- 手順を覚えたいなら、画面は自分で操作する。1画面ずつ、理由を聞きながら
- 「推奨」の札は、自分の事情に合うとは限らない。手数料の行まで読む
- 環境ごとに変わる番号は、アプリに書かない。名前を付けて、名前で探す
- 署名の確かめのような細かいところは、公式のものに任せる
- 同じ知らせが2回届く、順番が入れ替わる。めったに起きないことほど、最初から入れておく
- 守りを外すなら、外すところだけ。外したところには、別の守りがあることを確かめる
- テストのボタンが使えなければ、本物を小さく作って確かめる
- 画面の変わらない変更は、先に出しておく。まだ出せないものを、開発中にためない
次は、申し込みと解約の画面の予定です。
テスタを募集しています。キャンプに行く方、よければ、触ってみてください。