#sushbhat-clientSecret

1 messages · Page 1 of 1 (latest)

umbral stream
#

Hi there. It should be a string. I think you have been passing a JS object

candid sigil
#

I am passing this way clientSecret: 'pi_3LRwjqJ9HSJXUod00PpbJw1W_secret_7KWhFVkTQuFoToC86onjiQIxP',

umbral stream
#

Yeah it looks correct

#

but the console says otherwise

candid sigil
#

ya tried changing it to double quotes etc no luck

#

fyi I am trying to integrate into angular app

umbral stream
#

We might need your code around the part passing that value

candid sigil
#

sure

#

const { error } = await this.stripe.confirmCardPayment({
clientSecret: 'pi_3LRwjqJ9HSJXUod00PpbJw1W_secret_7KWhFVkTQuFoToC86onjiQIxP',
data: {
// Make sure to change this to your payment completion page
return_url: "http://localhost:3001",
payment_method: {
billing_details: {
address: {
city: 'd',
country: 'i',
line1: null,
line2: null,
postal_code: 576100,
state: 't'
},
email: 'abc@qxyz.com',
name: 'abc',
phone: null
}
}
}
});

umbral stream
#

that looks correct

#

you sure your console refers to this block of code?

#

Btw you are using confirmCardPayment, which is an old method for Card Element. You have PaymentElement which is newer component

candid sigil
#

which method should I be using?

#

doc link would be helpful please

umbral stream
candid sigil
#

I am using this declare var Stripe: stripe.StripeStatic;

#

it doesn't seem to have a confirmPayment

#

here is the list of supported methods:

umbral stream
#

That's weird. What version are you using?

candid sigil
#

"@types/stripe-v3": "^3.1.27"

#

"@stripe/stripe-js": "^1.34.0",

#

these 2 I have included

gloomy spade
#

Hi @candid sigil I'm taking over this thread

candid sigil
#

Not able to make any request yet

#

just hardcoded payment intent id

#

i mean client secret

#

when I click on confirm payment this error shows up

gloomy spade
#

Ah, you don't need to pass the param name clientSecret

#

So your code should be something like

    'pi_3LRwjqJ9HSJXUod00PpbJw1W_secret_7KWhFVkTQuFoToC86onjiQIxP',
      {
        // Make sure to change this to your payment completion page
        return_url: "http://localhost:3001/",
        payment_method: {
...
candid sigil
#

changed it to this

#

const clientSecret = 'pi_3LRwjqJ9HSJXUod00PpbJw1W_secret_7KWhFVkTQuFoToC86onjiQIxP';
const { error } = await this.stripe.confirmCardPayment({
clientSecret,
data: {
// Make sure to change this to your payment completion page
return_url: "http://localhost:3001",
payment_method: {
billing_details: {
address: {
city: 'Hyderabad',
country: 'India',
line1: null,
line2: null,
postal_code: 576100,
state: 'Telengana'
},
email: 'sushbhat@qti.qualcomm.com',
name: 'Sushant',
phone: null
}
}
}

#

still same error

gloomy spade
#

Change await this.stripe.confirmCardPayment({ to await this.stripe.confirmCardPayment(

#

And also remove the additional trailing brace

candid sigil
#

got it

#

now its fine

#

but seeing this error
Uncaught (in promise): IntegrationError: Missing value for confirmCardPayment: payment_method.card should be an object or element.
IntegrationError: Missing value for confirmCardPayment: payment_method.card should be an object or element.

#

do I need to pass card, isn't it already part of payment intent

gloomy spade
#

Usually you need to get a reference of the cardElement and pass it to card param, as what the example code shows.

#

By doing that, Stripe.js will automatically create a PaymentMethod from the cardElement, and attach it to the PaymentIntent.

candid sigil
#

I am currently not creating a card element but paymentelement

#

const paymentElement = this.elements.create("payment");
paymentElement.mount("#payment-element");

gloomy spade
candid sigil
#

but unfortunately this method is not found on angular stripe library, so had to use this method

#

in pure javascript I had done something like this
const { error } = await stripe.confirmPayment({
elements,
confirmParams: {
// Make sure to change this to your payment completion page
return_url: "http://paas-env.eba-ftcpihnm.us-west-2.elasticbeanstalk.com/public/paymentStatus.html",
payment_method_data: {
billing_details: {
address: {
city: 'Hyderabad',
country: 'India',
line1: null,
line2: null,
postal_code: 576100,
state: 'Telengana'
},
email: 'sushbhat@qti.qualcomm.com',
name: 'Sushant',
phone: null
}
}
}
});

#

and this works

gloomy spade
#

the confirmCardPayment method requires a cardElement so it doesn't work with PaymentElements.

candid sigil
#

so on angular whats the recommended way of integration? any suggestions?

#

currently using this declare var Stripe: stripe.StripeStatic;

#

"@stripe/stripe-js": "^1.34.0",
"@types/stripe-v3": "^3.1.27"

gloomy spade
candid sigil
#

oh great, let me try this