【问题标题】:Stripe connect payment token generating token not completing transaction for test mode wtih charge条纹连接支付令牌生成令牌未完成测试模式的交易并收费
【发布时间】:2018-11-02 05:25:17
【问题描述】:

我正在使用 Stripe Connect 支付网关,我想将自定义值发送到结帐表单,因为我使用了带有支付按钮的 js 元素条带。在条带连接仪表板中,它显示 v1/token 并且没有显示测试模式的支付。如何我可以用这个 js 元素为直播和直播模式调用充电方法吗?

<script src="https://js.stripe.com/v3/"></script>
<form>
<div class="form-group">
    <h2 class="heading">Schedule Course</h2>

    <label for="name">Tutor Name: </label>
    <input type="text" name="selectedTutor" value="<?php echo $tutorName;?>" required>
   <label for="phone">Subject</label>
    <input type="text" name="slectedSubject" value="<?php echo get_user_meta($userId, 'userinfo' , true );?>" id="selectedSubject" required>
   <label for="email">Booking Dates</label>
    <input type="text" name="slectedDates" value="" id="selectedAppointment" required>
<label for="email">Price</label>
    <input type="text" name="slectedDates" value="<?php echo get_user_meta( $userId, 'price_individualcourse' , true);?>" id="selectedAppointment" required>
<label>
    <input name="cardholder-name" class="field is-empty" placeholder="Jane Doe" />
    <span><span>Name</span></span>
  </label>

  <label>
    <div id="card-element" class="field is-empty"></div>
    <span><span>Credit or debit card</span></span>
  </label>
  <button type="submit">Pay <?php echo get_user_meta( $userId, 'price_individualcourse' , true);?></button>
  <div class="outcome">
    <div class="error" role="alert"></div>
    <div class="success">
      Success! Your Stripe token is <span class="token"></span>
    </div>
  </div>
</form>
<script>
var stripe = Stripe('pk_test_uFOdE1YPIXhbssFt1FwH9RGQ');
var elements = stripe.elements();
var card = elements.create('card', {
  iconStyle: 'solid',
  style: {
    base: {
      iconColor: '#8898AA',
      color: 'black',
      lineHeight: '36px',
      fontWeight: 300,
      fontFamily: '"Helvetica Neue", Helvetica, sans-serif',
      fontSize: '19px',

      '::placeholder': {
        color: '#8898AA',
      },
    },
    invalid: {
      iconColor: '#e85746',
      color: '#e85746',
    }
  },
  classes: {
    focus: 'is-focused',
    empty: 'is-empty',
  },
});
card.mount('#card-element');

var inputs = document.querySelectorAll('input.field');
Array.prototype.forEach.call(inputs, function(input) {
  input.addEventListener('focus', function() {
    input.classList.add('is-focused');
  });
  input.addEventListener('blur', function() {
    input.classList.remove('is-focused');
  });
  input.addEventListener('keyup', function() {
    if (input.value.length === 0) {
      input.classList.add('is-empty');
    } else {
      input.classList.remove('is-empty');
    }
  });
});

function setOutcome(result) {
  var successElement = document.querySelector('.success');
  var errorElement = document.querySelector('.error');
  successElement.classList.remove('visible');
  errorElement.classList.remove('visible');

  if (result.token) {

    successElement.querySelector('.token').textContent = result.token.id;
    successElement.classList.add('visible');
  } else if (result.error) {
    errorElement.textContent = result.error.message;
    errorElement.classList.add('visible');
  }
}

card.on('change', function(event) {
  setOutcome(event);
});

document.querySelector('form').addEventListener('submit', function(e) {
  e.preventDefault();
  var form = document.querySelector('form');
  var extraDetails = {
    name: form.querySelector('input[name=cardholder-name]').value,
  };
  stripe.createToken(card, extraDetails).then(setOutcome);
});
 </script>

【问题讨论】:

    标签: php wordpress stripe-payments stripe-connect


    【解决方案1】:

    Stripe Elements 仅收集付款信息并返回给您一个令牌,它不会从卡中收取费用。您需要将令牌从 setOutcome 函数内部传递到后端 PHP 脚本并在那里调用 Stripe API 来创建费用。

    您可以查看 Stripe 文档,了解与 Checkout 的端到端 PHP 集成:https://stripe.com/docs/checkout/php,这将为您指明如何将付款表单数据传回服务器的正确方向。

    【讨论】:

      猜你喜欢
      • 2016-11-27
      • 2022-06-24
      • 2018-10-21
      • 1970-01-01
      • 2015-03-10
      • 2020-12-24
      • 2021-10-03
      • 2021-08-22
      • 2018-12-30
      相关资源
      最近更新 更多