# Apa Universal JS Button

Canonical: https://apa.app/developers/js-button
Script: https://apa.app/button.js

The Universal JS Button lets a merchant add Apa hosted checkout to any HTML page with one script tag. It is for simple fixed-amount payments, CMS embeds, no-code pages, tips, landing pages, and simple product buttons. It does not expose an Apa secret API key in the browser.

## Copy-paste button

```html
<script
  src="https://apa.app/button.js"
  data-apa-amount="25.00"
  data-apa-currency="USD"
  data-apa-payout-asset="USDC"
  data-apa-payout-network="solana"
  data-apa-payout-address="8dK3...p91A"
  data-apa-display-name="My shop"
  data-apa-description="Order #1042"
  data-apa-success-url="https://store.example/thanks"
  data-apa-cancel-url="https://store.example/cart"
></script>
```

## Manual mount

```html
<div id="apa-button"></div>
<script src="https://apa.app/button.js" data-apa-render="false"></script>
<script>
  ApaCheckout.mount(document.querySelector("#apa-button"), {
    amount: "25.00",
    currency: "USD",
    payoutAsset: "USDC",
    payoutNetwork: "solana",
    payoutAddress: "8dK3...p91A",
    displayName: "My shop",
    description: "Custom order",
    successUrl: "https://store.example/thanks",
    cancelUrl: "https://store.example/cart"
  });
</script>
```

## Required attributes

- `data-apa-amount`: USD amount.
- `data-apa-payout-address`: merchant settlement wallet.
- `data-apa-payout-asset`: settlement asset such as USDC, USDT, ETH, or SOL.
- `data-apa-payout-network`: settlement network such as solana, base, ethereum, polygon, or arbitrum.

## Security guidance

- Never put `sk_live_` API keys in the browser.
- Use the button only when the amount and payout wallet are safe to publish in page HTML.
- Use server-created checkout sessions for carts, coupons, inventory, customer accounts, fraud checks, or anything that must come from trusted backend state.
- Apa creates a hosted public checkout and redirects the customer to `apa.app/checkout/cs_...`.
