Skip to content
Developer guides

Add crypto checkout to a JavaScript website

Add JavaScript checkout without exposing merchant API keys or trusting browser-provided prices and payment results.

THE SHORT ANSWER

Use JavaScript in the browser to start your own checkout flow, while a trusted backend creates the Coinvay invoice. A secure integration exposes a checkout URL to the browser and keeps merchant credentials and order pricing on the server.

Give the browser a narrow job

Your Pay with crypto button can submit an internal SKU and cart reference to your own backend. It should not submit a trusted total, a private merchant key or a receiving address that overrides your account settings. The server authenticates the customer where appropriate, retrieves catalog data and constructs the payment request. This works with a plain JavaScript website or a larger frontend framework without changing the security boundary.

Redirect using a saved server result

Suppose a customer purchases a 25.00 USD design asset. The backend records the intended order, creates the Coinvay invoice and saves its ID before returning the hosted checkout URL. Browser JavaScript can then navigate to that URL and show a pending-order screen on return. Avoid accepting an arbitrary redirect host from client input. A customer returning from checkout may still be waiting for confirmations, so the screen should ask your own backend for current status.

Treat confirmation as asynchronous

Process a signed payment webhook or reconcile the saved invoice by ID before granting the download. Your server should queue fulfillment once and let the frontend display the resulting entitlement. Include a useful waiting message, a support reference and a retry path for network failures. The Vanilla JavaScript kit is a source integration kit that still requires its backend and persistent order store. It is not a safe way to call privileged merchant APIs directly from a public web page.

Practical checklist

  • Send product identifiers to your backend and calculate trusted totals there.
  • Return a controlled hosted-checkout URL after saving the invoice mapping.
  • Keep API keys out of bundles, source maps, browser storage and analytics events.

Common questions

Do I need a particular JavaScript framework?+

No. The browser-to-your-backend-to-Coinvay pattern is framework independent. Your backend and durable fulfillment logic matter more than the frontend library.

Can a browser transaction hash mark an order paid?+

No. A hash is a reference for verification. Your backend must rely on authenticated invoice status or properly verified settlement notifications.

Sources and further reading

Primary references and Coinvay product documentation. Check the linked pages for current details.

  1. Coinvay merchant API documentation

AI-assisted drafting, published by Coinvay. Examples are illustrative. Read our editorial approach.

Back to all articles