Токен карты Stripe не отправляется в запросе POST - PullRequest
0 голосов
/ 29 октября 2018

Эта проблема заставляла меня бегать по кругу часами подряд.

Вот мой 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. Меня поражает, что на моем локальном веб-сервере все работало идеально, но когда я перенес код на мой новый удаленный сервер Linux, возникла эта проблема. Я не изменил код вообще . Возможно, я установил на свой локальный сервер что-то, что не установил на своем новом сервере Linux, что мне нужно для работы полосы? Я понятия не имею. Одна вещь, которая изменилась на тот случай, если это имеет значение, это то, что мой локальный сервер работает под управлением Debian (где работал платежный шлюз), а мой удаленный сервер работает под управлением CentOS (где платежный шлюз не работает).

Несколько вещей, которые, я думаю, не имеют отношения к проблеме:

  • Мой удаленный сервер и localhost работали по HTTP, а не по HTTPS, однако я использую тестовый API Stripe, где не имеет значения, не используете ли вы HTTPS
  • Токен наверняка создан, я знаю это, потому что могу зайти на свою панель мониторинга Stripe и посмотреть журналы запроса от моего сервера и ответа от серверов Stripe. Серверы Stripe определенно отвечают маркерным объектом.

Вот реальное тело ответа, которое серверы Stripe отправили обратно в ответ на один из моих запросов (где идентификатор токена не захватывается и по какой-то причине отправляется в запросе 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
}

Я буду очень признателен за любую помощь, которую смогу получить.

1 Ответ

0 голосов
/ 29 октября 2018

Поэтому, когда я фактически выполняю ваш код на JSFiddle (https://jsfiddle.net/jhx0tpgd/),), я вижу, что на самом деле создается токен и , прикрепленный к форме как скрытый <input> - элемент с name="stripeToken". Это говорит о том, что он на самом деле отправляется вместе с формой, однако ваш бэкэнд неправильно его анализирует. Не хотите обновить его с помощью своего бэкэнд-кода?

Code Result

...