外部の支払い方法非推奨

Payment Element に外部の支払い方法を追加します。

注意

カスタムの決済手段機能を作成しました。Stripe 外で処理される決済手段を連携させて決済システムを拡張できます。外部の決済手段ではなく、システムで使用することをお勧めします。

Payment Element は、Stripe で処理される決済手段に加えて、お客様がサポートしている外部決済手段を表示します。外部決済手段の取引は Stripe の外部で処理および確定されるため、外部決済手段を実装するには追加の作業が必要です。

外部の支払い方法の免責事項

顧客が外部の支払い方法を選択すると、外部の支払い方法用に設定した URL にリダイレクトされます。お客様の責任範囲と、外部の支払い方法の継続的な利用可能性についてご確認ください。

このガイドでは、Payment Element のクイックスタートの HTML / JS の例を使用して、外部の支払い方法である Divido を追加します。

はじめに

Stripe アカウントを作成するか、サインインしてください。
Payment Element クイックスタートガイドに従って、決済システムの構築を完了します。
追加しようとしている外部決済手段ごとに、システムと外部決済手段との連携が完了し、目的の地域で機能していることを確認してください。

外部の支払い方法タイプを追加する

Stripe Elements を初期化した checkout.js ファイルで、Payment Element に追加する外部の支払い方法を指定します。この例では Divido を追加します。

checkout.js
elements = stripe.elements({
    clientSecret: clientSecret,
    externalPaymentMethodTypes: ['external_divido']
  });

支払い方法の選択リスナーを処理する

外部の支払い方法へのリダイレクトを処理する方法は、2 つあります。

Stripe の今すぐ支払うボタンのアクションを、外部の支払い方法へのリダイレクトに置き換えます。
Stripe の今すぐ支払うボタンを、外部の支払い方法の提供業者のボタンに置き換えます。

このリスナーは Stripe の今すぐ支払うボタンのアクションを、Divido の決済ページへのリダイレクトに置き換えており、顧客はその決済ページで取引を完了できます。checkout.js で、paymentElement.mount コールの後にリスナーコードを追加します。

checkout.js
paymentElement.mount("#payment-element");

// Track selected payment method
let selectedPaymentMethod;
paymentElement.on('change', (event) => {
  selectedPaymentMethod = event?.value?.type;
});

handleSubmit 関数を更新して Divido の決済ページにリダイレクトします。

