#tiffanyatschedulicity - Elements
paper siren
Hello! Can you provide more details? Which specific Stripe Element(s) are you asking about? Are you trying to use older APIs (Charges/Sources)?
paper siren
Payment Methods and Payment Intents are our newer APIs, Charges, Tokens, Sources, etc. are our older ones.
young shuttle
Ok. I'm asking our API dev just to be sure
paper siren
The Payment Request Button produces a Token, Source, or Payment Method. From there it's up to you what you do with it.
It's compatible with our older and newer APIs, and does not require a client secret to work.
young shuttle
okay so how would I complete the payment then
step 5 of the docs use the client secret
do you have an example of another way
paper siren
Our sample code shows you how to use the Payment Request button to create a Payment Method and use that Payment Method to confirm a Payment Intent. If you want to do something differently can you give me the specifics of what you want to do so I can point you in the right direction?
young shuttle
If I use a token can that be stored to save that payment option?
paper siren
Let's back up a bit. At a high level what do you want to do (not in Stripe-specific terms)?
young shuttle
the user can use google pay to checkout using our site and the funds will go to the business who has an account w/ us for their service/product
is that what you are askng?
each of our buisnesses have a stripe key we call from our api
which I pass: this.stripe = Stripe(response.Value);
then I have the paymentRequest that sends the object that contains country, currency, amount, etc
paper siren
I'm trying to understand what you're trying to build and what specifically is blocking you so I know what needs to happen to help you. 🙂
I'm not 100% clear on what you want to do/what's blocking you.
I understand you want to use the Payment Request Button to accept Google Pay payments, but beyond that I'm not sure what your question is.
young shuttle
from there I call a function that creates the element and calls canMakePayment(), with the next step being 'this.paymentRequest.on('paymentmethod', (event) => {'
which requires a client secret
and we currently do not have an endpoint from our API for the client secret
so I'm wondering if that is necessary to have or if I can do this w/o it
Looks like we use Charges/Sources
this is in Angular
so could I use this.paymentRequest.on('tokens' ...
paper siren
I'm a bit confused, because listening for the paymentmethod event from the Payment Request Button does not require a client secret. You listen for that event in order to get the Payment Method the Payment Request Button produces. From there you can use a client secret from a Setup or Payment Intent to confirm the Intent client side using the Payment Method the Payment Request Button created, but it's not required.
Does that make sense?
young shuttle
hmm.. sort of.
when I run my code I get an error asking for a clientSecret... is this correct:
setupButton() {
// this.elements = this.stripe.elements();
// this.paymentRequest.on('token', ({ token }) => {
// this.token = token;
// console.log('token' + this.token);
// });
this.paymentRequest.on('paymentmethod', (event) => {
console.log(event);
this.stripe.confirmCardPayment(
// this.clientSecret,
{ payment_method: event.paymentMethod.id },
{ handleActions: false }
).then(
(confirmResult: any) => {
console.log(confirmResult);
if (confirmResult.error) {
console.log('confirm result error' + confirmResult.error);
event.complete('fail');
console.log('fail');
} else {
event.complete('success');
console.log('success');
if (confirmResult.paymentIntent.status === 'requires_action') {
console.log('confirm result payment status' + confirmResult.paymentIntent.status);
this.stripe.confirmCardPayment(this.clientSecret).then(({ error }) => {
if (error) {
console.log('if error' + error);
this.paymentStatus.emit(false);
} else {
this.paymentStatus.emit(this.token);
console.log('else this token' + this.token);
}
});
} else {
this.paymentStatus.emit(this.token);
console.log('else else this token' + this.token);
}
}
}
);
});
this.checkAndMountButton();
}
thats the full function the dev had before I took over this project
or how would I achieve confirming the Intent client side using the Payment Method the Payment Request Button created w/o the client secret?
paper siren
You can't confirm it client side without the client secret.
You can either make the client secret from the Intent available client side and confirm it there (recommended) or send the Payment Method the Payment Request Button generates to your server and use it there (not recommended).
young shuttle
oh so what you are saying is I dont "have" to confirm client side?
paper siren
You don't have to, no, but it's strongly recommended. Is there a reason you don't want to?
young shuttle
no there isn't .. but my main question was do I need to have the API dev add client secret and would that require an upgrade to Intent
paper siren
You would need some way to get the client secret from the Setup or Payment Intent client side, yes. Not sure what "upgrade to Intent" means?
young shuttle
the PaymentIntent API
paper siren
Oh, meaning you're using direct Charges now?
paper siren
We do recommend you upgrade to Payment Intents if possible, but you can still use the Payment Request Button with older direct Charges integrations.
One thing I want to make clear is that Payment Intents and Payment Methods are the newer APIs, and Payment Methods are not compatible with a direct Charges integration. You would need to get a Token from the Payment Request Button instead of a Payment Method.
And with older direct Charges there's no such thing as client side confirmations or client secrets.
So if you want to use the Payment Request Button with direct Charges you can listen for the token event instead of the paymentmethod event to get a Token: https://stripe.com/docs/js/payment_request/events/on_token
paper siren
Did all of that make sense? Are you able to make forward progress now?