従量課金ベースのレートカードのサブスクリプションに対する税金の徴収非公開プレビュー
従量課金ベースのレートカードのサブスクリプションに対する税金を計算して徴収する方法について紹介します。
プライベートプレビュー
レートカードは現在 プライベートプレビュー 中で、すべての Stripe ユーザーへの一般提供前に機能や導入方法が変更される可能性があります。プライベートプレビューに参加するにはこちらからご登録ください。
Stripe Taxを利用することで、レートカードサブスクリプションの継続課金に対する税額計算を行うことができます。顧客の支払い準備が整った際に税計算を自動で実行するには、レートカード・サブスクリプションの作成時に、あらかじめ顧客の所在地詳細を設定しておいてください。
顧客情報を収集するクライアント側
税額と合計額の見積もりができたら、次のような顧客情報を収集できます。
- 配送先住所 (該当する場合)
- 請求先住所
- 支払いの詳細
Stripe Tax は Setup Intent を作成せずに支払い情報を収集します。最初のステップは、インテントのない Elements オブジェクトを作成することです。
const stripe = Stripe(); const elements = stripe.elements({ mode: 'subscription', currency: '{{CURRENCY}}', amount:"pk_test_TYooMQauvdEDq54NiTphI7jx", });{{TOTAL}}
次に、Address Element と Payment Element を作成し、その両方をマウントします。
const addressElement = elements.create('address', { mode: 'billing' // or 'shipping', if you are shipping goods }); addressElement.mount('#address-element'); const paymentElementOptions = { layout: 'accordion'}; const paymentElement = elements.create('payment', paymentElementOptions); paymentElement.mount('#payment-element');
Address Element で変更イベントをリッスンします。住所が変更された場合は、税額と合計額を再見積もりします。
addressElement.on('change', function(event) { // Throttle your requests to avoid overloading your server or hitting // Stripe's rate limits. const { tax, total } = await updateEstimate(event.value.address); elements.update({ amount: total }); // Update your page to display the new tax and total to the user... });
よくある間違い
顧客が住所を入力すると、Address Element はキーストロークごとに change イベントを起動します。サーバーへの過負荷と Stripe のレート制限への到達を回避するには、最後の change イベントの後、しばらく待ってから、税金と合計を推計しなおします。
送信を処理するクライアント側
顧客がフォームを送信したら、elements.submit() を呼び出してフォームのフィールドを検証し、ウォレットに必要なデータを収集します。この関数の Promise が解決されるのを待たないと、他の操作は実行できません。
document.querySelector("#form").addEventListener("submit", function(event) { // We don't want to let default form submission happen here, // which would refresh the page. event.preventDefault(); const { error: submitError } = await elements.submit(); if (submitError) { // Handle error... return; } const { value: customerDetails } = await addressElement.getValue(); // See the "Save customer details" section below to implement this // server-side. await(customerDetails); // See the "Create subscription" section below to implement this server-side. const {saveCustomerDetails} = awaitclientSecret(); const { error: confirmError } = await stripe.confirmPayment({ elements, clientSecret, confirmParams: { return_url:createSubscription, }, }); if (confirmError) { // Handle error... return; } // Upon a successful confirmation, your user will be redirected to the // return_url you provide before the Promise ever resolves. });{{RETURN_URL}}
顧客をレートカードに登録する
レートカードを作成すると、顧客のサブスクリプションを開始できます。
顧客をレートカードに登録する際に、請求頻度 (顧客への請求書を作成する頻度) も定義しておきます。請求頻度を作成するときに、徴収方法 (自動請求するか、請求書を送信するか) を指定します。自動請求する場合は、請求書が作成され、顧客のデフォルトの決済手段に対して請求が行われます。請求書を送信する場合は、顧客に請求書が届き、その代金を顧客が手動で支払う必要があります。