コンテンツにスキップ
アカウントを作成
または
サインイン
Stripe ドキュメントのロゴ
/
アカウントを作成
サインイン

注

このページはまだ日本語ではご利用いただけません。より多くの言語で文書が閲覧できるように現在取り組んでいます。準備が整い次第、翻訳版を提供いたしますので、もう少しお待ちください。

支払いを受け付ける

オンライン支払いを安全に受け付けます。

支払いフォームを作成するか、構築済みの決済ページを使用して、オンライン決済の受け付けを開始します。

Stripe Checkout を使用して、Stripe がオンラインで提供する決済ページにリダイレクトします。この実装と、Stripe の他の実装タイプとの比較をご覧ください。

Checkout のプレビュー

実装作業

ローコード

システム構築のタイプ

Stripe がオンラインで提供する決済ページにリダイレクトする

UI のカスタマイズ

カスタマイズは限定的

試してみる

First, register for a Stripe account.

Use our official libraries to access the Stripe API from your application:

Command Line
# Available as a gem
sudo gem install stripe
Gemfile
# If you use bundler, you can add this line to your Gemfile
gem 'stripe'

顧客を Stripe Checkout にリダイレクトする
クライアント側
サーバー側

ウェブサイトにサーバー側のエンドポイントを呼び出す決済ボタンを追加して Checkout セッションを作成します。

既存の顧客の Checkout セッションを作成することもできます。これにより、Checkout フィールドに既知の連絡先情報を事前入力して、その顧客の購入履歴を統合することができます。

checkout.html
<html>
  <head>
    <title>Buy cool new product</title>
  </head>
  <body>
    <!-- Use action="/create-checkout-session.php" if your server is PHP based. -->
    <form action="/create-checkout-session" method="POST">
      <button type="submit">Checkout</button>
    </form>
  </body>
</html>

Checkout セッションは、顧客が支払いフォームにリダイレクトされた際に表示される内容をプログラムで示したものです。以下のようなオプションを使用して設定できます。

success_url に、支払いを完了した後に Checkout が顧客を戻すウェブサイト上のページの URL 値を設定します。オプションで、顧客が決済プロセスを完了前に終了した場合に、Checkout が顧客を戻すウェブサイト上のページの cancel_url 値を指定することもできます。

注

デフォルトでは、Checkout セッションは作成後 24 時間で期限切れとなります。

Checkout セッションを作成したら、レスポンスで返された URL に顧客をリダイレクトします。

# This example sets up an endpoint using the Sinatra framework.


require 'json'
require 'sinatra'
require 'stripe'

# Set your secret key. Remember to switch to your live secret key in production.
# See your keys here: https://dashboard.stripe.com/apikeys
Stripe.api_key = 
'sk_test_BQokikJOvBiI2HlWgH4olfQ2'


post '/create-checkout-session' do
  session = Stripe::Checkout::Session.create({
    line_items: [{
      price_data: {
        currency: 'usd',
        product_data: {
          name: 'T-shirt',
        },
        unit_amount: 2000,
      },
      quantity: 1,
    }],
    mode: 'payment',
    # These placeholder URLs will be replaced in a following step.
    success_url: 'https://example.com/success',
    cancel_url: 'https://example.com/cancel',
  })

  redirect session.url, 303
end

決済手段

デフォルトでは、カードとその他の一般的な決済手段が有効になっています。Stripe ダッシュボードで個々の決済手段をオンまたはオフにできます。Checkout では、Stripe は通貨と制限事項を評価して、対応している決済手段を顧客に動的に提示します。

決済手段が顧客にどのように表示されるか確認するには、ダッシュボードで取引 ID を入力するか、または注文金額と通貨を設定します。

決済手段の設定では Apple Pay と Google Pay を有効にすることができます。デフォルトでは、Apple Pay は有効で、Google Pay は無効になっています。ただし、有効になっていても Stripe が除外する場合があります。配送先住所を収集せずに税金の自動計算を有効にした場合、Google Pay は除外されます。

Checkout の Stripe 上のオンラインページでは、Apple Pay や Google Pay を有効にするために実装内容を変更する必要はありません。Stripe は、これらの決済を他のカード決済と同じように処理します。

エンドポイントを確認する

ウェブサーバー (localhost:4242 など) を起動し、次のコマンドを実行して、エンドポイントがアクセス可能であることを確認します。

Command Line
curl -X POST -is "http://localhost:4242/create-checkout-session" -d ""

端末に次のようなレスポンスが表示されます。

Command Line
HTTP/1.1 303 See Other
Location: https://checkout.stripe.com/c/pay/cs_test_...
...

テスト

これで、顧客を Stripe Checkout にリダイレクトする決済ボタンが使用できるようになりました。

  1. 決済ボタンをクリックします。
  2. Stripe Checkout 支払いフォームにリダイレクトされます。

構築したシステムが機能しない場合:

  1. ブラウザの開発者ツールでネットワークタブを開きます。
  2. 決済ボタンをクリックし、サーバー側エンドポイント (POST /create-checkout-session) に XHR リクエストが送信されたことを確認します。
  3. リクエストが 200 ステータスを返すことを確認します。
  4. ボタンクリックリスナー内で console.log(session) を使用し、正しいデータが返されたことを確認します。

成功ページを表示する
クライアント側
サーバー側

顧客が決済フォームを無事に送信したら、成功ページを表示することが重要です。この成功ページはお客様のサイトでホストします。

以下のように、最小限の成功ページを作成します。

