#johnykes-metered-billing

1 messages ยท Page 1 of 1 (latest)

fierce locust
neon igloo
#

Hi ynnoj ๐Ÿ™‚

fierce locust
#

Generally you'd create the Subscription and then collect payment info from your customer to handle any auth/3DS and confirm the initial payment

neon igloo
#

I tried to use the low code version of this integration

#

using vue-stripe npm package

#

but I get an error because of missing quantity of the subscription items

fierce locust
neon igloo
#

I think I'll create an issue to vue-stripe on github...

#

I don't want to implement using hardcoded price IDs

fierce locust
#

Share your code, I'll see if anything stands out

#

I assume this is creating the Checkout Session?

neon igloo
#

yesm it should

fierce locust
#

Share the code

neon igloo
#

that's my user profile page. he will see/create/cancel his PAYG subscrption from this page.

#

I want to use a no-code option in order to keep the things simple and save his card details automatically on the stripe page

fierce locust
#

Yeah the issue is here I think:

lineItems: [
        {
          price: "price_1JxVxhKXC3SV2dGeR14xixpR"
        },
        {
          price: "price_1JxXQYKXC3SV2dGet6Q8jzRX"
        }
      ],
neon igloo
fierce locust
#

Yeah but you're creating a Checkout Session

#

That Session handles the creation of the Subscription

neon igloo
#

so should I use quantity: 0 ?

#

I can't use 0 it seems...

fierce locust
#

Why would you want 0?

#

They'd be subscribing to nothing

neon igloo
#

because it's a metered subscription... 0$ / month if no usage

fierce locust
#

There still need to be an initial quantity to subscribe to

#

The usage reporting is separate

neon igloo
#

If I set quantity, they will be charged every month even if they don't use my service. I don't want that... I want to be Pay As You Go

fierce locust
#

There won't be. The quantity here is the total amount of subscriptions to each price to create

#

The amount they're billed is dependent on your usage reporting within the billing cycle

neon igloo
#

I don't get it... anyway, tried with quantitiy: 1 for both items, but it seems Client-onlycheckout does not support metered billing

v3:1 Uncaught (in promise) IntegrationError: Client-only Checkout does not support prices with `usage_type=metered` in `items[0]`.
fierce locust
#

Ah, yeah. It's pretty limited

#

Payment Links are the better low-code option

neon igloo
#

payment links for creating a metered subscription, or what?

#

or just for paying every month/day/etc?

fierce locust
neon igloo
#

I don't think I can use this with metered billing... I tried right now to create a paymnet link, but I can't choose the metered products...

fierce locust
#

Yeah it's pretty new (as a replacement for client-only Checkout) but is getting more and more features added

#

In that case you'd need a sever to create the Checkout Session

neon igloo
#

what would be the workflow?

#

I mean, I need this: customer will click "activate subscription", somehow collect and VALIDATE payment details and just then create metered billing subscription... then he will be peridically automatically charged...

fierce locust
#

Checkout can do all that, yes

#

But to be clear there will be some code required for the metered usage reporting

neon igloo
#

yes, the usage report is not a problem.
will the invoice be created automatically at the end of the period (e.g. month) and sent to customer?

fierce locust
#

But you need to report usage for that billing period before then

#

At the end of a subscription period, Stripe automatically totals and invoices for all usage during the billing period. Metered billing invoices respect trials. Note that once the invoice is submitted, it cannot be changed. The usage reporting endpoint is rate-limited, so you might need to exercise caution and avoid making too many separate usage records.

neon igloo
#

sure, I'll do that in real time

#

1 more question

fierce locust
#

Sure!

neon igloo
#

this card element generates a token... can this token be passed to the SubscriptionCreateOptions.DefaultPaymentMethod string?

#

is this its purpose?

fierce locust
#

Is your intention not to use Checkout?

neon igloo
fierce locust
#

Token objects are mostly legacy (and deprecated). Instead you'd want a Payment Method object. I'm not sure what that library supports as it's third-party and not maintained by Stripe

#

Previously you wanted to use Checkout which will handle the creation of your subscription as well as collecting payment methods. Now you're linking to Element components for a custom flow

#

Unsure as to which way you're building!

neon igloo
#

I would like to use checkout... but it's html + js....

#

I want to use vuejs

#

and not hardcode variables like my publishable key or price IDs...

fierce locust
#

If you're using Checkout then you don't need the Card Element

neon igloo
#

but I'll need this for example

let stripe = Stripe('xxxx');
let elements = stripe.elements();
fierce locust
neon igloo
#

I can't use Checkout for metered billing products, right?

graceful sparrow
#

No, but you could use it to collect the payment details, for example

neon igloo
#

using virtual product with price 0$, or how?

graceful sparrow
#

This allows you to collect payment details for future payments with no payment taken at the time

neon igloo
#

ok ๐Ÿ™‚ I'll try to implement that and add the payment method to my create subscription backend function. Thank you for now for all your patience ๐Ÿ™‚

graceful sparrow
#

Sounds good, and happy to help!