POST请求中未发送条纹卡令牌

Question

这个问题使我的头脑连续几个小时运转。

这是我的charge.js（当然它也包含在我的页面中）-

var stripe = Stripe('pk_test_CFDzAKw1Ez7vYVppjhP0EHLj');

// Create an instance of Elements.
var elements = stripe.elements();

// Custom styling can be passed to options when creating an Element.
// (Note that this demo uses a wider set of styles than the guide below.)
var style = {
  base: {
    color: '#32325d',
    lineHeight: '18px',
    fontFamily: '"Helvetica Neue", Helvetica, sans-serif',
    fontSmoothing: 'antialiased',
    fontSize: '16px',
    '::placeholder': {
      color: '#aab7c4'
    }
  },
  invalid: {
    color: '#fa755a',
    iconColor: '#fa755a'
  }
};

// Create an instance of the card Element.
var cardNumberElement = elements.create('cardNumber', {
  style: style,
  placeholder: '0000 0000 0000 0000',
});
cardNumberElement.mount('#card-number-element');

var cardExpiryElement = elements.create('cardExpiry', {
  style: style,
  placeholder: 'MM/YY',
});
cardExpiryElement.mount('#card-expiry-element');

var cardCvcElement = elements.create('cardCvc', {
  style: style,
  placeholder: '123',
});
cardCvcElement.mount('#card-cvc-element');

// Handle real-time validation errors from the card Element.
cardNumberElement.addEventListener('change', function(event) {
  var displayError = document.getElementById('card-errors');
  if (event.error) {
    displayError.textContent = event.error.message;
  } else {
    displayError.textContent = '';
  }
});

// Handle form submission.
document.querySelector('form').addEventListener('submit', function(e) {
  e.preventDefault();
  var options = {
    address_zip: document.getElementById('postal-code').value,
  };

  stripe.createToken(cardNumberElement,cardExpiryElement,cardCvcElement,     options).then(function(result) {
if (result.error) {
  // Inform the user if there was an error.
  var errorElement = document.getElementById('card-errors');
  errorElement.textContent = result.error.message;
} else {
  // Send the token to your server.
  stripeTokenHandler(result.token);

}
  });
});

    function stripeTokenHandler(token) {
        // Insert the token ID into the form so it gets submitted to the     server
    var form = document.getElementById('payment-form');

// Add Stripe Token to hidden input
    var hiddenInput = document.createElement('input');
    hiddenInput.setAttribute('type', 'hidden');
hiddenInput.setAttribute('name', 'stripeToken');
hiddenInput.setAttribute('value', token.id);
form.appendChild(hiddenInput);

// Submit form
    form.submit();
}

这是我的付款表格-

<form action="purchase.php?p='.$_GET["p"].'" method="post" id="payment-form" style="width:100%">
  <div class="form-group">
      <label>
        <span>Card number</span><br>
        <div id="card-number-element" class="field" style="width:185px"></div>
      </label><br>
      <label>
        <span>Expiry date</span><br>
        <div id="card-expiry-element" class="field" style="width:80px"></div>
      </label><br>
      <label>
        <span>CVC</span><br>
        <div id="card-cvc-element" class="field" style="width:60px"></div>
      </label><br>
      <label>
        <span>Billing ZIP/Postal</span><br>
        <input id="postal-code" maxlength="12" name="postal_code" class="field" placeholder="00000" style="color: #32325d;
    lineHeight: 18px;
    fontFamily: \'Helvetica Neue\', Helvetica, sans-serif;
    fontSmoothing: antialiased;
    fontSize: 16px;
    width:70px;"/>
      </label>
    <div id="card-errors" role="alert" style="width:100%"></div>
<input type="checkbox" class="form-check-input" name="agree" value="True" onchange="document.getElementById(\'myButton\').disabled = !this.checked;">
                  <label class="form-check-label" for="gdpr">I have read and I agree to the <a href="tos.php" >Terms of Service</a> and <a href="privacy.php">Privacy Policy</a> and I agree that I am at least 18 years old. I agree to be billed $0.99 now and then after the 24-hour trial period has ended, I agree to be billed $9.99 every month until this subscription is cancelled (unless I cancel my subscription before the trial period is over). I understand that I can cancel my subscription any time by nagivating to my account page and selecting the "Cancel Subscription" tab.</label>
  </div>
  <button type="submit" id="myButton" disabled="disabled" href="#" class="btn btn-lg btn-success" style="background-image: linear-gradient(to right, #00cc00, #009900); text-shadow: 2px 2px 2px #004d00; border: 0px solid;box-shadow: 3px 3px 5px #989898;" action="purchase.php?p='.$_GET['p'].'" >Submit Payment</a>
</form>

确切的问题是，在用户提交付款表格后，确实存在一个POST请求提交回我的服务器，但是POST请求中不包含stripeToken。 令我感到困惑的是，这在我的本地主机Web服务器上运行得很好，但是当我将代码转移到新的远程linux服务器上时，出现了这个问题。 我根本不修改代码。 也许我在本地服务器上安装了一些我尚未安装的新服务器，但我需要使条纹工作吗？ 我不知道。 万一发生问题，确实发生了更改，这是因为我的本地服务器正在运行Debian（付款网关正在运行），而远程服务器正在运行CentOS（付款网关不在工作）。

我认为与该问题无关的几件事：

• 我的远程服务器和本地主机都运行在HTTP而非HTTPS上，但是我使用的是Stripe的测试API，如果您不使用HTTPS则无所谓
• 令牌肯定是被创建的，我知道这一点，因为我可以转到Stripe仪表板，查看来自服务器的请求日志和来自Stripe服务器的响应日志。 Stripe的服务器肯定在响应令牌对象。

这是Stripe的服务器响应我的一个请求而发送回的真实响应主体（由于某种原因，令牌ID未被捕获并在POST请求中发送给我的服务器）-

{
  "id": "tok_1DQL4bIAEZ0ObfZBhoVoU1T4",
  "object": "token",
  "card": {
    "id": "card_1DQL4aIAEZ0ObfZBDSWbPhrb",
    "object": "card",
    "address_city": null,
    "address_country": null,
    "address_line1": null,
    "address_line1_check": null,
    "address_line2": null,
    "address_state": null,
    "address_zip": null,
    "address_zip_check": null,
    "brand": "Visa",
    "country": "US",
    "cvc_check": "unchecked",
    "dynamic_last4": null,
    "exp_month": 4,
    "exp_year": 2024,
    "funding": "credit",
    "last4": "4242",
    "metadata": {
    },
    "name": null,
    "tokenization_method": null
  },
  "client_ip": "x.x.x.x",
  "created": 1540759285,
  "livemode": false,
  "type": "card",
  "used": false
}

我将不胜感激我能得到的任何帮助。

Answer 1

所以，当我真正在的jsfiddle（执行代码https://jsfiddle.net/jhx0tpgd/ ），我可以看到，其实也有越来越创建并连接到形式隐藏令牌<input> -元素与name="stripeToken" 。 这表明它实际上是与表格一起提交的； 但是，您的后端无法正确解析。 想要使用您的一些后端代码来更新它吗？