BastianInuk-payment-element | Stripe Developers | Page 1

primal gorge Apr 21, 2022, 10:20 AM

#

Creating a thread 🧵

#

Yep, fundamentally it does the same thing as the Card Element

signal hound Apr 21, 2022, 10:21 AM

#

Oh cool!

primal gorge Apr 21, 2022, 10:21 AM

#

i.e. tokenises payment data in a PCI compliant manner

#

(And on the note of separating out CardElement)
is there a CardZipElement much like there's a CardNumberElement, CardExpiryElement etc? I couldn't find any in the docs, and htat's why I'm looking into payament element
There's no CardZipElement no

#

Mostly because we only collect ZIP in certain cases (depending on the card BIN)

#

i.e. countries where AVS is supported: https://stripe.com/docs/disputes/prevention/verification#avs-check

Card verification checks

Learn how to make use of card verification checks to protect against disputes and fraud.

signal hound Apr 21, 2022, 10:23 AM

#

Oh in that case PaymentElement might be the way to go for us 😄

#

Is there then any way to get the token from PaymentElement, normally I'd just do

const { token, error } = await stripe.createToken(
  elements.getElement(CardElement)!
)

but the TS type checker complains (and I'd rather not do TS Ignore if possible)

primal gorge Apr 21, 2022, 10:36 AM

#

Well, it doesn't create a Token it creates a Payment Method object

signal hound Apr 21, 2022, 10:37 AM

#

Our backend unfortunately requires a token

primal gorge Apr 21, 2022, 10:48 AM

#

Are you not able to pass the Payment Element instance to createToken?

#

Tokens are generally not used in the context of payment methods/cards these days, so the UPE wasn't really built to factor them in

signal hound Apr 21, 2022, 10:50 AM

#

Tokens are very much required for our current add card to account => just press the button to pay flow

signal hound Apr 21, 2022, 10:51 AM

#

primal gorge Are you not able to pass the Payment Element instance to `createToken`?

not without ts-ignoring

#

wait maybe, is the payment method ID and token ID system thingy interopable? The backend is written in go

primal gorge Apr 21, 2022, 11:01 AM

#

Not exactly. What are you doing with it on the backend?

signal hound Apr 21, 2022, 11:03 AM

#

I don't know, I'm not the backend guy

#

I just know that I'm only sending the token ID to the go backend

#

@primal gorge I have no access to the go backend what so ever. All I know is that it expects a token ID, which has traditionally been generated from stripe.createToken(). If I cannot send a token ID to the server, the customer cannot add a card to the account, and they cannot subscribe or purchase stuff.

We have been using the CardElement react component, but it has been clashing with our site design. For the past few weeks, I've been trying to migrate to the multi-line equivalents, but these afaik don't supports postal codes, which is a big issue in countries that requires.

That's when I found PaymentElements, but if I cannot get a token ID to send to the server to aadd the card to the account, I cannot use this. Can you maybe help me somehow?

#

Maybe I should just redesign the page with the card element so it can better fit the single line stuff that we've been using for years

primal gorge Apr 21, 2022, 11:16 AM

#

multi-line equivalents, but these afaik don't supports postal codes
They do, it's a part of the CardElement

#BastianInuk-payment-element