Checkout: Legacy Legacy

⭐️ Minimal reference integration: A single legacy Checkout button

⚠️ Note: This integration is not production ready and should only be used as a reference.

❌ This is a legacy integration and is no longer recommended. If you're building something new you should be using a newer, modern approach instead.

⚙️ Integration


      

🧑‍💻 Code

<form action="/test/checkout-legacy/">
  <script
    src="https://checkout.stripe.com/checkout.js" class="stripe-button"
    data-key="pk_test_51O2hxMC4JnNRtz8VToJJbGHrFTPPr6TkP09h7ql3YJaqpNcxoSNxtk38glyzi9VrZKStns858YynOO2ZyGmU7VRi00CIUWuUdk"
    data-amount="4200"
    data-name="Example Name"
    data-description="Widget"
    data-image=""
    data-locale="auto"
    data-zip-code="true"
    data-currency="usd">
  </script>
</form>

<pre id="output"></pre>
// Note: No JavaScript is required for this integration
// This code is only here to show the GET parameters from the URL

const outputElement = document.querySelector('#output');

const urlSearchParams = new URLSearchParams(window.location.search);

let paramsPresent = false;

let paramsString = '';

for (const [key, value] of urlSearchParams.entries()) {
  paramsPresent = true;
  
  paramsString += "\n\n" + 'key: ' + key + "\n" + 'value: ' + value;
}

if (paramsPresent) {
  paramsString = 'GET parameters from URL:' + paramsString;
  
  outputElement.textContent = paramsString;
}