.abishek | Stripe Developers | Page 1

fiery saffronBOT Sep 11, 2023, 1:21 AM

#

neat portal Sep 11, 2023, 1:22 AM

#

I have the following code

#

I am following the functionality from https://stripe.com/docs/payments/accept-a-payment-deferred?platform=web&type=payment#dynamic-updates

civic nimbus Sep 11, 2023, 1:22 AM

#

The page can be redirected if the payment method chosen is a redirect-based payment method

neat portal Sep 11, 2023, 1:23 AM

#

but I am using the card 4242 that wouldn't require a redirect

#

and the redirect should be to the bank page and not a refresh right?

#

I do get an the following error on console

Uncaught IntegrationError: We could not retrieve data from the specified Element.
              Please make sure the Element you are attempting to use is still mounted.

civic nimbus Sep 11, 2023, 1:24 AM

#

Can you elaborate more what you meant by refreshes the page? I tried in my own integration and it doesn't refresh

neat portal Sep 11, 2023, 1:29 AM

#

ok, going to have to figure this out, but can I explain to you what I am doing, so you can tell me if there is a simpler way to do this

#

I have a product that has a Standard Pricing (One Time). A new user signs up, doesn't have a payment method yet. I am trying to use web elements to capture the payment method and make a payment for this product.

civic nimbus Sep 11, 2023, 1:29 AM

#

sure!

neat portal Sep 11, 2023, 1:33 AM

#

So what I have done is.

