从 GET 参数设置 Stripe 结帐自定义金额

Question

我想不通，只是想将一个值作为 GET 参数传递给结帐页面

这样 https://xxxxxx/?setAmount=200000 确实转到了包含此脚本的页面

<form action="custom action" method="POST">
  <script
  let params = new URLSearchParams(document.location.search.substring(1));
  let amount=params.get(setAmount);
    src="https://checkout.stripe.com/checkout.js" class="stripe-button"
    data-key="pk_test_UUbDY16wDCECOujIs0vQ2vTi"
    data-amount=amount;
    data-name="Company"
    data-description="Widget"
    data-image="https://stripe.com/img/documentation/checkout/marketplace.png"
    data-locale="auto"
    data-zip-code="true"
    data-currency="eur">
  </script>
</form>

结账按钮显示出来了，但是没有获取到amount参数，所以没有定义amount。我无法使用按钮访问托管网站的服务器上的服务器端，因此我需要使用 Podio Globiflow 来回访问另一个网站。

Answer 1

Stripe Checkout 支持两种模式 -- 简单和自定义。自定义允许您使用 javascript 而不是在服务器上设置的数据属性来控制弹出的内容。要获得您想要的行为，您可以这样做：

$('#customButton').on('click', function(e) {
  const params = new URLSearchParams(document.location.search)
  const amountInCents = params.get("amount")
  const displayAmount = parseFloat(amountInCents / 100).toFixed(2);
  // Open Checkout with further options
  handler.open({
    name: 'Demo Site',
    description: 'Custom amount ($' + displayAmount + ')',
    amount: amountInCents,
  });
  e.preventDefault();
});

// Close Checkout on page navigation
$(window).on('popstate', function() {
  handler.close();
});

值得注意的是，此金额对您实际向客户收取的费用没有影响，仅用于显示目的. Checkout 标记卡的详细信息；收取的金额完全由服务器端逻辑控制，如官方 Stripe docs.

中所述

从 GET 参数设置 Stripe 结帐自定义金额

Set Stripe checkout custom amount from GET parameter

stripe-payments

podio