#jhonsalazar1623_api

1 messages · Page 1 of 1 (latest)

eager urchinBOT
#

👋 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/1254952655751745557

📝 Have more to share? Add details, code, screenshots, videos, etc. below.

dark egret
#

Hello! My problem is when attempt confirm
const {error} = await confirmIntent({
elements,
clientSecret: secret,
confirmParams: {
return_url: ${window.location.origin}/checkout/success?secret=${secret}&transactionId=${transactionId},
},
redirect: 'always'
});

dapper cedar
#

Hi, the issue here is that you're mixing using automatic_payment_methods and also manually passing ythe payment method types. You would want to make sure that you stay consistent

dark egret
#

where is the option automatic_payment_methods , in the backend?

#

my code the backend is
InvoiceCreateParams.builder()
.setCustomer(customerId)
.putMetadata("customerId", String.valueOf(customerExternalId))
.setAutomaticTax(InvoiceCreateParams.AutomaticTax.builder().setEnabled(true).build())
.putMetadata("sellerId", sellerId.toString())
.putMetadata("subscriptionId", String.valueOf(subscriptionId))
.setPaymentSettings(
InvoiceCreateParams.PaymentSettings.builder()
.setPaymentMethodTypes(
Collections.singletonList(InvoiceCreateParams.PaymentSettings.PaymentMethodType.CARD))
.build()
)
.setApplicationFeeAmount(
(total * Long.parseLong(this.fee) )
)
.setTransferData(
InvoiceCreateParams.TransferData.builder()
.setDestination(sellerStripeId)
.build()
)
.build();

#

Invoice invoice = this.subscriptionExternalService.createInvoice(params);

#

InvoiceItem.create( InvoiceItemCreateParams.builder()
.setCustomer(customerId)
.setPrice(priceId)
.setInvoice(invoiceId)
.build());

#

Invoice resource = Invoice.retrieve(invoice.getId());

                    InvoiceFinalizeInvoiceParams paymentIntent =
                            InvoiceFinalizeInvoiceParams.builder().addExpand("payment_intent").build();
#

Invoice invoiceFinalized = resource.finalizeInvoice(paymentIntent);

                    clientSecret = invoiceFinalized.getPaymentIntentObject().getClientSecret();
dapper cedar
#

Ah sorry, you are using Billing. Let me further review this

dark egret
#

ok, thanks!

#

When I use CHARGE_AUTOMATICALLY with payment method works succefully

dapper cedar
#

That is expected.

I'm still looking at your integration flow

dark egret
dapper cedar
dark egret
#

Iam using react stripe element

dark egret
dapper cedar
dark egret
#

I don't understand

#

I'm using invoice and payment intent..

#

ahhh ok

dapper cedar
dark egret
dark egret
dapper cedar
#

When you create the Elements, you want to add the card payment method types.

dark egret
#

ok,

dapper cedar
#

Is that your client side code?

dark egret
#

yes

dapper cedar
#

if so, yes

dark egret
#

I'm trying right now

#

same error

#

my secret from invoice from payment intent:
pi_3PVOCkGCjaP6mkX50CPXuNR8_secret_Nc4HZix2g2BTcE8GkaLX1tTiE

dapper cedar
#

Still looking here

dark egret
#

when use payment intent works succefully with stripe element but when I use invoice with payment intent doesn't work the confirmPayment method

dapper cedar
dark egret
#

uhmm

#

where is the options?

dapper cedar
#

Keep scrolling down

dark egret
#

I'm test mode

dapper cedar
#

So am I.. I'm almost done testing this, hang tight

#

So that flow worked for me.

#

Can you share your Elements creation code?

#

I know you shared your confirm function wiht me earlier but I'm looking for your code when you created the Elements

dark egret
#

of course

#

