我正在react native中为firebase实现一个带有Stripe扩展的支付系统。然而，我不知道在以下情况下该如何表现：
- 当用户想要进行签出时，我为checkout_session编写初始信息：
const initializeCheckout = () => {
//write initial payment data
const writePaymentDetails = async () => {
await setDoc(doc(getFirestore(), 'customers', getAuth().currentUser.uid, 'checkout_sessions', getAuth().currentUser.uid),{
client: 'mobile',
mode: 'payment',
amount: subTotal,
currency: 'chf',
});
}
writePaymentDetails();
navigation.navigate('Checkout');
}-
之后，firebase中的条带扩展将所有附加信息(临时密钥、条带客户密钥等(添加到checkout_session文档中。
-
在写入额外的数据后，我想导航到结账页面，然后初始化并在react native中打开paymentSheet，如官方条纹教程中所示
我实现的结账屏幕：
export default function CheckoutScreen() {
const { initPaymentSheet, presentPaymentSheet } = useStripe();
const [loading, setLoading] = useState(false);
const fetchPaymentSheetParams = async () => {
console.log('still works after calling fetchPaymentSheetParams');
const checkoutSessionDoc = await getDoc(doc(getFirestore(), 'customers', getAuth().currentUser.uid, 'checkout_sessions', getAuth().currentUser.uid));
const paymentIntent = checkoutSessionDoc.data().paymentIntentClientSecret;
const ephemeralKey = checkoutSessionDoc.data().ephemeralKeySecret;
const customer = checkoutSessionDoc.data().customer;
console.log(paymentIntent, ephemeralKey, customer);
return{
paymentIntent: paymentIntent,
ephemeralKey,
customer,
};
};
const initializePaymentSheet = async () => {
const {
paymentIntent,
ephemeralKey,
customer,
} = await fetchPaymentSheetParams();
const { error } = await initPaymentSheet({
customerId: customer,
customerEphemeralKeySecret: ephemeralKey,
paymentIntentClientSecret: paymentIntent,
allowsDelayedPaymentMethods: false,
});
if (!error) {
setLoading(true);
}
};
const openPaymentSheet = async () => {
const { error } = await presentPaymentSheet();
if (error) {
Alert.alert(`Error code: ${error.code}`, error.message);
} else {
Alert.alert('Success', 'Your order is confirmed!');
}
};
useEffect(() => {
console.log('Payment sheet is being initialized');
initializePaymentSheet();
}, []);
return (
<View style={{flex: 1, justifyContent: 'center'}}>
<Button
disabled={loading}
title="Checkout"
onPress={openPaymentSheet}
/>
</View>
);
}然而，我不知道如何等到firebase函数在步骤2中结束后再进入下一步。现在，如果我在写入初始数据后导航到结账屏幕，并尝试读取临时密钥、条纹客户密钥和付款意向，它们是未定义的。
所以，我的问题是如何正确地进行转换，从而使附加信息不被定义？
我用一种麻烦的(很可能(方法解决了这个问题：
我定义了一个快照侦听器，用于检查字段customer、customerEphemeralKeySecret和paymentIntentClientSecret是否已定义，然后才开始初始化付款单。