Я использую expressjs с sapper/svelte спереди.
Я пытаюсь использовать API-интерфейс Stripe SetupIntent и stripe.confirmCardSetup, чтобы сохранить данные карты и привязать ее к клиенту для будущих платежей. Я считаю, что после прочтения документации я понимаю ход процесса, и мой код основан на их примере из раздела пользовательского потока платежей
После отправки формы кредитной карты я ничего не получаю. Нет карты, прикрепленной к клиенту, нет вывода журнала консоли и нет ошибок в моем приложении. setupIntent успешно создан, и я могу просмотреть его на своей панели инструментов Stripe, но карта (paymentMethod) не создана и не привязана к клиенту. Вот мои шаги:
1- When a user create an account, I create a customer in stripe and
save the stripe customer's id in my db
2- I use that stripe customerid to create a setupIntent on the server
const intent = stripe.setupIntents.create({
customer: customer
}).then(intent => {
return res.end(JSON.stringify({ info: intent.client_secret }));
});
На данном этапе мне нужен client_secret, чтобы использовать его на передней панели с элементом карты, чтобы безопасно отправить данные карты в полосу. Я подтверждаю, что setupIntent действительно находится на моей панели инструментов Stripe. Так что эта часть в порядке.
Теперь к передней части моего кода:
Я получаю client_secret в начале своего приложения и использую stripe.js для сбора и отправки данных карты, которые будут прикреплены к клиенту в качестве метода оплаты (который client_secret имеет customer.id), поэтому код:
let clientsecret
let stripe = null
let cardelement = null
stripe = await loadStripe('pk_test_mykeys');
var elements = await stripe.elements();
cardelement = await elements.create('card');
cardelement.on('ready', ()=>{});
cardelement.on('change', ({error}) => {
const displayError = document.getElementById('card-errors');
if (error) {
displayError.textContent = error.message;
} else {
displayError.textContent = '';
}
}); //end of card.on fn
cardelement.mount("#card-element");
return{
stripe : stripe,
cardelement : cardelement
}
function clickhandle(){
stripe = stripe
stripe.confirmCardSetup( csec , {
payment_method: {
card: cardelement,
billing_details: { user : "testing setupIntent"
}
},
setup_future_usage : 'on_session'
})
.then(function(result) {
if (result.error) {
console.info("there is an error")
}
if (result.setupIntent){
console.info("here is the setupintent success result")
}
});
}
Stripe.js работает, потому что я протестировал платежное намерение и списание средств с кредитной карты в другой части приложения, а выполненные платежи отображаются на панели управления полосой, поэтому это не скрипт stripe.js.
Правилен ли мой технологический процесс? Используйте полосатый идентификатор клиента для создания setupIntent на моем сервере, а на лицевой стороне приведенный выше код, который собирает данные карты и отправляет его с помощью stripe.confirmCardSetup, который будет прикреплять данные платежного метода/карты к клиенту из setupIntent client_secret?
Любая помощь будет оценена, поскольку я прочитал документацию, и она ясна и проста. Я следовал этому шаг за шагом. Что мне не хватает?
Правильный процесс описан здесь: https://stripe.com/docs/payments/save-and-reuse#web-create-setup-intent и вы делаете что-то немного другое, что может вызывать некоторые проблемы .
Я подозреваю, что ваше включение future_usage
- , которое на самом деле не является параметром для этого вызова функции , вероятно, является проблемой.
Прочитав комментарии @floatingLomas, я вернулся и снова внимательно прочитал документацию. Вот вопросы, которые необходимо прояснить:
1- форма, в которую вы будете монтировать #card-elements, должна включать client_secret, будь то в скрытом поле или с использованием атрибута data-. читайте здесь, если не знаете об этом
Итак --обратите внимание на атрибут data-secret -- теперь мой код формы:
<form data-secret = {customersecret} on:submit = {stripehandle} id = "payment-form">
<label for = "card-element">Enter Your Credit Card Details:</label>
<div id = "card-element"></div>
<div id = "card-errors" role = "alert"></div>
<button id = "submit">Pay -svelte2 component</button>
</form>
2- удалите future_usage, как предложил @floatingLomas. Правильным параметром является «Использование»: «on_session», потому что future_usage предназначен для API-интерфейса paymentMethod, а не для API-интерфейса setupIntent.
3- Неверный параметр billing_details: { "user" : "testing setupIntent" }. API имеет параметр для имени, телефона, адреса, но не для пользователя;)
Таким образом, код подтвержденияCardSetup() выглядит следующим образом:
stripe.confirmCardSetup( csec , {
payment_method: {
card: cardelement,
billing_details: { "name" : "testing setupIntent" }
}
})
.then(function(result) {
console.info("result :", result)
})
Рад, что у вас все получилось; хотел бы, чтобы мой ответ был принят, так как он сработал. :)
;) Сделанный. Еще раз спасибо.
Спасибо. Я проверю свой код и исправлю все несоответствия. Я отчитаюсь о результатах.