Created a paymentElement and assigned the mode:'payment and amount:{{productPriceAmount}}
when they hit the Pay button
2a, I call elements.submit
2b, create a payment intent from javascript (you will see the line Livewire.find, this does an ajax call to get the payment intent. Following is how I get the payment intent secret
a. creating an invoice and attaching an invoice line item with the above priceId
b. finalize the invoice and get the payment_intent
2c, get this payment and pass that to stripe.confirmPayment

#

let me know if I am complicating it?

#

is there a simpler way to do this?

#

I am trying to follow the code from the above URL

#

I am trying to get the payment method and make a payment for the product in one go.

civic nimbus Sep 11, 2023, 1:37 AM

#

Am I right to understand that you would like to do following?

Use Invoicing
Make payment with Payment Element

neat portal Sep 11, 2023, 1:39 AM

#

Invoicing is not something I chose. the reason I am using invoicing is because to make a payment for a one-time pricing product, there isn't another way.

#

Creating a payment Intent doesn't take a price object

#

the only way is to create an invoice, finalize it and get the payment intent to make a payment against it

#

am I missing something?

civic nimbus Sep 11, 2023, 1:43 AM

#

Invoicing incurs additional fee: https://stripe.com/en-gb-us/pricing. I'd only suggest Invoicing when it is required.

If you wish to use one-time pricing product, I'd recommend using Checkout Session (Stripe hosted payment page): https://stripe.com/docs/checkout/quickstart

Payment Intent integration charges to the amount directly without prices to be created.

neat portal Sep 11, 2023, 1:45 AM

#

so, there is no way to make a one time payment to a product without checkout session?

#

paymentIntent accepts a subscription why not a price?

#

is there a way to indicate that a payment received using the paymentElement is for product or a price after the payment is received?

civic nimbus Sep 11, 2023, 1:47 AM

#

It can be done with Invoicing, but additional charges will incur. If you're fine with using Invoicing, the steps will be:

Use Setup Intent to collect the payment method: https://stripe.com/docs/payments/save-and-reuse
Set the saved payment method as default_payment_method when creating the Invoice: https://stripe.com/docs/api/invoices/create#create_invoice-default_payment_method

#

paymentIntent accepts a subscription why not a price?
The subscription will create a Payment Intent, not another way round

#

paymentElement is for product or a price after the payment is received?
You can set it in the metadata field in the Payment Intent for your own reference: https://stripe.com/docs/api/payment_intents/create#create_payment_intent-metadata

Stripe API reference – Create a PaymentIntent – curl

Complete reference documentation for the Stripe API. Includes code snippets and examples for our Python, Java, PHP, Node.js, Go, Ruby, and .NET libraries.

neat portal Sep 11, 2023, 1:50 AM

#

ya, the meta data isn't going to work as the client wants to be able to generate reports against what products are being purchased..

#

so the payment really needs to happen for a product/price

#

the additional charges you mentioned is on top of the stripe fee?

civic nimbus Sep 11, 2023, 1:51 AM

#

In this case, Invoicing should work as suggested above

#

the additional charges you mentioned is on top of the stripe fee?
Yup!

neat portal Sep 11, 2023, 1:51 AM

#

ok

#

so the point of the price type "Customer Chooses amount" on "Standard Onetime pricing " is only for Checkouts not for web elements or API integrations

#

so, if I were to do it without invoice and use web elements, how do I do this?

civic nimbus Sep 11, 2023, 1:57 AM

#

One time pricing product is only supported in Checkout Session and Invoicing.

Payment Intent using Elements only support direct charging to the amount, but not with one time pricing product. I'm afraid it's not possible to have one time pricing product without Invoicing with Elements

neat portal Sep 11, 2023, 1:58 AM

#

ok, so I just use Payment Element and pass the amount for the price

#

is there docs for this?

civic nimbus Sep 11, 2023, 1:59 AM

#

You may refer to the doc here: https://stripe.com/docs/payments/accept-a-payment?platform=web&ui=elements

neat portal Sep 11, 2023, 2:01 AM

#

ok, let me try this. thank you

civic nimbus Sep 11, 2023, 2:01 AM

#

No problem! Happy to help 😄

neat portal Sep 11, 2023, 2:46 AM

#

one question though. if the web elements are loaded inside a modal would that affect the process in anyway?

#

it is just a div element loaded as a modal

civic nimbus Sep 11, 2023, 2:51 AM

#

If the payment requires 3DS, there will be another modal created. It should be fine to load in a modal, but the user experiences might not be great with multiple modals

neat portal Sep 11, 2023, 3:08 AM

#

does the 3DS model open automatically or does it redirect?

#

with web elements

civic nimbus Sep 11, 2023, 3:11 AM

#

It can be both depending on card issuer's 3DS support, but most of the issuers are on 3DS modal nowadays

neat portal Sep 11, 2023, 3:11 AM

#

ok

#

so on this step https://stripe.com/docs/payments/accept-a-payment?platform=web&ui=elements#web-submit-payment the confirmParams has a return_url, if a card issuer uses 3DS modal, will the return_url still be used?

civic nimbus Sep 11, 2023, 3:14 AM

#

Nope. I'd recommend using with 3DS test cards here https://stripe.com/docs/testing#three-ds-cards to test the user experiences

neat portal Sep 11, 2023, 3:15 AM

#

is there a demo page for web elements where I can test these to see how I code this further?

civic nimbus Sep 11, 2023, 3:22 AM

#

Example code can be downloaded here and run it directly for the demo: https://stripe.com/docs/payments/quickstart

Custom payment flow

Learn how to embed a custom Stripe payment form in your website or application. Build a checkout form with Elements to complete a payment using various payment methods.

neat portal Sep 11, 2023, 3:22 AM

#

Thank you

civic nimbus Sep 11, 2023, 3:26 AM

#

No problem! Happy to help 😄

neat portal Sep 11, 2023, 3:30 AM

#

so, I followed the above code and I get this, but I don't see the checkbox at the bottom to save for link. I have the linkAuthenticationElement setup and the email field is binding correctly

#

does that work only for setupIntent?

civic nimbus Sep 11, 2023, 3:41 AM

#

What is the country of your Stripe account?

neat portal Sep 11, 2023, 3:42 AM

#

US

civic nimbus Sep 11, 2023, 3:50 AM

#

Have you enabled Link in https://dashboard.stripe.com/test/settings/payment_methods?

neat portal Sep 11, 2023, 3:58 AM

#

yes it is enabled

#

fiery saffronBOT Sep 11, 2023, 3:59 AM

#

vivid shadow Sep 11, 2023, 4:04 AM

#

Hi @neat portal I'm taking over this thread

neat portal Sep 11, 2023, 4:04 AM

#

hey @vivid shadow thank you. here is my code

#

and here is the output

vivid shadow Sep 11, 2023, 4:05 AM

#

Can you share with me your merchant ID? you can find it from the Stripe Dashboard -> Settings ->Account Details

neat portal Sep 11, 2023, 4:06 AM

#

and I am missing this and the checkbox at the bottom

#

account id => acct_1LlHbdJkQCRoh7rJ

#

not sure why the payment intent is getting created with just card

vivid shadow Sep 11, 2023, 4:09 AM

#

What kind of checkbox are you expecting? are you following a particular integration guide? can you share with me the link?

neat portal Sep 11, 2023, 4:09 AM

#

this is my code to create the payment intent

#

I had a checkbox at the bottom of the web elements to save the payment method for Link. now it doesn't show

#

should I have to do

'automatic_payment_methods' => [
    'enabled' => 'true',
  ],

#

ah thats it

#

adding the above to the payment intent did it

#

neat portal Sep 11, 2023, 4:39 AM

#

is there a way to show the list of payment methods attached to a customer using web elements?

vivid shadow Sep 11, 2023, 4:41 AM

#

No

neat portal Sep 11, 2023, 4:41 AM

#

ok

vivid shadow Sep 11, 2023, 4:42 AM

#

You need to build your own UI to show the saved payment methods

neat portal Sep 11, 2023, 4:42 AM

#

ok

neat portal Sep 11, 2023, 5:15 AM

#

where can I find docs about what payload is received for each webhook?

vivid shadow Sep 11, 2023, 5:16 AM

#

https://stripe.com/docs/api/events/types

Stripe API reference – Types of events – curl

Complete reference documentation for the Stripe API. Includes code snippets and examples for our Python, Java, PHP, Node.js, Go, Ruby, and .NET libraries.

#.abishek