NFT Checkout

Let your users purchase ERC-721 or ERC-1155 NFT tokens either with fiat or crypto tokens requested by your NFT marketplace.

  1. First, follow the SDK setup and User Sign-in steps in the previous sections.

  2. Then, white-label your NFT marketplace by contacting Singularity tech team and completing the integration steps.

Once done, you can call the following Singularity Payments APIs to initiate transactions and subscribe to the below callbacks to take action on payment completions or errors.

Buy NFT API
  1. On your UI, let the user choose the NFT they want to purchase along with the quantity of the NFT desired (in case of ERC-1155).

    Note: Only purchases with a single Seller are currently supported.

  2. Important: Please make sure to mention the user's wallet address in the payload so that funds can be correctly transferred to the user's wallet. If not mentioned, the tokens will be wrongly delivered to your own registered address.

  3. Call the Singularity transaction API as follows:

const clientReferenceId = uuidv4(); //Your internal transaction reference ID
const body = {
    clientReferenceId: "clientReferenceId", // unique reference id for txn sent from the client
    singularityTransactionType: "NFT_PURCHASE",
    transactionLabel: "TRANSACTION_LABEL",
    transactionIconLink: "<URL_of_NFT_image_to_be_shown_to_the_user>", // Any public url of png or jpg of the NFT. This will be shown to the user during payment flow.
    clientReceiveObject: {
        clientRequestedAssetId: "190110", // This is Singularity's internal ID for the token that the NFT is priced in. Contact us for other token ids.
        address: "0x17F547ae02a94a0339c4CFE034102423907c4592" // This field points to who will receive the NFT asset. Please always pass the user's address in this field otherwise the NFT may transfer to the wrong address
    },
    userReceiveAssetDetailsList: [
        {
            marketplaceId: "<Singularity Marketplace ID>", // Contact us to register your marketplace ID
            userRequestedNFTId: "1",
            userRequestedNFTAddress: "0x615e08d9b86e54a5993e4b519deee47bada18ae2",
            userRequestedNFTQuantity: "1",
            userRequestedNFTType: "ERC1155",
            userRequestedNFTPrice: "0.001", // Price of the NFT in the token captured in clientRequestedAssetId above
            userRequestedNFTTradeType: "BUY",
            seaportData: {
                seaportOrderData: "<json-string containing seaport data>", //See sample payload in the example below
                seaportOrderHash: "0x43ef6e65e0eb854612306ab7043faf51e24c8a69241b4df81b46eb924b0a3541" // The //Seaport Order Hash for this or order
            }
        }
    ]
};

const requestString = JSON.stringify(body)

window.SingularityEvent.transactionFlow(requestString);


/* Sample payload for seaport order data
{
   "clientReferenceId": "8e0e85c2-5b6f-4795-a168-11d0a3b5b357",
   "singularityTransactionType": "NFT_PURCHASE",
   "clientReceiveObject": {
       "clientRequestedAssetId": "190110",
       "address": "0xCA4511435F99dcbf3Ab7cba04C8A16721eB7b894"
   },
   "transactionIconLink": "https://singularity-web-assets-public.s3.ap-south-1.amazonaws.com/s9ynft.jpeg",
   "transactionLabel": "S9Y NFT",
   "userReceiveAssetDetailsList": [
       {
           "marketplaceId": "ALTURA_MARKETPLACE_19011",
           "userRequestedNFTId": "1",
           "userRequestedNFTAddress": "0x615e08d9b86e54a5993e4b519deee47bada18ae2",
           "userRequestedNFTQuantity": "1",
           "userRequestedNFTType": "ERC1155",
           "userRequestedNFTPrice": "0.001",
           "userRequestedNFTTradeType": "BUY",
           "seaportData": {
               "seaportOrderHash": "0xd18038d2f3f11f6559a46194ceb82ef4e88ef0dea70d51aa916aacb8fdf6d5fa",
               "seaportOrderData": {
    "offerer": "0x17F547ae02a94a0339c4CFE034102423907c4592",
    "zone": "0x0000000000000000000000000000000000000000",
    "zoneHash": "0x0000000000000000000000000000000000000000000000000000000000000000",
    "startTime": "1701786837",
    "endTime": "115792089237316195423570985008687907853269984665640564039457584007913129639935",
    "orderType": 1,
    "offer": [
      {
        "itemType": 3,
        "token": "0x615e08d9b86e54a5993e4b519deee47bada18ae2",
        "identifierOrCriteria": "1",
        "startAmount": "1000000",
        "endAmount": "1000000"
      }
    ],
    "consideration": [
      {
        "itemType": 0,
        "token": "0x0000000000000000000000000000000000000000",
        "identifierOrCriteria": "0",
        "startAmount": "960000000000000000000",
        "endAmount": "960000000000000000000",
        "recipient": "0x17F547ae02a94a0339c4CFE034102423907c4592"
      },
      {
        "itemType": 0,
        "token": "0x0000000000000000000000000000000000000000",
        "identifierOrCriteria": "0",
        "startAmount": "40000000000000000000",
        "endAmount": "40000000000000000000",
        "recipient": "0xf2f9ed9f20696d900d324514552238023f649b51"
      }
    ],
    "totalOriginalConsiderationItems": 2,
    "salt": "0x0000000066d5ef065b84ef9e",
    "conduitKey": "0x0000000000000000000000000000000000000000000000000000000000000000",
    "counter": "0",
    "signature": "0x7bae694b23cdd5a5cf680737fae81ff4c8c1aef3b7e637b74146fc1977779f834adb599bdefbeab401d6db4dae56a3c6da88a3286e82f1c5c49f4614626c49bf"
              }
           }
       }
   ]
}
*/
Setup Subscriptions for Payments Callback

You can subscribe to the following callback events to get the status of the transaction by using the following subscribe functionality:

SingularityEvent.subscribe('SingularityEvent-onTransactionApproval', callbackFunctionWithTransactionDataAsArgument);
//eg.
//window.SingularityEvent.subscribe(
//          'SingularityEvent-onTransactionApproval',
//          data => {
//            console.log('Txn approved', JSON.parse(data));
//          }
//        );
//Event when a transaction is approved by the user but has not completed. At this time you may close the Singularity drawer (using APIs detailed above) and show something like a spinner telling the user that you are waiting for the payment confirmation. The transactionData will contain the details of the transaction approved.

SingularityEvent.subscribe('SingularityEvent-onTransactionSuccess', callbackFunctionWithTransactionDataAsArgument);
//Event when a transaction is successfully completed by the user. The transactionData will contain the details of the transaction completed.

SingularityEvent.subscribe('SingularityEvent-onTransactionFailure', callbackFunctionWithTransactionDataAsArgument);
//Event when a transaction fails. The transactionData will contain the details of the transaction failed.

Sample Implementation

https://github.com/coinbrix/demo-app/

Last updated