Docs

Biconomy

Learn to setup gasless transactions using TransactionButton and Biconomy's gasless relayers.

This guide assumes you have already installed Connect SDK into your application. If you have not, please refer to the quickstart guide.

  • API Id & Key

    Obtain an API Id and Key using Biconomy. For steps on how to obtain the API Id and Key, refer to the Biconomy documentation.

  • Forwarder Address

    Obtain a Forwarder Address using Biconomy for the specified network. The full list of forwarder addresses can be found on Biconomy documentation

  • Add transaction button

    Add a transaction button for the method you want to sponsor funds for. Pass in the apiId and apiKey obtained earlier from Biconomy's dashboard.

    function Example() {
      return (
        <TransactionButton
          transaction={() => {
            // Create a transaction object and return it
            const tx = prepareContractCall({
              contract,
              method: "mint",
              params: [address, amount],
            });
            return tx;
          }}
          onTransactionSent={(result) => {
            console.log("Transaction submitted", result.transactionHash);
          }}
          onTransactionConfirmed={(receipt) => {
            console.log("Transaction confirmed", receipt.transactionHash);
          }}
          onError={(error) => {
            console.error("Transaction error", error);
          }}
          gasless={{
            provider: "biconomy",
            relayerForwarderAddress: "...",
            apiId: "...",
            apiKey: "...",
          }}
        >
          Confirm Transaction
        </TransactionButton>
      );
    }