Redirect to checkout

The frontend only needs to call your own server, receive the checkoutUrl, and redirect. It never needs to know a Taria Pay API key, and it should never create payment orders directly.

This is the Hosted Checkout path. If you just want a payment button on your own page, use the Checkout Button to open the same hosted checkout URL. If you want buyers to stay on your site, use the Checkout Panel.

Recommended flow

1. The buyer clicks the pay button on your website.
2. The frontend calls your server endpoint.
3. Your server creates a payment intent.
4. The server returns checkoutUrl.
5. The frontend redirects to checkoutUrl.

React example

async function handleCheckout() {
  const response = await fetch("/api/tariapay/create-payment", {
    method: "POST",
  });

  const payload = await response.json();

  if (!response.ok || !payload.checkoutUrl) {
    throw new Error(payload.error ?? "Failed to create checkout");
  }

  window.location.assign(payload.checkoutUrl);
}

Using the SDK browser helper

If you use @tariapay/sdk/browser, you can also redirect like this:

import { redirectToCheckout } from "@tariapay/sdk/browser";

redirectToCheckout(payload.checkoutUrl);

Success and cancel pages

successUrl and cancelUrl exist to improve the buyer experience:

• successUrl: where the buyer returns after completing payment
• cancelUrl: where the buyer returns after canceling or leaving the checkout flow

They are not a substitute for webhooks. A buyer landing on the success page only means the browser completed the redirect — it does not mean your order system is ready to ship goods or grant access.

Next steps

• Create a payment order: Create a payment order
• Payment button or Checkout Panel: Checkout Button and Checkout Panel
• Receive the final result: Receive payment results