我在发送数据时遇到了问题,在本例中是关于送货地址、购买的产品、购买日期、进行此购买的用户。我在何时以及如何发送此数据方面遇到了问题?我使用Stripe API来实现支付,一切正常用户在Stripe链接上与其会话重定向,并根据他的购物车中的项目支付.但我的结帐数据丢失.理想的情况是,当条纹确认购买,从而重定向成功的网址,这是情况,以及引用的数据被转移.所以我有这个代码:
HTML checkout
<div class="form">
<p class="text">Adresse de livraison</p>
<input type="text" id="address" placeholder="adresse">
<div class="two-input-container">
<input type="text" id="city" placeholder="ville">
<input type="number" id="state" placeholder="code postale">
</div>
<input type="text" id="landmark" placeholder="informations complémentaire">
</div>
检出JS
window.onload = () => {
if(!sessionStorage.user){
location.replace('/login')
}
if(location.search.includes('payment=done')){
let items = [];
localStorage.setItem('cart', JSON.stringify(items));
showFormError("order is placed");
}
if(location.search.includes('payment_fail=true')){
showFormError("Une erreur est survenue, merci de réessayer");
}
}
// select place order button
const placeOrderBtn = document.querySelector('.place-order-btn');
const getAddress = () => {
// form validation
let address = document.querySelector('#address').value;
let city = document.querySelector('#city').value;
let state = document.querySelector('#state').value;
let landmark = document.querySelector('#landmark').value;
if(!address.length || !city.length || !state.length){
return showFormError("Remplisser tous les champs");
} else{
return { address, city, state, landmark }
}
}
placeOrderBtn.addEventListener('click', () => {
let cart = JSON.parse(localStorage.getItem('cart'));
if(cart == null || !cart.length){
return showFormError("Vous commander aucun article");
}
else{
let address = getAddress();
if(address.address.length){
// send data to backend
fetch('/stipe-checkout', {
method: 'post',
headers: new Headers({'Content-Type': 'application/json'}),
body: JSON.stringify({
items: JSON.parse(localStorage.getItem('cart')),
address: address,
email: JSON.parse(sessionStorage.user).email
})
})
.then(res => res.json())
.then(url => {
location.href = url;
})
.catch(err => console.log(err))
}
}
})
服务器索引. JS
// stripe payment
let stripeGateway = stripe(process.env.stripe_key);
let DOMAIN = process.env.DOMAIN;
app.post('/stipe-checkout', async (req, res) => {
const session = await stripeGateway.checkout.sessions.create({
payment_method_types: ["card"],
mode: "payment",
success_url: `${DOMAIN}/success?session_id={CHECKOUT_SESSION_ID}&order=${JSON.stringify(req.body)}`,
cancel_url: `${DOMAIN}/checkout?payment_fail=true`,
line_items: req.body.items.map(item => {
return {
price_data: {
currency: "eur",
product_data: {
name: item.name,
description: item.shortDes,
images: item.images
},
unit_amount: item.price * 100
},
quantity: item.item
}
})
})
res.json(session.url)
})
app.get('/success', async (req, res) => {
let { order, session_id } = req.query;
try{
const session = await stripeGateway.checkout.sessions.retrieve(session_id);
const customer = await stripeGateway.customers.retrieve(session.customer);
let date = new Date();
let orders_collection = collection(db, "orders");
let docName = `${customer.email}-order-${date.getTime()}`;
setDoc(doc(orders_collection, docName), JSON.parse(order))
.then(data => {
res.redirect('/checkout?payment=done')
})
} catch{
res.redirect("/404");
}
})
我曾试图发送它之前,但事实上,如果有人点击按钮,重定向到条纹确认页面,他交付的数据,将被存储,即使他不确认他的购买。
1条答案
按热度按时间von4xj4u1#
那么,当您的客户触发重定向到Stripe Checkout时,您要保留的地址数据是否存在于
app.post('/stripe-checkout'
的req
变量中?在这种情况下,您可以在
payment_intent_data.shipping
参数中创建结帐会话时包括此数据。然后,此数据将存储在结帐创建的付款意向的shipping
属性中。您可以在检索结帐会话时获取此数据(server-side或客户端),方法是在Expand参数中传递payment_intent
,并查看Checkout会话对象上的payment_intent.shipping.address
属性。或者,您 * 可以 * 让Checkout Session自己为您收集送货地址信息。这会将地址存储在
shipping_details.address
属性中。为了确保您的集成能够获取客户的地址信息,我建议您将集成配置为侦听
checkout.session.completed
webhook。这样,即使客户无法重定向回您的站点,您的后端代码仍能够获取地址信息。