Idempotency Keys: How Retries Prevent Double Charges on Payments

A payment can be charged to a card even when the response never reaches the browser, such as during a network drop or timeout. Because the interface treats a timeout as a failure, a user who clicks Pay again may be billed twice. Idempotency keys solve this by giving each payment attempt a unique ID that the backend uses to recognize repeat requests and return the saved result instead of charging again. The interface generates the key once, stores it in session storage, and resends it on every retry, while the backend records each key and its outcome. The guide also recommends disabling the Pay button during processing and loading the amount on the server rather than trusting the browser.