#talon_api

1 messages ¡ Page 1 of 1 (latest)

graceful bronzeBOT
#

👋 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/1283505829605146667

📝 Have more to share? Add more details, code, screenshots, videos, etc. below.

Below are links to other discussions we've had with you in the past week in case you want to review that information. If your question is related to one of these previous discussions, please provide a comprehensive summary of the current state and what you need help with now. We help many users simultaneously, so a summary allows us to resolve your issue as soon as possible.

gloomy crow
#

Hello

#

Do you have a live card in your Apple Wallet?

#

And are you serving over HTTPS?

wide ice
#

react with ngrok

# 
const CheckoutPage = () => {
  const stripe = useStripe();
  const elements = useElements();
  const [errorMessage, setErrorMessage] = useState();

  const onConfirm = async (event) => {
    if (!stripe) {
      // Stripe.js hasn't loaded yet.
      // Make sure to disable form submission until Stripe.js has loaded.
      return;
    }
    const {error: submitError} = await elements.submit();
    if (submitError) {
      setErrorMessage(submitError.message);
      return;
    }

    // Create the PaymentIntent and obtain clientSecret
    const res = await fetch('/create-intent', {
      method: 'POST',
    });
    const {client_secret: clientSecret} = await res.json();

    // Confirm the PaymentIntent using the details collected by the Express Checkout Element
    const {error} = await stripe.confirmPayment({
      // `elements` instance used to create the Express Checkout Element
      elements,
      // `clientSecret` from the created PaymentIntent
      clientSecret,
      confirmParams: {
        return_url: 'https://example.com/order/123/complete',
      },
    });

    if (error) {
      // This point is only reached if there's an immediate error when
      // confirming the payment. Show the error to your customer (for example, payment details incomplete)
      setErrorMessage(error.message);
    } else {
      // The payment UI automatically closes with a success animation.
      // Your customer is redirected to your `return_url`.
    }
  };

  return (
    <div id="checkout-page">
      <h1>hello</h1>
      <ExpressCheckoutElement onConfirm={onConfirm} />
      {errorMessage && <div>{errorMessage}</div>}
    </div>
  );
};
gloomy crow
#

Do you have a live card in your wallet?

#

That is required for Apple Pay to show up. In test mode we will swap out your live card for a test card when you test. However for the button to show you have to have an actual card in your Apple Wallet

wide ice
#

oh

#

i never did anything to my wallet in my laptop

#

i will try to setup wallet first

gloomy crow
#

Sounds good

wide ice
#

possible on laptop right?

gloomy crow
#

If you are on a Mac then yes

#

Otherwise if you have an iPhone then you could test using that too

wide ice
#

well that's a big blocker

gloomy crow
#

Yeah can't help you with that, sorry.

wide ice
#

i need to buy a new keyboard to test it ? lol

gloomy crow
#

No you shouldn't really

#

You do need to have touch ID enabled though I believe

#

For authorization

#

So I'd check on that

wide ice
#

so should i go buy a new keyboard or what?

gloomy crow
wide ice
#

maybe an iphone can be used

gloomy crow
#

Yeah iPhone uses face ID for verification generally so that should work

#

If you have an iPhone I'd test with that

wide ice
#

and does google pay works on web?

#

nvm, i just opened the link my mobile and it worked. lol

#

what component we can use for react native for the same thing?
ExpressCheckoutElement as in react

gloomy crow
#

You use PlatformPayButton with React Native