🦁

Capacitor Stripeプラグインの今日までのアップデートを振り返る

2023/11/30に公開

Android

この記事は、 #JP_Stripes アドベントカレンダー 1日目の記事です。

こんにちは、榊原です。私はCapacitorという「Webアプリをネイティブアプリに変換するライブラリ（詳しくいうと、WebViewを使ったアプリ化）」上でStripeを使う @capacitor-community/stripe というプラグインの開発をしたりしています。そこあたりの簡単な経緯はこちらをご覧ください。

にしても、Stripeは進化がはやい！こういったサービスの進化は、「より便利になる」と「多様な機能が生まれる」の2つがありますが、Stripeは他のサービスに比べても進化のはやさがダントツですね。「あ、気づいたら決済時に配送先住所もとれるようになってたこれ便利」と思ったら、その一方で「決済サービスはシステムの悪用を防ぐためにアカウント所有者からの情報収拾が必要 → 本人確認必要だよね → 本人確認機能を独立させてIdentityサービスリリースしました」みたいな、マルチプレイヤーな進化もあって追っかけてて楽しいですよね。

それに伴って、プラグインも進化させていったので、今回はその振り返りをしてみたいと思います。

2021年のStripeプラグインの進化

@capacitor-community/stripe の前身は、ihadeed氏が2016年から管理をしていた cordova-plugin-stripe です（現在not actively maintained）。彼がCapacitorが誕生した時に @capacitor-community/stripe のプラグインをつくり、私が引き継いたことを考えると、もう10年近くStripeはハイブリットアプリのプラットフォーム上で使えてるわけですよね。長い！

この間、StripeのAPIは大きく変わっているので、プラグインも大きく変わりました。

その顕著な例がセキュリティの進化ですよね。クレジットカード情報の非保持化（保存、処理、透過しない）が求められるようになり、プラグインも非保持化のための機能を提供するようになりました。この非保持化のための機能は、StripeのAPIの変更によって、プラグインのAPIも大きく変わりました。なので、以下のようなコードは現在ではもうありえないですよね。

cordova.plugins.stripe.createCardToken({
  number: '4242424242424242', // 16-digit credit card number
  expMonth: 12, // expiry month
  expYear: 2020, // expiry year
  cvc: '220', // CVC / CCV
}, () => { /* success */ }, () => { /* failed */ });

また、時代の流れで clientSecret はユーザデバイスでは非保持が主流になりましたよね。それこそ昔は、iOSだったらSecretKeyは cocoapods-keys ぐらいで隠蔽しておけばいいや（難読化）みたいな流れはありましたが、今の時代はそういうのはやめて、サーバサイドで clientSecret を使ったtokenを生成してデバイスに送る形にして、clientSecret は絶対渡しません。

なので、レポジトリを引き継いだ時、もっとも最初に取り組んだのはセキュリティといっていいでしょう。そのために全部つくりなおしました。ベースとなる時代が違うので、いわゆる式年遷宮というやつですね。コミットログみたところ、基本的にやったのは

非保持化
clientSecret のサーバサイド生成

がメインでした。あとはデモアプリの作成ですね。複数のCapacitorプラグインをつくってて気づくのが、ハイブリッドプラットフォームは、WebとiOSとAndroidで実行した時に（unsupportだといいんですが）supportしてるメソッドごとで返り値を統一する必要があるんですよね。ただ別に要件定義してからつくってるわけでないので抜けることが多いのです。iOSだと、 Promise<void> で返ってくるのに、なぜかAndroidだと Promise<value: string> で返ってくるとか。なのでその挙動を統一するために、デモアプリをつくって、それぞれのプラットフォームで動作を確認していました。1タップで必要な処理が自動実行されるようになってるので、テストの半自動化ですね。笑

※ WebViewをSwiftのテスト、Androidのテストで動かすのは心折れるので半自動化までしかしてないです

こんな感じ。

私がメンテナを引き継いだことと、これらのメジャーアップデートを行ったのが2021年の一番大きな変化だったかなと思います。

2022年のStripeプラグインの進化