success.html
<html>
  <head><title>Thanks for your order!</title></head>
  <body>
    <h1>Thanks for your order!</h1>
    <p>
      We appreciate your business!
      If you have any questions, please email
      <a href="mailto:orders@example.com">orders@example.com</a>.
    </p>
  </body>
</html>

次に、この新しいページを使用するように Checkout セッション作成エンドポイントを更新します。

Command Line
curl https://api.stripe.com/v1/checkout/sessions \
  -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:" \
  -d "line_items[0][price_data][currency]"=usd \
  -d "line_items[0][price_data][product_data][name]"=T-shirt \
  -d "line_items[0][price_data][unit_amount]"=2000 \
  -d "line_items[0][quantity]"=1 \
  -d mode=payment \
  --data-urlencode success_url="http://localhost:4242/success.html" \
  --data-urlencode cancel_url="http://localhost:4242/cancel.html"

注

成功ページのカスタマイズをご希望の場合、成功ページをカスタマイズするを参照してください。

テストする

  1. 決済ボタンをクリックします。
  2. テストカード情報を使用して支払い情報を入力します。
    • カード番号として 4242 4242 4242 4242 を入力します。
    • カードの有効期限として任意の将来の日付を入力します。
    • 任意の 3 桁のセキュリティーコードを入力します。
    • 請求先の任意の郵便番号を入力します。
  3. 支払う をクリックします。
  4. 新しい成功ページにリダイレクトされます。

次に、Stripe ダッシュボードで新しい支払いを探します。成功した支払いは、ダッシュボードの支払いリストに表示されます。支払いをクリックすると、その支払いの詳細ページに移動します。Checkout サマリーセクションには、請求先情報と購入されたアイテムのリストが含まれ、これを使用して手動で注文のフルフィルメントを実行できます。

支払い後のイベントを処理する

顧客が Checkout セッションの支払いを完了すると、Stripe は checkout.session.completed イベントを送信します。ダッシュボードの Webhook ツールを使用するか、Webhook ガイドに従ってこれらのイベントを受信して処理します。これにより、次のアクションがトリガーされます。

  • 顧客に注文確認メールを送信します。
  • 取引をデータベースに記録します。
  • 配送ワークフローを開始します。

顧客がリダイレクトされ、ウェブサイトに戻るのを待たずに、これらのイベントはリッスンできます。Checkout のランディングページからのみフルフィルメントをトリガーする場合、確実性に欠けます。非同期型のイベントをリッスンするようシステムを設定すると、1 回の実装で異なるタイプの決済手段を受け付けられるようになります。

詳しくは、Checkout のフルフィルメントガイドをご覧ください。

Checkout で支払いを回収する際には、以下のイベントを処理します。

イベント説明アクション
checkout.session.completed顧客が Checkout セッションを正常に完了すると送信されます。注文確認書を顧客に送信し、注文のフルフィルメントを実行します。
checkout.session.async_payment_succeededACH Direct Debt など、遅延型の決済手段による支払いが成功した場合に送信されます。注文確認書を顧客に送信し、注文のフルフィルメントを実行します。
checkout.session.async_payment_failedACH Direct Debt など、遅延型の決済手段による支払いが失敗した場合に送信されます。顧客に失敗を通知して、顧客をオンセッションに戻し、支払いを再試行できるようにします。

導入をテストする

Stripe がオンラインで提供する決済フォームの導入をテストするには、以下の手順を使用します。

  1. Checkout セッションを作成します。
  2. 次の表の方法を使用して、支払い詳細を入力します。
    • カードの有効期限として任意の将来の日付を入力します。
    • 任意の 3 桁のセキュリティコードを入力します。
    • 請求先の任意の郵便番号を入力します。
  3. 支払うをクリックします。指定した success_url にリダイレクトされます。
  4. ダッシュボードに移動し、取引ページで支払いを探します。支払いが成功していると、そのリストに表示されます。
  5. 支払いをクリックすると詳細が表示され、請求先情報と購入されたアイテムのリストが含まれた Checkout サマリーなどを確認できます。これを使用して注文のフルフィルメントを実行できます。

詳細は、実装のテストをご覧ください。

カード番号シナリオテスト方法
カード支払いは成功し、認証は必要とされません。クレジットカード番号と、任意の有効期限、セキュリティコード、郵便番号を使用してクレジットカードフォームに入力します。
カード支払いには認証が必要です。クレジットカード番号と、任意の有効期限、セキュリティコード、郵便番号を使用してクレジットカードフォームに入力します。
カードは、insufficient_funds などの拒否コードで拒否されます。クレジットカード番号と、任意の有効期限、セキュリティコード、郵便番号を使用してクレジットカードフォームに入力します。
UnionPay カードは、13 ～ 19 桁の可変長です。クレジットカード番号と、任意の有効期限、セキュリティコード、郵便番号を使用してクレジットカードフォームに入力します。

実装内容をテストするためのその他の情報については、テストをご覧ください。

テストカード

番号説明
支払いが成功し、すぐに処理されます。
支払いの成功には 3D セキュア 2 認証が必要です。
常に支払い拒否コード insufficient_funds で失敗します。

参照情報

このページはお役に立ちましたか。
はいいいえ
お困りのことがございましたら 、サポートにお問い合わせください。
早期アクセスプログラムにご参加ください。
変更ログをご覧ください。
ご不明な点がございましたら、お問い合わせください。
LLM ですか？llms.txt を読んでください。
Powered by Markdoc
Code quickstart
関連ガイド
Elements Appearance API
その他の決済シナリオ
カードの仕組み
使用製品
Payments
Elements
Checkout