住所と電話番号を収集する

請求先または配送先の詳細な住所を収集するには、Address Element を使用します。詳細な住所の収集は、税金の計算に使用される場合などに必要になります。Payment Element は、支払いを完了するために必要な請求先住所情報のみを収集しますが、他の請求詳細を収集するように設定することもできます。

Address Element を使用するその他の理由は次のとおりです。

• 顧客の電話番号を収集する
• オートコンプリートを有効にする
• 配送先住所を渡して Payment Element に請求先情報を事前入力する

Stripe は、収集した住所情報と決済手段を組み合わせて、PaymentIntent を作成します。

Address Element を作成する

Address Element の作成時に、shipping または billing のいずれかのモードを指定します。Address Element のモードにより、PaymentIntent の確定に配送先住所と請求先住所のいずれを渡すかが決まります。

Address Element を作成する際は、それを配送モードと請求モードのどちらで使用するかを指定します。

const stripe = Stripe(
'pk_test_TYooMQauvdEDq54NiTphI7jx');

const appearance = { /* appearance */ };
const options = { mode: 'shipping' };
const elements = stripe.elements({ 
clientSecret, appearance });
const addressElement = elements.create('address', options);
addressElement.mount('#address-element');

その他のエレメントとともに住所 Element を使用する

ページに複数の Address Element (モードにつき 1 つ) を使用して、配送先住所と請求先住所の両方を収集できます。

配送先住所と請求先住所の両方を収集する必要があり、Address Element を 1 つのみ使用する場合は、配送モードで Address Element を使用し、請求先住所の収集には Payment Element を使用します。

住所 Element を他の Element とともに使用すると、PaymentIntent または SetupIntent の確定時に一部の動作を自動で実行できます。PaymentIntent または SetupIntent の確定時に住所 Element の完全性が検証され、検証エラーが発生した場合はフィールドごとにエラーが表示されます。