在 Stripe / Checkout 中预填充电子邮件地址答案

【问题标题】：Pre-populating an email address in Stripe / Checkout在 Stripe / Checkout 中预填充电子邮件地址
【发布时间】：2016-06-28 14:30:32
【问题描述】：

我在网站上使用Stripe / Checkout 来接受付款。 Stripe 使用这种方式相当简单，因为它们提供了以下脚本以嵌入网页：

<form id="monthly" action="/subscribe" method="POST">
  <script
    src="https://checkout.stripe.com/checkout.js" class="stripe-button"
    data-key="pk_test_xxxxxxxxx"
    data-image="http://mywebsite.com/assets/img/logo_raw.png"
    data-name="My Website"
    data-description="Monthly Subscription"
    data-amount="6900"
    data-email="email@example.com"
    data-allow-remember-me=false
    data-label="Subscribe" >
  </script>
</form>

我希望能够使用我在 custom.js jQuery 脚本中的变量预先填充电子邮件地址值 (data-email="email@example.com")。我精通 jQuery，但是我可以用 jQuery 修改这个嵌入的脚本吗？

【问题讨论】：

标签： javascript jquery stripe-payments

【解决方案1】：

您需要使用custom integration，并执行以下操作：

<script src="https://checkout.stripe.com/checkout.js"></script>

<button id="customButton">Purchase</button>

<script>
  var email = "customer@example.com"; // or use jQuery to dynamically populate the variable

  var handler = StripeCheckout.configure({
    key: 'pk_test_...',
    image: 'https://stripe.com/img/documentation/checkout/marketplace.png',
    locale: 'auto',
    token: function(token) {
      // You can access the token ID with `token.id`.
      // Get the token ID to your server-side code for use.
    }
  });

  $('#customButton').on('click', function(e) {
    // Open Checkout with further options:
    handler.open({
      name: 'Stripe.com',
      description: '2 widgets',
      amount: 2000,
      email: email
    });
    e.preventDefault();
  });

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

【讨论】：

完美！谢谢你。我什至没有看自定义集成。
我现在遇到的问题是使用自定义集成增加了复杂性。结帐设置很简单：我需要做的就是在表单的“操作”部分提供回调。看起来使用自定义脚本，我需要在服务器端做更多的工作。
使用简单与自定义集成不应改变任何服务器端。自定义集成只允许您在 JavaScript 中调用 Checkout 而不是使用 HTML 标记，并允许您定义自己的回调以使用生成的令牌执行您想要的操作。
如何从自定义结帐表单中删除电子邮件字段
@Coder 你不能。您可以像上面解释的那样传递一个值，这会将字段转换为固定标签，或者让用户自己填写字段，但不可能完全删除该字段。

【解决方案2】：

data-email="email@example.com"

如问题中所述，现在可以使用。

【讨论】：