通販やメディアサイトなど、会員機能を持つアプリケーションで決済機能を組み込む場合、Payment Linksを利用すると「メールアドレスの二重入力」が発生します。

StripeのPayment Links / Checkoutでは、メールアドレスの入力が必要です。
が、会員システムを持つアプリケーションでは、顧客はすでにメールアドレスをアカウント作成時に入力しています。

そのため、Payment Linksを利用した支払いリンクをそのまま組み込むと、決済時にもう一度メールアドレスの入力を要求されてしまいます。

この状況を解決するのに利用できるのが、prefilled_emailクエリパラメータです。

支払いリンクに`prefilled_email`クエリでメールアドレスを追加する

通常の支払いリンクは、https://buy.stripe.com/test_xxxのような形です。

ここにprefilled_emailクエリを追加しましょう。

https://buy.stripe.com/test_xxxx?prefilled_email==test%40example.com

このアドレスにアクセスすると、決済ページのメールアドレスが入力済みの状態に変わります。

これによって、顧客に再度メールアドレスの入力を求める必要がなくなります。

メールアドレスはエンコードして渡そう

JavaScriptなどでリンクを動的に生成する場合、メールアドレスはエンコードして設定しましょう。

    console.log({
      url: `https://buy.stripe.com/test_xxxx?prefilled_email=${encodeURIComponent('test+123@example.com')}`
    })

Webhookなどを利用して、メールアドレスから顧客データを取れるようにしたい場合、「顧客がメールアドレスを変更する可能性がある」ことに注意しましょう。

事前に入力prefillするだけのクエリですので、クエリに設定したアドレスで注文されるとは限りません。

もし追跡を行いたい場合は、client_reference_idクエリを追加で設定することをおすすめします。

など、Stripeを利用してオンラインビジネスを始める方法について週に２〜３本ペースで更新中です。