Goal
By the end of this guide, you should be able to open a new window with Sardine NFT Checkout, either in a new tab or in a new browser window.
By the end of this guide, you should be able to open a new window with Sardine NFT Checkout, either in a new tab or in a new browser window.
Implementing NFT Checkout
Before we start, you’ll need the following parameters
jsonSchema
1. Obtain authorization token
The next step is to obtain theclientToken
, which is a unique identifier for each session and user.
Make a POST request to /v1/auth/client-tokens
using Basic Auth by passing base64 encoding of <clientId>:<clientSecret>
The body of this request is used to send information about the NFT and the user to Sardine. More information about this endpoint can be found here
jsonSchema
http
If the request is successful, you should receive a response that contains the
clientToken
, which is needed to create the Checkout
Use your base64 encode( clientId:clientSecret ) to make a call
Constraints
- referenceId - unique
- expiresIn - 300 to 3600 ( 5min - 1hr)
address
can be passed which is the receiving wallet address of the user
2. Understand Post transaction events
Sardine will emit events which can be handled to understand user actionexpired
- The user didn’t complete the transaction within the expiration
parameter
processed
- The payment is complete, and the NFT can now be transferred the user.
declined
- The transaction was declined due to issues with their payment method or risk profile.
3. Embed NFT checkout
Once the checkout URL has been generated, it can be embedded into your web app as an iframe, with event handlers to catch events sent by the iframe. Sample code to embed NFT checkoutRecommended size is width=500, height=700 for new window
4. Get Confirmation of Trade Status
After the purchase has been completed, thereferenceId
or the clientToken
can be used to fetch information about the respective transaction by calling the Orders endpoint
The order can have one of these statuses
draft
- This is an open or ongoing order
processed
- The payment has been completed.
expired
- The user didn’t complete the transaction within the expiration
time
declined
- The transacation was declined, due to payment method issues
complete
- The payment is complete and the NFT has been delivered to the user
cancelled
- The order is cancelled
http
5 . Testing and Verification
Once the defined URL has been set and triggered, it should open an iframe that goes through the user flows for Sardine’s NFT checkout. This should match the screen show on the [User Flows Page]You should now be able to route users to the Sardine Checkout Widget via your defined URL where they can instantly buy NFTs!