checkout.js
async function handleSubmit(e) {
  if (selectedPaymentMethod === 'external_divido') {
    // Redirect customer to the Divido checkout page to complete the transaction
    const dividoRedirectUrl = "<< fill the Divido redirect URL here >>";
    window.location.href = dividoRedirectUrl;
  } else {
    ...
  }

オプション外部の支払い方法を配置する

Stripe は外部の支払い方法に関するコンテキストを持っていないため、スマートオーダリングロジックで外部の支払い方法のランクを適切に判断することはできません。paymentMethodOrder (支払い方法の順序)を使用すると、Payment Element 上で外部の支払い方法をわかりやすく位置づけできます。外部の支払い方法より下の、 Stripe が対応する支払い方法についてはランクが適切に判断されます。この例では、カードに次ぐ項目として Divido を設定しています。

メモ

支払い方法を設定する際、外部の支払い方法をデフォルトとして設定することはできません。1 番目に配置すると、2 番目以降のスロットに外部の支払い方法が表示されます。

checkout.js
const paymentElement = elements.create("payment");
const paymentElement = elements.create("payment", {
      paymentMethodOrder: ['card', 'external_divido']
  });

実装をテストする

決済フローを実行して、Payment Element 上に Divido が表示されることを確認します。この例では、カードに次ぐ項目として Divido を設定しています。
Divido を表示する Payment Element
Divido による支払い方法を選択し、Divido にリダイレクトする次のステップについてのメッセージを確認します。
今すぐ支払うをクリックして、お使いの Divido 実装をテストします。取引を完了するために Divido にリダイレクトされ、支払い後の動作 (確認ページ、成功メッセージ、または失敗メッセージの表示など) が Divido 実装上でも問題ないことを確認します。

ダッシュボードに関する考慮事項

外部の支払い方法の提供業者に対する PaymentIntent は Stripe ダッシュボードでは、incomplete ステータスになります。Stripe は外部の支払い方法による取引に関与しないため、これらの取引のステータスを特定できません。

インテントを作成する前に支払いの詳細を収集する場合、外部の支払い方法の提供業者で処理された取引に対して、Stripe ダッシュボードに incomplete 取引は表示されません。

外部の支払い方法の免責事項

Stripe Payment Element を使用して、Stripe では対応していないがお客様が直接実装している外部の支払い方法をいくつか表示できます。顧客は、外部の支払い方法を選択すると、外部の支払い方法用にお客様が設定した URL にリダイレクトされます。お客様は以下を承認するものとします。

外部の支払い方法が提供されても、Stripe で対応してもいません。外部の支払い方法の運用とサポートは外部の支払い方法の提供業者によって提供されます。
外部の支払い方法の提供業者との直接実装の保守はお客様自身で行う必要があります。
お客様は外部の支払い方法の提供業者との契約を維持する必要があり、各提供業者との契約を遵守する責任があります。
決済機能内で外部の支払い方法の提供業者のマークとロゴを使用するのに必要なすべての権利は、お客様がこれらのドキュメントの記載に従って取得する必要があります。
Stripe は、いかなる外部の支払い方法の提供業者とのいかなる取引 (支払い、返金、不審請求の申請、売上処理、資金フローなど) も処理する責任を負いません。
顧客が外部の支払い方法を選択した後で、たとえば注文の確定や注文の照合などを含む、注文の購入フローを完了する責任は、お客様または外部の支払い方法の提供業者にあります。
外部の支払い方法へのリダイレクト URL は、お客様自身の責任で正しく設定する必要があります。
外部の支払い方法の提供業者との契約が終了するか、Stripe が外部の支払い方法を利用不可にした場合、お客様はすぐに外部の支払い方法を削除する必要があります。
Payment Element に実装して提示できる外部の支払い方法は、このガイドのリストにあるものに限られます。
買い手が指定の外部の支払い方法に正しくリダイレクトされるようにする作業は、お客様単独の責任で行う必要があります。

外部の支払い方法の継続的な利用可能性

Stripe は、いつでも外部の支払い方法として任意の支払い方法を利用不可にすることを決定できます。お客様が使用している外部の支払い方法が利用不可になる場合は Stripe から通知されるため、コードで外部の支払い方法をすぐに削除する必要があります。これに失敗すると、外部の支払い方法が顧客に表示されなくなります。

利用可能な外部の支払い方法

以下の外部の支払い方法を表示できます。該当する外部の支払い方法タイプをコード内でお使いください。

地域	決済手段	外部の支払い方法タイプ

AMER	Interac	`external_interac`
APAC	au PAY	`external_au_pay`
APAC	atone	`external_atone`
APAC	Touch’n Go	`external_tng_ewallet`
APAC	ソフトバンクまとめて支払い	`external_softbank_carrier_payment`
APAC	Toss Pay	`external_toss_pay`
APAC	Laybuy	`external_laybuy`
APAC	Bank Pay	`external_bank_pay`
APAC	auかんたん決済	`external_au_easy_payment`
APAC	BitCash	`external_bitcash`
APAC	Azupay	`external_azupay`
APAC	d払い	`external_dbarai`
APAC	FamiPay	`external_famipay`
APAC	GCash	`external_gcash`
APAC	GrabPay Later	`external_grabpay_later`
APAC	MoMo	`external_momo`
APAC	NET CASH	`external_net_cash`
APAC	Octopus	`external_octopus`
APAC	Paidy	`external_paidy`
APAC	PayPay	`external_paypay`
APAC	PlanPay	`external_planpay`
APAC	ペイジー	`external_pay_easy`
APAC	楽天ペイ	`external_rakuten_pay`
APAC	メルペイ	`external_merpay`
APAC	WebMoney	`external_webmoney`
APAC、ヨーロッパ	Shopback Pay	`external_shopback_pay`
ヨーロッパ	Aplazame	`external_aplazame`
ヨーロッパ	Bizum	`external_bizum`
ヨーロッパ	Divido	`external_divido`
ヨーロッパ	Fonix	`external_fonix`
ヨーロッパ	Iwocapay	`external_iwocapay`
ヨーロッパ	KBC	`external_kbc`
ヨーロッパ	Nexi Pay	`external_nexi_pay`
ヨーロッパ	Oney	`external_oney`
ヨーロッパ	Payconiq	`external_payconiq`
ヨーロッパ	PayPo	`external_paypo`
ヨーロッパ	Sofinco	`external_sofinco`
ヨーロッパ	Postepay	`external_postepay`
ヨーロッパ	PostFinance	`external_postfinance`
ヨーロッパ	Scalapay	`external_scalapay`
ヨーロッパ	TrueLayer	`external_truelayer`
ヨーロッパ	Walley	`external_walley`
ヨーロッパ	YounitedPay	`external_younited_pay`
グローバル	LINE Pay	`external_line_pay`
グローバル	PaySafeCard	`external_paysafecard`
グローバル	Samsung Pay	`external_samsung_pay`
グローバル	Sezzle	`external_sezzle`
LATAM	Dapp	`external_dapp`
LATAM	PicPay	`external_picpay`
MEA	Tabby	`external_tabby`
MEA	Benefit	`external_benefit`
MEA	Fawry	`external_fawry`