`const stripePromise = loadStripe("key here...")'

const options: any = {
mode: 'payment',
amount: 1000,
currency: 'usd'
};

<Elements stripe={stripePromise} options={options} >
<Payment order={order} tabsRef={tabsRef} stripePromise={stripePromise} />
</Elements>

payment is a component:

const transactionResult = await generateTransactionInfo(transaction)
console.log("transactionResult", JSON.stringify(transactionResult));
const {transactionId, secret} = transactionResult.data;
const confirmIntent: any | undefined = stripe?.confirmPayment;

const {error} = await confirmIntent({
elements,
clientSecret: secret,
confirmParams: {
return_url: 'url here'
},
redirect: 'always'
});

const options = {
paymentMethodOrder: ['card'],
paymentMethodTypes: ['card']
}

<PaymentElement options={options} onChange={(value: any) => {
setDisabledBtn(!value.complete)
}} onLoaderStart={() => setDisabledBtn(true)}/>

< Button type='submit' disabled={!Boolean(stripe) || disabledBtn} loader={loading.showing}
onClick={doPayment}
className="w-full text-2xl bg-customGreen !py-4 text-white justify-center disabled:!bg-gray-300 disabled:cursor-not-allowed">Pagar</Button>
`

#

the subscription and payment intent works correctly

dapper cedar
#

Just passing paymentMethodTypes: ['card'], worked for me

#

and if I take that away, I get the same error as you

#

Otherwise, since the payment method types are coming from the invoice settings, it looks like it's breaking as the Stripe Elements defaults to automatic payment methods

dark egret
#

but, I need to use invoice

#

It can't be that I am the only person in the world who cannot integrate invoice with the stripe documentation, am I the only one?

dapper cedar
#

you can still use Invoices, but just need to change the client side code

dark egret
#

I am using exactly the same code, the difference is that I use react, with subscriptions and paymen intent it works without problems, with invoice it does not work

#

paymentMethodTypes no found

dapper cedar
#

It looks like you're rending the PaymentElement before you create the invoice. If you instead create the invoice/ finalize then, create teh PaymentElement it should work

#

I tested this both ways on my test code

dark egret
#

no, first I create the invoice... its imposible

#

did you check my backend code?

dark egret
#

I'm using dependency in my backend:
<dependency>
<groupId>com.stripe</groupId>
<artifactId>stripe-java</artifactId>
<version>24.13.0</version>
</dependency>

#

where is the version api?

dapper cedar
dark egret
#

where?

#

const stripePromise = loadStripe() ?

dapper cedar
#

It shows it in the example above:

import Stripe from 'stripe';
const stripe = new Stripe('pk_test_51***', {
apiVersion: '2023-08-16'
});

dark egret
#

im using react...

dapper cedar
#

oohh, that is right

dark egret
#

so?

#

I don't understand what I have to do, I've had the same error for weeks and I can't move forward with the development

dapper cedar
#

Can you try adding it in the const stripePromise = loadStripe("key here...", {
apiVersion: '2023-08-16'
})' ?

#

Yeah, what you're trying to do is not supported with the defer intent flow sadly

dark egret
#

good!

dapper cedar
#

I also confirm this with a teammate

dark egret
#

same error
"Payment details were collected through Stripe Elements using automatic payment methods and cannot be confirmed with a Payment Intent configured with payment_method_types."

dapper cedar
#

I also tested this end to end

dark egret
#

😢

#

is there a issue with react ?

dapper cedar
#

I do not think so, can you share the pi_ if with me?

dark egret
#

"pi_3PVPZwGCjaP6mkX51mNrb645"

dapper cedar
#

Let me get a teammat who has React expertise, hang tight.

#

From my investigation, it looks like you're loading the Elements before finalizing the invoice which is not supported. If you finalize the invoice, and the user the client_secret from the payment intent, it should work.

dark egret
#

my code backend is

 `Invoice resource = Invoice.retrieve(invoice.getId());

                    InvoiceFinalizeInvoiceParams paymentIntent =
                            InvoiceFinalizeInvoiceParams.builder().addExpand("payment_intent").build();

                    Invoice invoiceFinalized = resource.finalizeInvoice(paymentIntent);

                    clientSecret = invoiceFinalized.getPaymentIntentObject().getClientSecret();`
dapper cedar
#

yes, but on the client-side, I do not see where you're fetching the client_secret from the server-side.

