Przelewy24 での支払いを受け付ける

ポーランドで最もよく利用されている支払い方法である Przelewy24 (P24) を受け付ける方法をご紹介します。

ウェブ

モバイル

注意

このセクションにはレガシープロダクトについてのコンテンツが含まれています。最新の導入パスについては、代わりに決済を受け付けるのガイドを使用する必要があります。Stripe はこのプロダクトを引き続きサポートしていますが、プロダクトが非推奨になった場合にはサポートが終了する可能性があります。

Przelewy24 は 1 回限りの使用の決済手段であり、顧客は支払いの認証を求められます。Przelewy24 を使用して支払う場合、顧客はお客様のウェブサイトからリダイレクトされ、支払いを承認するとウェブサイトに戻されます。ここで、お客様は支払いが成功したか失敗したかに関する即時通知を受け取ります。

Stripe を設定する
サーバ側

まず、Stripe アカウントが必要です。今すぐ登録してください。

アプリケーションから Stripe API にアクセスするには、Stripe の公式ライブラリを使用します。

PaymentIntent を作成する
サーバ側

PaymentIntent (支払いインテント) は、顧客から支払いを回収する意図を示し、支払いプロセスのライフサイクルを追跡します。

サーバーで PaymentIntent を作成し、回収する amount を指定し、通貨として eur または pln を指定します。既存の Payment Intents のシステムがある場合は、p24 を決済手段タイプのリストに追加します。

PaymentIntent オブジェクト全体をアプリに渡す代わりに、その client secret を返します。PaymentIntent の client secret は、支払い額などの機密情報の操作を許可することなく、クライアント側で支払いを確定し、支払い情報の詳細を更新できる一意のキーです。

Przelewy24 での明細書表記

You can set a custom statement descriptor before confirming the PaymentIntent. For Przelewy24, the statement descriptor is limited to 14 characters. It is visible on your customer’s bank records within the payment’s description, with the format /OPT/X/////P24-XXX-XXX-XXX {statement_descriptor}, where /OPT/X/////P24-XXX-XXX-XXX is a unique reference for the payment generated by Przelewy24.

支払い方法の詳細を収集する
クライアント側

Stripe Elements を使用してクライアントで支払い情報を収集します。Elements は、支払いの詳細を収集するための構築済み UI コンポーネントのセットです。

Stripe Element には、HTTPS 接続を介して支払い情報を Stripe に安全に送信する iframe が含まれています。組み込みを機能させるには、決済ページのアドレスの先頭を http:// ではなく https:// にする必要があります。

HTTPS を使用せずに実装をテストできます。本番環境で決済を受け付ける準備が整ったら、HTTPS を有効化します。

Stripe Elements を設定する

Stripe Elements は Stripe.js の機能として自動的に使用可能になります。支払いページに Stripe.js スクリプトを含めるには、HTML ファイルの head にそのスクリプトを追加します。常に js.stripe.com から Stripe.js を直接読み込むことにより、PCI への準拠が維持されます。スクリプトをバンドルに含めたり、そのコピーを自身でホストすることがないようにしてください。

checkout.html
<head>
  <title>Checkout</title>
  <script src="https://js.stripe.com/v3/"></script>
</head>

決済ページで、以下の JavaScript を使用して Elements のインスタンスを作成します。

const stripe = Stripe('pk_test_TYooMQauvdEDq54NiTphI7jx'
);
const elements = stripe.elements();

p24Bank Element を追加して設定する

Elements には、支払いフォーム内での配置場所が必要です。支払いフォームで、一意の ID を持つ空の DOM ノード (コンテナ) を作成し、その ID を Elements に渡します。

上記のフォームが読み込まれたら、p24Bank Element のインスタンスを作成し、それを上記で作成した Element コンテナにマウントします。

const options = {
  // Custom styling can be passed to options when creating an Element
  style: {
    base: {
      padding: '10px 12px',
      color: '#32325d',
      fontSize: '16px',
      '::placeholder': {
        color: '#aab7c4'
      },
    },
  },
};

// Create an instance of the p24Bank Element
const p24Bank = elements.create('p24Bank', options);

// Add an instance of the p24Bank Element into
// the `p24-bank-element` <div>
p24Bank.mount('#p24-bank-element');

Elements は全面的にカスタマイズできます。ご使用のサイトのデザインに合わせて Elements のスタイルを設定することで、顧客にシームレスな決済フロー体験を提供できます。Element がフォーカスされているときなど、さまざまな入力状態のスタイルを設定することもできます。

Stripe に支払いを送信する
クライアント側

PaymentIntent オブジェクト全体をクライアントに送信するのではなく、client secret を使用します。これは、 Stripe API リクエストを認証する API キーとは異なります。client secret は支払いを完了できるため、慎重に扱う必要があります。記録したり、URL に含めたり、当該の顧客以外に漏洩することがないようにしてください。

stripe.confirmP24Payment を使用し、お客様のページからのリダイレクトを処理して支払いを完了します。この機能に return_url を追加して、ユーザーが銀行のウェブサイトまたはモバイルアプリで支払いを完了した後に Stripe がユーザーをリダイレクトする場所を指示します。

client.js
const form = document.getElementById('payment-form');
const accountholderName = document.getElementById('accountholder-name');
const accountholderEmail = document.getElementById('accountholder-email');

