コンテンツにスキップ
アカウント作成/サインイン
Stripe ドキュメントのロゴ
/
アカウントを作成サインイン
概要構築済みのシステムをアップグレード
オンライン決済
概要ユースケースを見つけるManaged Payments を使用する
Elements を使用したカスタム統合の構築
対面決済
決済手段
決済シナリオ
決済以外の機能

項目の数量を調整可能にする

顧客が Checkout 時に項目の数量を調整できるようにする方法をご紹介します。

各 Checkout Session の項目は、顧客が購入した商品を追跡します。顧客が Checkout 時に項目の数量を調整できるように Checkout Session を設定できます。

Payment Intents API

Payment Intents API を使用する場合は、項目の更新を手動でトラッキングして決済金額を変更するか、金額を調整した新しい PaymentIntent を作成する必要があります。

数量の調整を有効にする
サーバー側

メモ

新しい項目の追加など、その他の項目の更新には、この実装は対応していません。

Checkout Session を作成する際、line_items に adjustable_quantity を設定して、顧客が Checkout 時に項目の数量を更新できるようにします。

Command Line
cURL
Stripe CLI
Ruby
Python
PHP
Java
Node.js
Go
.NET
No results
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 "line_items[0][adjustable_quantity][enabled]"=true \
  -d "line_items[0][adjustable_quantity][maximum]"=100 \
  -d "line_items[0][adjustable_quantity][minimum]"=0 \
  -d mode=payment \
  -d ui_mode=custom \
  -d return_url={{RETURN_URL}}

adjustable_quantity.minimum と adjustable_quantity.maximum を設定することにより、指定できる最小 / 最大数量のデフォルト設定をカスタマイズできます。デフォルトでは、項目の調整可能な最小数量は 0、調整可能な最大数量は 99 です。adjustable_quantity.maximum には最大 999999 の値を指定できます。

Checkout では、項目が残り 1 つの場合、顧客はそれを削除できません。

項目の数量を更新する
クライアント側

数量を増やすボタンが押された場合など、顧客の操作に応じて項目の数量を変更するには、updateLineItemQuantity を使用します。項目 ID と新しい数量を渡します。

index.html
<button class="increment-quantity-button" data-line-item="{{line item ID}}">+</button>
checkout.js
const checkout = stripe.initCheckout({clientSecret});
const button = document.querySelector('.increment-quantity-button');
const lineItem = button.getAttribute("data-line-item");
checkout.loadActions().then((loadActionsResult) => {
  if (loadActionsResult.type === 'success') {
    const {actions} = loadActionsResult;
    const session = loadActionsResult.getSession();
    const quantity = session.lineItems.find((li) => li.id === lineItem).quantity;
    button.addEventListener('click', () => {
      actions.updateLineItemQuantity({
        lineItem,
        quantity: quantity + 1,
      })
    });
  } else {
    const {error} = loadActionsResult;
  }
});

完了した取引を処理する
サーバー側

支払いが完了したら、確定済みの項目とその数量に対するリクエストを作成できます。顧客が項目を削除した場合、項目のレスポンスからも削除されます。完了済みの Checkout セッションを処理するイベントハンドラの作成方法については、フルフィルメントガイドをご覧ください。

メモ

イベントハンドラをテストするには、Stripe CLI をインストールし、stripe listen --forward-to localhost:4242/webhook を使用してイベントをローカルサーバーに転送します。

Ruby
Python
PHP
Java
Node.js
Go
.NET
No results
# 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"


require 'sinatra'

# You can find your endpoint's secret in your webhook settings
endpoint_secret = 'whsec_...'

post '/webhook' do
  event = nil

  # Verify webhook signature and extract the event
  # See https://stripe.com/docs/webhooks#verify-events for more information.
  begin
    sig_header = request.env['HTTP_STRIPE_SIGNATURE']
    payload = request.body.read
    event = Stripe::Webhook.construct_event(payload, sig_header, endpoint_secret)
  rescue JSON::ParserError => e
    # Invalid payload
    return status 400
  rescue Stripe::SignatureVerificationError => e
    # Invalid signature
    return status 400
  end

  if event['type'] == 'checkout.session.completed'
    checkout_session = event['data']['object']

    line_items = Stripe::Checkout::Session.list_line_items(checkout_session['id'], {limit: 100})

    # Fulfill the purchase...
    begin
      fulfill_order(checkout_session, line_items)
    rescue NotImplementedError => e
      return status 400
    end
  end

  status 200
end

def fulfill_order(checkout_session, line_items)
  # TODO: Remove error and implement...
  raise NotImplementedError.new(<<~MSG)
    Given the Checkout Session "#{checkout_session.id}" load your internal order from the database here.
    Then you can reconcile your order's quantities with the final line item quantity purchased. You can use `checkout_session.metadata` and `price.metadata` to store and later reference your internal order and item ids.
  MSG
end
このページはお役に立ちましたか。
はいいいえ