#

Potentially, since I do not have React expetise, it might be the issue.

#

Hang tight

dark egret
#

uhmmm

#

but if I showed it to you...

#

const transactionResult = await `generateTransactionInfo(transaction) --> HERE return secret...
console.log("transactionResult", JSON.stringify(transactionResult));
const {transactionId, secret} = transactionResult.data;
const confirmIntent: any | undefined = stripe?.confirmPayment;

const {error} = await confirmIntent({
elements,
clientSecret: secret,
confirmParams: {
return_url: ``,
},
redirect: 'always'
});`

dapper cedar
#

I'm getting help..

dark egret
#

my integration with subscription works fine, also uses the same code

uncut hearth
#

Hi @dark egret I'm taking over this thread. Give me a sec to catch up

dark egret
#

ok, thanks!

uncut hearth
dark egret
#

no

uncut hearth
#

Yes you are. I noticed you specify these params in the options

    mode: 'payment',
    amount: 1000,
    currency: 'usd'
  };```
dark egret
#

yes but Im using invoice api in the backend

uncut hearth
#

But you are using deferred flow in your frontend integration.

#

If this is not what you want to achieve, I'd suggest you remove this options from your frontend code

dark egret
#

Yes, I tried with options and without options parameter.

#

I can try again

#

wait second

uncut hearth
#

Sure, and share with me the PaymentIntent ID if you still encounter the problem.

dark egret
#

same error:
"pi_3PVPpOGCjaP6mkX50XQ44r3Z_secret_yHJ1UDzo7ODjoIJFifNDwV7CG"

#

message:
"Payment details were collected through Stripe Elements using automatic payment methods and cannot be confirmed with a Payment Intent configured with payment_method_types."

uncut hearth
#

Looks like you are still using the deferred flow

dark egret
#

status: "requires_payment_method"

uncut hearth
#

Can you share with me the latest frontend code?

dark egret
#

in my payment component:
<PaymentElement onChange={(value: any) => {
setDisabledBtn(!value.complete)
}} onLoaderStart={() => setDisabledBtn(true)}/>
}

#

< Button type='submit' disabled={!Boolean(stripe) || disabledBtn} loader={loading.showing}
onClick={doPayment}
className="w-full text-2xl bg-customGreen !py-4 text-white justify-center disabled:!bg-gray-300 disabled:cursor-not-allowed">Pagar</Button>

uncut hearth
#

Ok, I saw you removed options from Elements. Is your code saved successfully? Do you need to re-compile it?

dark egret
#

yes

#

but I try again

#

wait second

uncut hearth
#

Hmm, wait a second, It looks like you didn't pass clientSecret to Elements

dark egret
#

IntegrationError: In order to create a payment element, you must pass a clientSecret or mode when creating the Elements group.

#

yes! ahahah

#

in my click button event
const transactionResult = await generateTransactionInfo(transaction)
console.log("transactionResult", JSON.stringify(transactionResult));
const {transactionId, secret} = transactionResult.data;
const confirmIntent: any | undefined = stripe?.confirmPayment;

#

const {error} = await confirmIntent({
elements,
clientSecret: secret,
confirmParams: {
return_url: $,
},
redirect: 'always'
});

#

I passed the secret...

uncut hearth
#

No, if you are not using deferred flow, you should pass the clientSecret to the Elements

dark egret
#

uhmmm

uncut hearth
dark egret
#

OMG!!!

#

it works!

uncut hearth
#

Great!

dark egret
#

Is it the same for subscription integration?

#

since with the previous code the subscription works well

#

I think the example options is different...

uncut hearth
dark egret
#

in this dcoumentation the options object is different

uncut hearth
#

Yes, the doc that you shared is using the deferred flow.

The benefit of using deferred flow is that you can render the PaymentElement without a clientSecret. However, you need to ensure that the options that you specify in front end is consistent with the PaymentIntent that the invoice creates.

dark egret
#

one documentation is confusing or not consistent with the other, I think we would have to unify it correctly to avoid this inconvenience

#

Anyway, I thank you, thank you very much!