MikeD-Billing-Pricing | Stripe Developers | Page 1

limber tinsel Oct 7, 2021, 3:00 PM

#

uneven drift Oct 7, 2021, 3:01 PM

#

@stable wagon please talk to our support team about pricing https://support.stripe.com/contact

stable wagon Oct 7, 2021, 4:01 PM

#

Sorry Sure we can talk here @slow crag

#

Still getting used to threads.

#

So the question was can I charge my customer in decimal of qty of a product?

#

It's been a while since I have used stripe and looks like a lot has changed.

slow crag Oct 7, 2021, 4:11 PM

#

@stable wagon is this for Subscriptions? or a one off payment

stable wagon Oct 7, 2021, 4:14 PM

#

Basically. I will manage "invoices" on my own site and database. Once the end of the month comes. My system will create invoice based on HOURS (Product: Consulting Service 100, Consulting Service 75 . etc...) But Hours could be 1.25, 1.5, 1.75. So for example lets say I worked for 1.5 hours for Consulting Service 100 then my invoice in my system would come out to be $150. I would then like to allow customer to pay this invoice (not stripe invoice) through stripe.

slow crag Oct 7, 2021, 4:22 PM

#

oh so you're not using Stripe Invoices then ... so yeah you'd just track this on your end then, and it would amount to a PaymentIntent that you create for a custom amount and charge your Customer
The tracking of quantity and amount per unit would need to be done on your end, if you aren't using Stripe Invoices

stable wagon Oct 7, 2021, 4:23 PM

#

yeah understood. about invoice factor tracking.

#

Is there a basic tut on paymentintent?

#

Do I even have to use a product?

slow crag Oct 7, 2021, 4:25 PM

#

you don't have to use a Stripe "Product" object on PaymentIntents, you just create it for an amount

this would be the basic intro: https://stripe.com/docs/payments/accept-a-payment?platform=web&ui=elements

high level:
1/ you create a PaymentIntent serverside
2/ you confirm the PaymentIntent client-side with Stripe.js + Elements

step 2 creates the charge and shows any authentication UI if the payment needs customer authentication

Accept a payment

Securely accept payments online.

stable wagon Oct 7, 2021, 4:27 PM

#

this looks way more familiar to what I am used to.

#

Do you know if you have a vue component that is supported by stripe?

slow crag Oct 7, 2021, 4:29 PM

#

nothing first party, there would be community packages

stable wagon Oct 7, 2021, 4:30 PM

#

Roger. Back in the day it just used to be .. JS -> Customer types card -> Gets back token from stripe -> Pass token to BackEnd. Then Send that token to stripe to charge card. Then backend response to front end saying.. Congrats Thanks for paying your invoice with confirmation id.

#

Looks to be similar in the article you just sent.

slow crag Oct 7, 2021, 4:34 PM

#

it is flipped in the new flow
instead of going "client-side, then server-side"
you do "server-side, then client-side"

stable wagon Oct 7, 2021, 4:34 PM

#

interesting.

#

I will read the article thoroughly
and report back. Thanks.

stable wagon Oct 7, 2021, 5:05 PM

#

So as I am understanding this basically from a modeling /workflow perspective

BackEnd
Create my invoice which would contain the following
Invoice (All My Stuff, PaymentIntentID, client_secret)

Front End
Bring Client to Screen where I have passed the client_secret and other info on the screen regarding how much they're going to pay (from my details). Instantiate Stripe.elenments('client_secret_of_payment_intent')
They fill it out and click submit payment
It will return result.paymentIntent which I can then use the client secret and or the payment intent id call to my back end to mark it paid.
OR
rely on a webhook that I injest to mark the payment intent (invoice) as paid.

slow crag Oct 7, 2021, 5:06 PM

#

Instantiate Stripe.elenments('client_secret_of_payment_intent')
so technically yes, you will instantiate Elements, just not directly with the PaymentIntent client_secret

you instantiate Stripe.js with your publishable key aka pk_test_1223
then instantiate Elements
then call confirmCardPayment() with the PaymentIntent client_secret

so just a few distinct steps that I wanted to highlight

#

and everything else sounds correct

stable wagon Oct 7, 2021, 5:07 PM

#

Roger yes. I saw that afte rI wrote to you

#

I was like. wait that doesn't make sense lol.

#

Not to keen on relying on JS to provide CONFIRMATION of payment

#

Webhooks are there. But.. Requires a bit more coding to verify all is marked correctly :p

#

I guess. I could fire a method ->GetCurrentStatus() {which would make a call to stripe to get the status of it and record a payment in the system if none exists) on every Invoice(PaymentIntent) on invoice list to customer before I send invoice details to front end
way heavier but would allow for a much more accurate and WAY less coding approach

slow crag Oct 7, 2021, 5:16 PM

#

yeah there is a bit more integration complexity but for real reasons, authentication on payments is complicated too so webhooks become a necessity really

limber tinsel Oct 7, 2021, 8:31 PM

