#faz919-ApplePay
forest relic
delicate gulch
Thanks. I can see that the Apple Pay button displayed in your website.
forest relic
yes but the payment req method returns applePay: false and the payment never goes through
delicate gulch
Did you authorize the payment after it goes to processing ?
delicate gulch
I mean did you authorize the payment with either Face ID or Touch ID.
forest relic
it didnt give me the option to do that
on my phone at least, it just goes straight to processing
doesnt ask for faceid
delicate gulch
Can you share with me your merchant ID? you can find it from the Stripe Dashboard -> Settings ->Account Details
forest relic
using test mode keys so i'll share the merchant id in test mode as well
acct_1KYsBGD7lOuiuDEB
or i guess theyre the same huh lol
delicate gulch
OK, in acct_1KYsBGD7lOuiuDEB I don't see any recent payment intent creations logs in either live or test mode
Is https://munchmunch.com.au/ using another account?
forest relic
how can i check that? i'm fairly sure we verified the domain using that account
nevermind, i found it...yes the website is verified on that account
delicate gulch
Ok great. when do you create the payment intent?
because I don't see any payment intent creation in the logs
forest relic
handleButtonClicked is called when apple pay button is clicked
this is my server function
uses netlify serverless functions
delicate gulch
Do you call stripe.confirmCardPayment in the handler function of paymentRequest.on('paymentmethod')?
forest relic
yes
for the record i haven't received a response.error yet
i dont even think it gets that far
delicate gulch
Seems like there's an error in payment intent creation.
Errors in payment intent creation and error reporting.
You might want to check your server log and see why the payment intent creations are failed.
forest relic
ok checking now
seems to be some kind of syntax error: {"errorType":"SyntaxError","errorMessage":"Unexpected end of JSON input","trace":["SyntaxError: Unexpected end of JSON input"," at JSON.parse (<anonymous>)"," at Runtime.exports.handler (/var/task/functions/third-party-pay.js:5:53)"," at Runtime.handleOnce (/var/runtime/Runtime.js:66:25)"]}
5:53 is a JSON.parse
ill keep diagnosing
oh i know what it is...there's extra commas in my json input...hahaha that's dumb
delicate gulch
no worries, btw I don't see response.send() in your server handler, did you call it somewhere else in your code?
forest relic
Don't believe I need that for netlify functions...ill check tho
let me finish removing all the extra commas and get back to you on the result...if that erally was the issue the whole time i feel really stupid
delicate gulch
No problem, and don't feel bad about it, it's impossible to avoid mistakes when coding.
Feel free to come back if you have any questions
forest relic
Hi, sorry, i know this isn't really a relevant question but I seriously don't understand what I'm doing wrong here and i've been stuck on this issue for a couple hours now and my head hurts
Why do i keep getting the "unexpected end of json input" error here??
Where is there a syntax error there
I don't understand why it's unable to do json.parse
Unexpected end of JSON input at JSON.parse (<anonymous>) is the error i keep getting
delicate gulch
How about a console.log() on the req obj and see what it's ?
forest relic
all im pushing is the paymentDetails const
i dont understand why it keeps throwing an error
delicate gulch
Perhaps you want to remove the JSON.parse here?
forest relic
i tried just doing an axios post of the req body and nothing came through
i commented out the whole try catch block
this seems to be a solution
ok now i have a stripe related question: how do i pass the 'amount' and 'currency' to the payment intent from the paymentrequest
should i put event.amount and event.currency here
delicate gulch
The amount/currency that you passed to paymentRequest is to be presented in the Apple Pay payment sheet, the actual amount/currency that your customer will be charged is based on the payment intent.
forest relic
ah ok
thanks
yea this thing is just not working
im seriously not sure what to do here
delicate gulch
What's the new error message now?
forest relic
not getting any from my server function
but i dont even think it's receiving the payload
is there a reason why the payment intent has to be on a middleware function
instead of just frontend
delicate gulch
you need a secret key to create payment intent, and the secret key has to be securely stored in your backend.
forest relic
ah ok
Found out the problem is not related to the JSON parsing. it's just that the function log checks for the req.body object before it exists, which doesn't matter because then it checks again when it receives the object later.
You said you can't see any payment intents created with my merchant ID?
I think it's related to the fact that paymentRequest.canMakePayment() always returns false for applePay even if my device is clearly eligible...or is that not related
delicate gulch
Based on my browser network log, I do see your code sent a request to your backend for payment intent creation, but it failed.
forest relic
ok that's some progress i guess
delicate gulch
so I'd suggest you fix this part first.
forest relic
as opposed to you weren't even seeing any requests before?
delicate gulch
Nope, I saw this request in very first time
forest relic
How is it that I can be copying the stripe-provided example for netlify serverless/stripe payment almost exactly, and still be unable to complete the request?
For reference here are the frontend and server files for the example:
if you look at my code screenshots from earlier i'm doing functionally the same things and yet not getting the same result
delicate gulch
Hi @forest relic my shift is over, my colleague has joined this thread to continue helping you. If your problem can't be resolved in Discord, please reach out to Stripe Support and they'll escalate the issue to us https://support.stripe.com/contact
forest relic
Will do man. Thanks so much for your help
burnt ember
Hi! Do you need more help with this?
forest relic
Yes, i'm not sure how to move forward from here
You can see all the past chat messages right
burnt ember
So is my understanding correct:
- Your account ID is: acct_1KYsBGD7lOuiuDEB
- You try to add Apple Pay to a React app
- When you create a PaymentIntent with Netlify, it doesn't work
Is that accurate?
forest relic
clarification: with a function in netlify serverless functions, but yes all that's correct
burnt ember
Got it! Do you see an error log in your Netlify function?
forest relic
Nope
i'm supposed to receive an error which is then posted to a slack channel, but i haven't actually gotten an error through to slack yet
burnt ember
Can you try to add some logs to your code to understand what is going on? For example to check that the function is called, to check the values received, etc.
forest relic
I take that back; i have been able to get errors through to slack, just not relevant ones
burnt ember
Without any logs it will be difficult to debug.
forest relic
I can't actually see what goes wrong when the apple pay processing fails
forest relic
Can you try to add some logs to your code to understand what is going on? For ex...
will do
the netlify function logger doesn't seem to work very well
but ill keep trying
burnt ember
I never used Netlify before, so I cannot help with that sorry.
forest relic
no probs ill try to figure that part out on my own
but basically i've put loggers at every step of the function and i
'm still not receiving any logs so i've essentially been sitting here in the dark for like 4 hours
ok an error came through
"amount too small" amount must be at least 0.50
curious because on the official website apple pay the example uses $0.01 and it goes through
burnt ember
Great! So at least we know the function is called!
forest relic
yea haha
burnt ember
So try a bigger amount.
forest relic
luckily i know the netlify functions are being called already since i have another one that handles subscriptions and it's been going through fine
forest relic
So try a bigger amount.
yep
ok just made the amount $0.51, it returned a payment intent successfully, but the apple pay thing still said "processing" for 20 seconds and then failed
burnt ember
Can you add some logs to see what the function actually returns?
burnt ember
Looks great, so now we should check the frontend. Could you share a link with the steps to reproduce the issue?
And can you share the frontend code that retrieves the paymentintent?
burnt ember
And can you add some logs to the frontend code also?
To see what you actually receive from the Netlify function?
Also if you have a URL to share with steps on how to reproduce the issue, that would help.
forest relic
reproduce issue: go to https://munchmunch.com.au/, click on apple pay button
latest site version should show it before form is filled out, just for testing
yea i just set up logging on everything and still nothing going thru
not receiving the payment intent object on frontend side
still getting processing loading and then failing
burnt ember
I'm sorry but I need to step out, ynnoj will be here soon to help.
tawny ether
Yep, absolutely you should do that!
The API request to create the Payment Intent isn't even fired from the front-end from what I can tell
forest relic
i had it making the payment intent when the button is clicked
based on the example given from stripe on using netlify serverless
tawny ether
Where's that?
tawny ether
Hmm, are there any logs in your Netlify function indicating an issue? Are there Payment Intents being created in your Dashboard?
forest relic
let me check
tawny ether
This is the best guide to follow, FYI: https://stripe.com/docs/stripe-js/elements/payment-request-button
forest relic
tawny ether
I'd recommend calling the PI creation before initialising the paymentRequest instance
forest relic
ok let me try that
will it update the unit amount accordingly though
if i use paymentrequest.update
before the button is clicked
nvm stupid question, updating site now
tawny ether
You're gonna need to provide the full context of your front-end code as you've only shared a small snippet
forest relic
``
that's the relevant bit
important info: the finalPrice.total is initially null but gets changed later on depending on form responses
and paymentRequest is just a useState that's initially null
tawny ether
Just ran through this again, why are you using live keys to test?
Anyway, few errors in the console of your demo:
Invalid value for createPaymentMethod: card should be an object or element. You specified: null.-
When requesting shipping information, you must specify shippingOptions once a shipping address is selected.
Either provide shippingOptions in stripe.paymentRequest(...) or listen for the shippingaddresschange event and provide shippingOptions to the updateWith callback there.
Not sure why you're using createPaymentMethod?
forest relic
nah that's for something different
not related to apple pay
that's for the subscription if you type in your card details manually
tawny ether
I saw that error when I clicked Google Pay
Anyway, I suggest you just write in to our team: https://support.stripe.com/contact
This is too in-depth for us to resolve easily here. I'd also recommend you revisit your integration to be more inline with our docs here: https://stripe.com/docs/stripe-js/elements/payment-request-button
The sample you're following is pretty old as this point
forest relic
I saw that error when I clicked Google Pay
ah strange, ill check it out
yea, now im 100% making the payment intent before the user clicks the button, still nothing
forest relic
Just ran through this again, why are you using live keys to test?
Not using live keys