まずはちゃんとドキュメンテーションを整備したことですね。日本人がメンテナなので、日本語版もあります。笑

https://stripe.capacitorjs.jp/

https://ja.stripe.capacitorjs.jp/

というのも、Stripeプラグインを拡張していくとAPIの多さに気づくんですよね。 initialize する時に、Stripe Connectのための stripeAccount を渡すことができるとか。以前はGitHubのREADMEだけで対応していたのですが、Issuesが基本的な質問ばかりになる上に、自分自身でも「これどうだったかな」と思うことが多かったのでちゃんとまとめました。Capacitorプラグインのいいところは、TypeScriptで型定義してコメントで概要書くと、 docgen というライブラリ経由でドキュメントを生成できることです。それを活用して、ドキュメントの型定義はすべて自動生成にしています。

それ以外は、地道にライブラリのバージョンアップを重ねていった形です。例えば、2022年7月には、カードキャプチャに対応しました。

また、もともと「すべてのStripeのAPI」に対応できてるわけではないので、プルリクエストをもらって機能を少しずつ増やしていったりしています。例えば、Apple Payでユーザの連絡先と住所を収集できるようになったり。

また、Stripeだけではなく、Capacitorもv3からv4にメジャーアップデートがあったので、その対応をしたりした2022年でした。

そして2023年のStripeプラグインの進化

今年は、StripeのPaymentだけではなく、周辺サービスに目を向けた年でした。具体的には、Identity（本人確認）と、Terminal（デバイスでの決済）です（※どちらも日本はまだ非対応）。

Stripe Identity

Identityは、身分証（免許証やパスポート）と、自撮りの写真を組み合わせて本人確認できるサービスです。本人確認が完了したかは非同期にWebhooksで通知がくるので、プラグインでは本人確認のフロントの機能だけを提供しています。にしても、実際に試したんですが、1〜3分といいつつほぼ1分以内に確認が完了するのはすばらしいですね。
また、自撮りでrejectされた写真をみたのですが、人間がみても同一人物と判定つかないような写真だったので、精度もすごいなと思いました（写真の撮り方が悪いぐらいだとacceptされるので本当すばらしい）。

その上で、customerIdで名寄せできるので、掛け売りの与信管理であったりにも使えていいですよね。

Stripe Terminal

Terminalは対面支払いのサービスです。もっとも手軽にできるのは、専用端末不要でスマホがデバイスになる Tap To Pay ですね。またStripeは専用デバイスもだしていて、これを使うとお店のPOSシステムとして利用することができます。

この2つはまだ日本非対応なのですが、こうなるとStripeは単なる決済プラットフォームというより、customerIdを軸としたユーザデータ管理プラットフォームとして使えるようになるなと思うところです。今後が楽しみですよね！

そしてプラグイン分割へ

ただIdentityとTerminalを @capacitor-community/stripe に搭載して思うわけです。これは重いと。
Webだと、TreeShakingが現代においては一般的ですが、iOSのライブラリ管理であるCocoaPodsやAndroidのMovenは、そこにいれると使っていなくてもライブラリはそのままbundleされます。なので、このままでは「決済機能を組み込みたくてインストールしたら、本人確認機能のライブラリがついてきた」みたいになってしまうわけです。これは重い。多分文化の違いなのですが、Web制作者としてとてつもなく気になる。

ということで、プラグインを分割しました。8月25日にリリースしたv5.1.0から、以下のように分割しています。

@capacitor-community/stripe
@capacitor-community/stripe-terminal
@capacitor-community/stripe-identity

これで、必要な機能だけインストールできるようになりました。これからは、まったく異なる新機能を搭載する時は、新しいプラグインをつくっていくつもりです。

まとめ

ざっくりとした @capacitor-community/stripe の変遷をみていきました。このプラグインの変遷自体というよりも、Stripeの進化を追いかけている感じですね。Stripeは、決済だけではなく、ユーザデータ管理のプラットフォームとしても使えるようになってきているので、これからも進化を追いかけていきたいと思います。

それではまた。