#

@stable wagon was this the one?

stable wagon Oct 7, 2021, 8:31 PM

#

@limber tinsel you got it. Thanks much

#

Keeping everything in 1 thread is awesome.

#

Is there anything in stripe that can be used for a "project" for a customer?

#

When creating a payment intent.

#

I would like to be able to basically have the Short Descriptor + Project Code or something.

#

And if no on that. Is there something with Invoices (billing platform) that I can indicate a "project"

limber tinsel Oct 7, 2021, 8:35 PM

#

You can set custom data like that in the PaymentIntent's metadata https://stripe.com/docs/api/payment_intents/create#create_payment_intent-metadata

Stripe API reference – Create a PaymentIntent

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

#

Or the description property?

#

You are just asking how to basically attach a string to the PI to understand what project it is attached to later?

stable wagon Oct 7, 2021, 8:37 PM

#

Yeah 1 to know later which it was attached to. 2, for me to see it in dashboard and 3 for the customer to see it on their bank statement.

#

So on customer statement it would be like
ShortDescripter + ProjectCode

limber tinsel Oct 7, 2021, 8:38 PM

#

For the customer's bank statement you will want to use the statement_descriptor property

stable wagon Oct 7, 2021, 8:39 PM

#

does the statement_descriptor override everything?

#

or just the suffix?

#

As I see both fields are there.

#

#

Looks like maybe I should just set Suffix to project code and donezo

#

looks like statement_descriptor is a longer field that banks can tap into if they want.

limber tinsel Oct 7, 2021, 8:43 PM

#

Yeah the behavior of that field can be interesting.

stable wagon Oct 7, 2021, 8:48 PM

#

Pompey. Is there a way to have a card JS code for customer to add a card to their stripe without them creating a stripe account?

#

For example they login to the my site
Their customer is linked to a stripe customer b y stripe id

#

I create a little front end (from your js code) that allows them to just add a card to their customer account. But they are obvious that it's interacting basically with stripe.

#

basically they enter their card info but it's not actually paying anything lol

#