form.addEventListener('submit', (event) => {
  event.preventDefault();

  // Redirects away from the client
  const {error} = await stripe.confirmP24Payment(
    '{{PAYMENT_INTENT_CLIENT_SECRET}}',
    {
      payment_method: {
        p24: p24Bank,
        billing_details: {
          name: accountholderName.value,
          email: accountholderEmail.value,
        },
      },
      payment_method_options: {
        p24: {
          // In order to be able to pass the `tos_shown_and_accepted` parameter, you must
          // ensure that the P24 regulations and information obligation consent
          // text is clearly visible to the customer. See
          // stripe.com/docs/payments/p24/accept-a-payment#requirements
          // for directions.
          tos_shown_and_accepted: true,
        }
      },
      return_url: 'https://example.com/checkout/complete',
    }
  );
});

顧客が支払いを送信すると、Stripe は顧客を return_url にリダイレクトし、以下の URL クエリーパラメーターを含めます。返品ページでは、これらを使用して PaymentIntent のステータスを取得し、顧客に支払いステータスを表示できます。

return_url を指定する際に、返品ページで使用する独自のクエリパラメーターを追加することもできます。

パラメーター	説明
`payment_intent`	`PaymentIntent` の一意の識別子。
`payment_intent_client_secret`	The client secret of the `PaymentIntent` object. For subscription integrations, this client_secret is also exposed on the `Invoice` object via `confirmation_secret`

顧客が自社のサイトにリダイレクトされたら、payment_intent_client_secret を使用して PaymentIntent をクエリし、顧客に取引ステータスを表示できます。

顧客が支払いの実行に使用した銀行口座の詳細は、生成された Charge の payment_method_details プロパティで確認することができます。

{
  "charges": {
    "data": [
      {
        "payment_method_details": {
          "p24": {
            "bank": "inteligo",
            "reference": "P24 123-456-789",
            "verified_name": "JENNY ROSEN"
          },
          "type": "p24"
        },
        "id": "src_16xhynE8WzK49JbAs9M21jaR",
        "object": "source",
        "amount": 1099,

組み込みをテストする

テスト API キーを使用して、P24 銀行リストの中から任意の銀行を選択します。支払いを確定後、テストページにリダイレクトされます。そこには、支払いを成功させるか、失敗させるかを選択するオプションがあります。支払い成功のケースをテストするには、リダイレクトページで支払いを認証します。PaymentIntent が、requires_action から succeeded に移行します。

ユーザが認証に失敗するケースをテストするには、テスト API キーを使用して任意の銀行を選択します。リダイレクトページでテスト支払い失敗をクリックします。PaymentIntent が、requires_action から requires_payment_method に移行します。

オプション支払い後のイベントを処理する
サーバ側

オプションP24 銀行 Element の変更を処理する
クライアント側

オプションP24 リダイレクトを手動で処理する
サーバ側

オプション顧客の銀行設定を保存する
クライアント側

Przelewy24 の要件

Przelewy24 では、取引のオーソリを正常に実行するために顧客がその利用規約に同意することが要求されます。したがって、まず顧客は Przelewy24 利用規約に同意するためのページにリダイレクトされます。中間ページをスキップするには、お客様の Web サイトに Przelewy24 の規約を掲載して、代理として同意を得る必要があります。これが完了すると、p24[tos_shown_and_accepted] 支払い方法オプションの設定が可能になります。

要件	詳細
Przelewy24 利用規約の標準的な表現とハイパーリンクを提示する。	ハイパーリンクを含めて、以下のテキストを顧客に明確に表示する必要があります。ポーランド語の標準的な表現 (ハイパーリンク付き): Oświadczam, że zapoznałem się z regulaminem i obowiązkiem informacyjnym serwisu Przelewy24. 英語の標準的な表現 (ハイパーリンク付き): I declare that I have familiarized myself with the regulations and information obligation of the Przelewy24 service. (私はここに、Przelewy24 サービスの規則および情報に関する義務を十分に理解していることを宣言します。)

要件

詳細

Przelewy24 利用規約の標準的な表現とハイパーリンクを提示する。

ハイパーリンクを含めて、以下のテキストを顧客に明確に表示する必要があります。

ポーランド語の標準的な表現 (ハイパーリンク付き): Oświadczam, że zapoznałem się z regulaminem i obowiązkiem informacyjnym serwisu Przelewy24.
英語の標準的な表現 (ハイパーリンク付き): I declare that I have familiarized myself with the regulations and information obligation of the Przelewy24 service. (私はここに、Przelewy24 サービスの規則および情報に関する義務を十分に理解していることを宣言します。)

銀行の値

銀行名	値
Alior Bank	alior_bank
Bank Millenium	bank_millennium
Bank Nowy BFG S.A.	bank_nowy_bfg_sa
Bank PEKAO S.A	bank_pekao_sa
Banki SpBdzielcze	banki_spbdzielcze
Blik via redirect	blik
BNP Paribas	bnp_paribas
BOZ	boz
CitiHandlowy	citi_handlowy
Credit Agricole	credit_agricole
e-Transfer Poctowy24	etransfer_pocztowy24
Getin Bank	getin_bank
IdeaBank	ideabank
ING	ing
inteligo	inteligo
mBank-mtransfer	mbank_mtransfer
Nest Przelew	nest_przelew
Noble Pay	noble_pay
Płać z iPKO (PKO BP)	pbac_z_ipko
Plus Bank	plus_bank
Santander-przelew24	santander_przelew24
Toyota Bank	toyota_bank
Volkswagen Bank	volkswagen_bank
VeroBank	velobank

注

Przelewy24 での支払いを受け付ける

ポーランドで最もよく利用されている支払い方法である Przelewy24 (P24) を受け付ける方法をご紹介します。

注意

Stripe を設定するサーバ側

PaymentIntent を作成するサーバ側