Я хочу собрать информацию о карте клиентов, а затем сохранить ее, чтобы взимать плату позже, когда они воспользуются моей услугой. Я выполняю те же самые шаги на: https://stripe.com/docs/payments/save-and-reuse, но почему-то застрял на ошибке: «Отсутствует необходимый параметр: payment_method_data [card].»
Мои шаги следующие:
- Клиент создает учетную запись, и эти данные сохраняются в моей базе данных
- Я создаю клиента на Stripe
$stripe_customer = CustomerAlias::create([
'email' => $user->email,
'description' => 'Subscriber',
'name' => $user->name,
'phone' => $user->phone,
]);
- Я создаю намерение установки на Stripe
public function createASetUpIntent($stripe_customer){
$intent = \Stripe\SetupIntent::create([
'customer' => $stripe_customer->id,
'usage' => 'off_session',
]);
return $intent;
}
<form id="setup-form" action="{{ route('completeCardSave') }}" method="post">
<label class="pull-left">Enter your name as it exactly appears on the card</label>
<input id="cardholder-name" type="text" class="form-control" style="text-transform:uppercase">
<input type="hidden" name="client_secret" id="client_secret" value="{{$client_secret}}">
<br>
<label class="pull-left">Enter your card number, expiry and CVC</label>
<div id="card-element"></div>
<button type="submit" style="color: #5533FF !important;" id="card-button">
<span class="save_card_text_span"> Save Card </span>
</button>
</form>
<div class="card_custom_errors">
</div>
- Javascript для установки карты и отправки в Stripe API для подтверждения намерения
var stripe = Stripe('pk_test_my_test_key_goes_here'); // UK
// ADD ELEMENTS TO THE PAGE
// 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',
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 card = elements.create('card', {
hidePostalCode: true,
style: style
});
// Add an instance of the card Element into the `card-element` <div>.
card.mount('#card-element');
// Handle real-time validation errors from the card Element.
card.addEventListener('change', function(event) {
var displayError = document.getElementById('card-errors');
if (event.error) {
displayError.textContent = event.error.message;
} else {
displayError.textContent = '';
}
});
var cardholderName = document.getElementById('cardholder-name');
var cardButton = document.getElementById('card-button');
var clientSecret = document.getElementById('client_secret').value;
var cardElement = document.getElementById('card-element');
cardButton.addEventListener('click', function(ev) {
ev.preventDefault();
stripe.confirmCardSetup(
clientSecret,
{
payment_method: {
card: cardElement,
billing_details: {
name: cardholderName.value,
},
},
}
).then(function(result) {
if (result.error) {
// Display error.message in your UI.
$('.card_custom_errors').css({"display":"block", "color":"red"})
.html("There was an issue saving your card, please contact us at: farmsuite@ujuzikilimo.com");
} else {
// The setup has succeeded. Display a success message.
// Now we can submit the form, which will send an email to the user and redirect to a completion page
// Submit the form
}
});
Проблема здесь в том, что когда я отправляю форму для подтверждения намерения, я получаю сообщение об ошибке : "Отсутствует обязательный параметр: payment_method_data [card]."
Любая помощь будет принята с благодарностью, я не уверен, что я ошибаюсь. Хочу отметить, что мои тестовые ключи верны, поэтому проблема не в этом.