#louisd_code
1 messages · Page 1 of 1 (latest)
👋 Welcome to your new thread!
⏲️ We'll be here soon! Typically we respond in a few minutes, but sometimes we might take a bit longer if the server is busy or if you have a particularly tricky question.
⏱️ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can always start a new thread if you have another question.
🔗 This thread will always be available, even after it's closed. You can find it again using Discord's search, or you can save this link: https://discord.com/channels/841573134531821608/1360234229094682637
📝 Have more to share? Add more details, code, screenshots, videos, etc. below.
Hi, let me help you with this.
I receive the following response:
{.."status": "requires_payment_method"..}
It doesn't indicate that there's a problem, this is expected initial state of the PaymentIntent.
Do you see any errors anywhere?
Ok, thanks, but i don't understand, Shouldn't I receive a QR code to display to the client side in return?
how can I get a QR code to print on my website so that the user can scan it to proceed with the payment on Twint?
I don't
You need to confirm the PaymentIntent for that.
It's best to use the PaymentElement to handle all the next steps for you, you can integrate it once, and it will support all the payment method types you want, when you enable them in the future: https://docs.stripe.com/payments/accept-a-payment?platform=web&ui=elements
This is not Twint-specific, but if you enable it in your Dashboard, eligible customers will see it as an option. QR code handling will be done by the element, you don't need to do anything extra.
Happy to help.
I got an other question
i only want the twint qr code on the kiosk, does the payementElement can handle this ?
Howdy, stepping in here as vanya had to step away
Can you clarify what you mean by kiosk here?
I mean self order module like this
Ok, and what isn't working like you expect, exactly?
I did not find how to diplay the QR code to the user
WHat did you try?
WHen you confirm the payment with Payment Element, or handle the required action, Stripe.js should redirect on mobile or show a QR code on desktop browsers.
i generate the payment intent from the backend with : const paymentIntent = await stripe.paymentIntents.create({
amount: 1000,
currency: 'chf',
payment_method_types: ['twint'],
}, {
stripeAccount: 'XXX'
});
then i get the payementIntentId on my frontEnd and try to call
const { confirmPayment } = useStripe();
const { error, paymentIntent } = await confirmPayment(paymentMethodId);
then i get an error "invalid payment method£
paymentsecret*
Are you forcing this to be called using twint for you customers, or are they choosing a payment method in payment element?
await confirmPayment(paymentMethodId);
this is not a valid call pattern
Let me grab the docs here
The customer can only use Twint, i don't want him to choose payment method
Where are you getting paymentMethodId from then?
If you have a payment_method id (eg, pm_1234) then the call would look something like this:
stripe.confirmPayment({
clientSecret,
confirmParams: {
return_url: 'https://example.com',
payment_method: 'pm_1234',
},
})
But if you're only using Twint, and don't have a payment method yet, then i think you might want to be using confirmTwintPayment instead:
https://docs.stripe.com/js/payment_intents/confirm_twint_payment
stripe.confirmTwintPayment(clientSecret)
hum ok but i am not sur to understand, when i call confirmTwintPayment, i will get a QR code ?
On desktop browsers a QR code should be shwon for the customer to scan on their phone, yes
See the example here too, you might need to provide a return_url in confirmTwintPayment too
Yes but i am not on browsers but on native environnement (react-native/android only)
And i don't really need an redirect_url, i would like something like this:
Back end create intent -> front end show QR code -> user scan an process payment -> backend webhook is called -> then backend ping the front end for payment success or error
Oh, so you're not using Stripe.js / PaymentElement at all?
Are you using stripe's react native SDK?
Is that somethign possible ?
If it's not necessary i would like to don't have to use it
i need to rethink this and make sure i understand, just a sec
No problem
ok, so your kiosk is a mobile platform. you don't currently have any stripe SDK there.
you want to show a QR code, in your own UI, for completing a twint payment
Yes
i only need to get the stripe webhooks on my backend for know if the payment is OK or KO
and you only want to offer twint via QR code, no other payment methods
(at least not on this path)
Yes
Still looking into this
Current situation: i am testing confirming the Twint payment directly during creation using confirm=true but the next_action I'm getting is a redirect URL you'd need to display on the kiosk. It should be possible to do this in a webview, but unclear how the Twint page will react to that and if it will expect an app to be available vs present a QR code to scan
I'm thinking you might need to encode that redirect URL into a QR code yourself for your customer to scan, and get the redirect on the mobile device
Trying to see if we expose a QR code image directly in any way but havent found that so far
Yes maybe i just need to generate the qr code image with the redirectURL value ?
Can you show me how you use confirm=true ?
Because when i try on my backend to do this :
const paymentIntent = await stripe.paymentIntents.create({
amount: 1000,
currency: 'chf',
payment_method_types: ['twint'],
confirm: true
}, {
stripeAccount: 'acct_1RCe7mQx9XYcOq8k'
});
i get an error
You need to specify return_url and payment_method_date[type]=twint too
curl --request POST \
--url https://api.stripe.com/v1/payment_intents \
-u sk_test_123: \
--data amount=1500 \
--data currency=chf \
--data 'payment_method_types[]=twint' \
--data confirm=true \
--data return_url=https://www.example.com/return \
--data 'payment_method_data[type]=twint'
( i did not use connect, but that should be fine)
this will get you a response that includes:
"next_action": {
"redirect_to_url": {
"return_url": "https://www.example.com/return",
"url": "https://pm-redirects.stripe.com/authorize/acct_123/pa_nonce_456"
},
"type": "redirect_to_url"
},
and then you can take next_action[redirect_to_url][url] to encode as a QR to display for customers
Ok and the return_url=https://www.example.com/return gonna do nothing ? on the POST ?
That's where the customer will be redirect on their mobile after payment
so you can point it to a thank you page or order summary etc
or give them instruction on where to get their order or whatever is appropriate
I'm going to share feeback that we should allow exposing the Twint QR code directly in some way
Ok i see thanks you
I juste try and i get this ersponse from stripe sdk :
message: 'The PaymentMethod provided (twint) is not allowed for this PaymentIntent. Please attach a PaymentMethod of one of the following types: card, link, amazon_pay. Alternatively, update the allowed payment_method_types for this PaymentIntent to include "twint".',
Do you know why ?
I have the twint payment method enable on my stripe account, i add it with the stripe method to my connect account but it's not seems to work
sorry my bad i made a mystake