some of the old stuff we used on old project (vuejs)
import { CardNumber, CardExpiry, CardCvc, createToken } from 'vue-stripe-elements-plus'

      this.complete = this.number && this.expiry && this.cvc
      // field completed, find field to focus next
      if (this.number) {
        if (!this.expiry) {
          this.$refs.cardExpiry.focus()
        } else if (!this.cvc) {
          this.$refs.cardCvc.focus()
        }
      } else if (this.expiry) {
        if (!this.cvc) {
          this.$refs.cardCvc.focus()
        } else if (!this.number) {
          this.$refs.cardNumber.focus()
        }
      }```
```  async handleCardSave () {
      try {
        this.loading = true
        const token = await createToken()
        await this.saveSource(token)
        this.$refs.sourceModal.hide()
        this.$q.notify({
          type: 'positive',
          message: 'Card created'
        })
      } catch (e) {
        this.$q.notify({
          type: 'negative',
          message: 'Error creating source'
        })
      } finally {
        this.loading = false
      }
    },```

#

<q-card-section>
          <div class="card-wrapper">
            <div class="row q-col-gutter-sm">
              <div class="col-md-8 col-xs-12">
                <card-number ref='cardNumber' :stripe="skey" @change='number = $event.complete'></card-number>
              </div>
              <div class="col-md-2 col-xs-12">
                <card-expiry ref='cardExpiry' :stripe="skey" @change='expiry = $event.complete'></card-expiry>
              </div>
              <div class="col-md-2 col-xs-12">
                <card-cvc ref='cardCvc' :stripe="skey" @change='cvc = $event.complete'></card-cvc>
              </div>
            </div>
          </div>
        </q-card-section>
        <q-card-actions class="justify-end">
          <div class="col-md-auto">
              <q-btn color="primary" @click="handleCardSave" :loading="loading">{{$t('customterms.Save')}}</q-btn>
            </div>
            <div class="col-md-auto">
              <q-btn color="negative" flat @click="$refs.sourceModal.hide()">{{$t('customterms.Cancel')}}</q-btn>
            </div>
        </q-card-actions>
      </q-card>

#

Looks like the library comes from 3rd Party
But it uses
<script src="https://js.stripe.com/v3/"></script>

#

Just wondering if this is still PCI compliant.

finite ivy Oct 7, 2021, 9:05 PM

#

Hello! To clarify, this is for you to save their card so you can charge it later?

stable wagon Oct 7, 2021, 9:05 PM

#

Use it as a charge for them basically yeah

finite ivy Oct 7, 2021, 9:06 PM

#

We actually have a guide for doing that here: https://stripe.com/docs/payments/save-and-reuse

stable wagon Oct 7, 2021, 9:06 PM

#

Ahh not future payments

#

Lets say my site dies tomorrow.

#

I have to rebuild everything from scratch.

#

I can literally just query out stripe API and rebuild my app as all of the essential data is there. and I just populate it in my system

#

I wouldn't store the CARD itself.

#

I would basically pull down the customer. Store that.

#

Then When the customer goes to their "account" screen on the site.

#

They will see oh I got 4 cards on file (because I pulled the customer from stripe got their stored payment methods) showed the last 4 and card type and displayed that on screen"

#

They go Oh I want to add another Card on File .. Ok. Click add card. They fill out the form and submit it and it sends it to you guys. So next time I pull the customer I will get 5 payment sources which I can display.

#

Then. Let's say I create 5 invoices (NOT STRIPE INVOICES -> essentially payment intents with no card associated) and I show them the invoice and they click I want to pay this invoice. Awesome bring them to a payment screen. Do you want to pay this invoice with an existing card? Yes. -> update payment intent with existing card ref. -> no use different card -> Bring them to JS elements screen they can pay the amount with the Payment intent ref boom done

finite ivy Oct 7, 2021, 9:14 PM

#

Yeah, all that can be done with Stripe. The guide I linked you to would be for this piece, since you're not taking a payment at that time, just collecting the payment information and setting it up for future use:

They go Oh I want to add another Card on File .. Ok. Click add card. They fill out the form and submit it and it sends it to you guys. So next time I pull the customer I will get 5 payment sources which I can display.

For the later payments you would create Payment Intents for the Customer and Payment Method combo you wanted to charge with off_session set to true: https://stripe.com/docs/api/payment_intents/create#create_payment_intent-off_session

stable wagon Oct 7, 2021, 9:16 PM

#

yeah from what I gathered from hmunoz was basically create a payment intent with "integration_check": "accept_a_payment" (this would be my invoice) and then later I can update the payment intent with an existing payment source or send them to a js elements screen wtih payment intent (client secret)

#

i'll keep diving Thanks @finite ivy

#

This is actually fun. I love stripe dev support and love the documentation of the api

#

oh quick question.

finite ivy Oct 7, 2021, 9:18 PM

#

Happy to help! Just to confirm, did I answer all of your questions?

stable wagon Oct 7, 2021, 9:18 PM

#

Can Meta Data which is a key value pair be nested?

finite ivy Oct 7, 2021, 9:19 PM

#

No.

#

You can kinda do it by setting the value to something like a JSON string which you then decode on your end, but Stripe doesn't support nesting in metadata directly.

stable wagon Oct 7, 2021, 9:19 PM

#

For example
Customer1: {
metadata: {
projects: [
'my', 'array', 'of','project','ids'
]
}
}

#

so it's still key value

#

but the value = array

finite ivy Oct 7, 2021, 9:20 PM

#

Nope, that won't work.

#

You can do this though:

"metadata" : "['foo', 'bar']"

And then decode the "['foo', 'bar']" string to an array on your end.

stable wagon Oct 7, 2021, 9:22 PM

#

I thought meta data was an object of multiple meta data values?

#

key value pair

finite ivy Oct 7, 2021, 9:23 PM

#

Err, yeah, I messed up that example.

stable wagon Oct 7, 2021, 9:23 PM

#

Customer1: {
        metadata: {
            key: value,
            key: value,
            key: value,
            key: value
        }
    }

finite ivy Oct 7, 2021, 9:23 PM

#

"metadata" : {
  "key": "['foo', 'bar']"
}

#

Like that is what I meant, sorry about that!

stable wagon Oct 7, 2021, 9:23 PM

#

ok yeah that makes more sense

#

So the value can only accept a "string" thouggh

finite ivy Oct 7, 2021, 9:24 PM

#

Yes.

stable wagon Oct 7, 2021, 9:24 PM

#

Gotcha. Still doable.

#

It's for a minor billing system for myself. Just trying to protect myself as much as possible including backups lol

#

@finite ivy all questions answered so far. But if you wouldn't mind leaving this thread open so I can keep referring back and not have to bug you guys to re open that would be awesome

finite ivy Oct 7, 2021, 9:26 PM

#

Note that there is a limit of 500 characters for each metadata key's value, so don't put something too long in there. You can read more here: https://stripe.com/docs/api/metadata

stable wagon Oct 7, 2021, 9:26 PM

#

Good to note.

#

Projects is only thing I might need to get creative on

#

metadata: {
project1: "{project_id: 1, project_name: "Some Project"}",
project1: "{project_id: 1, project_name: "Some Project"}"
}
If key like Project :p

#

can metadata be added via dashboard?

#

doesn't look like such

finite ivy Oct 7, 2021, 9:30 PM

#

You can view it in the Dashboard, but I don't think you can edit it from there.

#

Also note that metadata keys are unique. If you try to specify two project1 metadata keys only the last value specified will be saved.

stable wagon Oct 7, 2021, 9:31 PM

#

yup I meant project1 project2

#

I see only up to 50 keys too

finite ivy Oct 7, 2021, 9:32 PM

#

Yep, that's correct.

#MikeD-Billing-Pricing