Stripe Checkoutを使ってみたのでTipsを残しておく
Stripeを仕事で使うことになり、いろいろと調べたことを忘れないうちにアウトプットしておこうと思います。尚、これは執筆時点の仕様に関するもので、今後変わる可能性は大いにあります。
2022/02/17更新
とてもありがたいことにStripeの中の人にアドバイスをいただくことができたので、ところどころ記載内容をアップデートしています。
ちょっと記事でanswerする時間が今日なさそうなので、ツイートでとりあえずインライン回答。https://t.co/SblZapax9C
— hide@Stripe Developer Advocate 🐈🐈🦓🥑 (@hide__dev) 2022年2月15日
- Stripe Checkoutはフロントエンドだけで使える?
- Stripe Checkoutのページにいい感じに消費税は表示できる?
- サブスクリプションな商品の場合、途中でプラン変更した場合などの支払いはどうなる?
- サブスクリプションの期間の調整はStripeの管理画面からできる?
- Stripe Checkoutで買った商品(サブスク)の支払い方法の変更はどうやってやる?
- Stripe Checkoutで申し込んだお客様に飛ぶメールの言語はどうなる?
- 決済が発生したときにお客様とStripe User双方にメールは飛ぶ?
- Stripeのメタデータに設定できる量に制限はある?
- priceIdはテスト環境から本番環境に引き継がれる?
Stripe Checkoutはフロントエンドだけで使える?
一応Stripe CheckoutにはClient-only integrationというものがあります。
ただし、Stripeからも非推奨と言われています。以下の制限が主な理由です。
- カード支払いのみがサポートされています。
- Coupons、Discounts、Promotion Codes、Tax Rates の各 API には対応していません。
- 既存の Customer オブジェクトを使用した 1 回限りの支払いの作成はサポートされていません。
- 請求前のカードの売上の保留はサポートされていません。
- 1 回限りの支払いと継続支払いを 1 回の取引で行うことはサポートされていません。
- Connect プラットフォームは、連結アカウントに代わってこの組み込みを使用することはできません。
- Stripe Tax はサポートされていません。
全部痛いのですが、特にクーポンが使えないことと、Tax ratesやStripe Taxが使えないのが致命的だったのでClient-only integrationは僕はあきらめました。
使い方については以下が参考になります。
Payment Linksについて
フロントエンドだけでどうにかできないかと思い、Payment Linksについても調べてみました。こちらはクーポンやStripe Taxも使えていい感じです。
ただし、Stripe Checkoutで扱える情報以外にも保存しておきたいものがあったため(お客様の会社名とか備考とか)、フロントエンドだけで使うのはどのみちあきらめました。
特に細かい要件が無ければPayment Linksでいろいろと足りそうです。
Stripe Checkout client-server integration
フロントエンドだけでは無理そうだとなったら、client-server integrationを使います。こちらはサーバーサイドでセッションを作って、もうちょっといろいろとごにょごにょできるようになります。
Stripe Checkoutのページにいい感じに消費税は表示できる?
作りたてのアカウントではいい感じには表示されません。商品に消費税を設定しましょう。手数料が許容できるのであればStripe Taxも検討した方が良いですし、推奨されています。
Dynamic Tax Ratesというものあるのですが、残念ながら日本はまだサポートされていません。
サブスクリプションな商品の場合、途中でプラン変更した場合などの支払いはどうなる?
スタンダードの1年プランみたいなものの2ヶ月目とかでプレミアムプランに切り替えたとき、お金の扱いがどうなるか。あるいはプレミアムからスタンダードに切り替えたときはどうなるのか。
このあたりは「比例配分」の話で、Stripeが「いい感じにやってくれる」仕組みがあります。
サブスクリプションの期間の調整はStripeの管理画面からできる?
サブスクリプションの周期を変えたくなるときが出てくるかもしれません。そんなときはTrial期間をうまく使うみたいです。
Stripe Checkoutで買った商品(サブスク)の支払い方法の変更はどうやってやる?
1度買ったら終わりな商品はあまり関係ないのですが、サブスクリプションだとカードの期限が切れたりします。その場合に支払い方法をどうやって変えれば良いのか。
そこで使うのがCustomer Portalです。
お客様用の専用ページを作って、そこでお客様に自分自身で変更してもらいます。
注意点として、Customer PortalはStripeのテスト環境だと、 管理画面からサクッと見ることができる のですが、これはあくまでプレビュー用&テスト用のものです。
本番用のCustomer PortalのURLはAPIを使って発行する必要があります。セキュリティの観点から、URLの有効期限もシビアなので気をつけましょう。
新しいポータルセッションは 5 分後に期限切れとなります。顧客がその期限内にセッションを使用すると、そのセッションは最新のアクティビティの 1 時間後に期限切れとなります。各ポータルセッションは、最大 2 時間まで有効です。
Stripe Checkoutで申し込んだお客様に飛ぶメールの言語はどうなる?
Stripe Checkoutで商品を購入すると、例えば領収書がメールでお客様に送信されます。このメールの言語はどのように決まるのか。
まず、Checkoutのページには locale
を設定することができます。ここで en
とすれば英語のページなりますし、 ja
にしたら日本語のページです。 auto
にすると、ブラウザの言語で自動判定してくれます。
で、Checkoutのページの言語でメールも飛んでくれるかと思うかもしれませんが、そうはなりません。
何も考えずに実装すると、Stripeで設定している「顧客のメール」の「デフォルトの言語」で送信されます。
これをどうにかいい感じに切り替わるようにしたければ、Customerオブジェクトをあらかじめ作って、 preferred_locales
を設定する必要があります。
ただし、Checkoutのページから顧客が「キャンセル」した場合にCustomerオブジェクトのゴミが作られちゃう問題などがあるため、よく考慮して実装する必要があります。
2022/02/17追記:
直接この問題とは関係が無いのですが、Customerオブジェクトのデータがたくさんできちゃう問題に対処するには、ゲスト顧客を検討するのが良さそうです。メールアドレス、電話番号、カード番号から、顧客をグルーピングしてくれるいい感じな機能です。
決済が発生したときにお客様とStripe User双方にメールは飛ぶ?
設定によって飛ばすことができます。注意点として、Stripe User側は、ユーザー毎に設定が必要です(全体設定ではない)
Stripe Userとしてのメール通知設定について
お客様に送るメールの設定
テスト環境では自動メールは飛ばない
注意点として、領収書などの自動メールはテスト環境では飛びません。領収書に関してはStripeのダッシュボードから送信できるので特に問題は無いのですが、Stripe Userにどういうメールが飛ぶのかというのが本番でしか確認できないのはちょっとつらいです(特に自分が誰かのためにシステムを作っている場合)。
この場合は本番でしか確認する方法がありません。領収書付きで確認したい場合、日本では最低価格50円のサブスクリプションを作って、実際に決済するしかありません(現時点では。サポートに確認済みです)。自分のクレジットカードを使うのに抵抗があるかもしれませんが、ひとまずあきらめましょう(実はいい方法があれば知りたいです)。
いろいろと事情があるようで、メールのサンプルについてもサポートから開示してもらえなかったので、決済してみてのお楽しみです。
Stripeのメタデータに設定できる量に制限はある?
- 50 keys(40 characters long)
- 500 characters long values
Stripeが標準で保存する情報の他に、プラスαで保存したくなる情報があります(会社名とか備考とか)。それにはStripeのメタデータが使えるのですが、これにも一応制限があるので注意が必要です。
priceIdはテスト環境から本番環境に引き継がれる?
Stripeはあらかじめテスト環境と本番環境を用意してくれていて、非常にテストがしやすいDevExになってます。ただ、ちょっとつらかったのが、テスト環境で使っていたものをそのままシームレスに本番環境で使えるわけではない点です。
テスト環境の商品を本番環境にコピーするのはとても簡単です。「本番環境へコピー」というボタンをポチッと押すだけで本番にコピーされます。ただし、このときに priceId
などのIDの値は変わります。
ドキュメント に以下のような記載があったので、IDも引き継げるのかと期待したのですが、どうやらこれはPlanIdに特化したもので、基本的にはIDは変わるものとして設計する必要があります。
今は非推奨(?)なPlanに関しては、確かにIDを設定するAPIがあります。
~IDが引き継げるとめちゃくちゃDevExは向上しそうなのですが、このあたりはあきらめてツールを駆使してあまり意識しなくても良いようにしましょう。~
2022/02/17追記:
この問題は検索キーを使うことで解消できるようです。検索キーとpriceIdを関連付けて置くことで、フロント側が意識するキーをテスト環境も本番環境も同じものにしておくことができそうです。