#stefan_code
tribal tinselBOT
Below are links to other discussions we've had with you in the past week in case you want to review that information. If your question is related to one of these previous discussions, please provide a comprehensive summary of the current state and what you need help with now. We help many users simultaneously, so a summary allows us to resolve your issue as soon as possible.
- stefan_code, 20 hours ago, 12 messages
- stefan_code, 1 day ago, 36 messages
- stefan_code, 1 day ago, 14 messages
bright socketBOT
đ Welcome to your new thread!
â˛ď¸ We'll be here soon! We typically respond in a few minutes, but in some cases we might need a bit more time (e.g., server's busy, you've got a complex question, etc.).
âąď¸ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can start a new thread if you have another question.
đ This thread will always be available, even after it's closed. You can find it again using Discord's search, or you can save this link: https://discord.com/channels/841573134531821608/1256169072744202250
đ Have more to share? Add details, code, screenshots, videos, etc. below.
fleet wraith
hi! can you share the complete code?
balmy terrace
expressCheckoutElement.on('confirm', async () => {
const { error: submitError } = await elements.submit();
if (submitError) {
console.log(submitError);
return;
}
// Create a ConfirmationToken using the details collected by the Express Checkout Element
const { error, confirmationToken } = await stripe!.createConfirmationToken({
elements,
params: {
return_url: 'https://bonfi-sk.ngrok.dev/order/123/complete'
}
});
console.log(confirmationToken);
if (error) {
// This point is only reached if there's an immediate error when
// confirming the payment. Show the error to your customer (for example, payment details incomplete)
console.log(error);
return;
}
await this.http.post(environment.apiUrl + '/stripe-checkout/' + checkoutTransactionState.checkoutTransaction?.id + '/express', confirmationToken).toPromise().then((value: any) => {
const { secret: clientSecret } = value;
console.log("------------------------------------------------");
console.log(value);
// Confirm the PaymentIntent
stripe!.confirmPayment({
elements,
stripe!.confirmPayment({
elements,
clientSecret,
confirmParams: {
confirmation_token: confirmationToken.id,
return_url: 'http://localhost:4201/thank-you',
}
}).then(r => {
const {error: confirmError} = r;
if (confirmError) {
// This point is only reached if there's an immediate error when
// confirming the payment. Show the error to your customer (for example, payment details incomplete)
console.log(confirmError);
} else {
// The payment UI automatically closes with a success animation.
// Your customer is redirected to your `return_url`.
}
});
});
});
});
}
fleet wraith
what log lines happen? for example does that console.log("------------------------------------------------"); line get reached?
balmy terrace
fleet wraith
also I think I'd suggest doing const value = await this.http.post(environment.apiUrl + '/stripe-checkout/' + checkoutTransactionState.checkoutTransaction?.id + '/express', confirmationToken).toPromise() instead of the .then() chain, it's easier and might also be related.
balmy terrace
gimme a sec
fleet wraith
can you put the site up somewhere so I can try it in my browser?
balmy terrace
hardly, its targeting my local machine
you have to have something in the cart https://bonfi-sk.ngrok.dev/campaign-2/buy/
fleet wraith
links don't really work for me but I guess that's normal.
anyway what I would say is, start with exactly the code we have on https://docs.stripe.com/elements/express-checkout-element/accept-a-payment#create-ct , i.e. use await, use fetch, and see if that works first.
balmy terrace
why would i use fetch instead of angulars built in functionality?
fleet wraith
or even just hard-code some client_secret and just test things work that way with the network call commented out
fleet wraith
why would i use fetch instead of angulars built in functionality?
because right now your page is broken and we're trying things to rule out potential issues?
balmy terrace
ok, gimme a sec.
same
i did hardcode the previos
previous* clientSecret
this is safari. in chrome i get errors, firefox only shows AmazonPay
the use case is:
get the client's country and zip, calculate the tax + shipping, update payment intent and capture the updated amount.
fleet wraith
maybe it's an Angular-specific issue(we don't actually directly test on that)? I know we have issues with shadow DOMs for instnace. If you can get me a public link to the site we can try to debug it as some point.
You might also try using a wrapper library like https://ngx-stripe.dev/docs/express-checkout-element