How to Integrate with the Algorand Blockchain with Magic

How to Integrate with the Algorand Blockchain with Magic

#Installation

Magic interacts with the Algorand blockchain via Magic's extension NPM package @magic-ext/algorand. The Algorand extension also lets you interact with the blockchain using methods from Algorand's Javascript SDK.

note

You can skip straight to our kitchen sink example directly:

👉 Algorand Example

#NPM

npm install --save @magic-ext/algorand

#Yarn

yarn add @magic-ext/algorand

#Initializing Extension

#ES Modules/TypeScript

import { Magic } from 'magic-sdk';
import { AlgorandExtension } from '@magic-ext/algorand';

const magic = new Magic('YOUR_API_KEY', {
  extensions: {
    algorand: new AlgorandExtension({
      rpcUrl: '', // should remain empty
    }),
  },
});

#Get User Info

#Get Wallet

Using getWallet function to get Algorand public address for current user.

#ES Modules/TypeScript

import { Magic } from 'magic-sdk';
import { AlgorandExtension } from '@magic-ext/algorand';

const magic = new Magic('YOUR_API_KEY', {
  extensions: {
    algorand: new AlgorandExtension({
      rpcUrl: '',
    }),
  },
});

// Get user's Algorand public address
const publicAddress = await magic.algorand.getWallet();
console.log('algorand public address', publicAddress);

#Sign Transaction

#Getting Test Algorand

Before you can send transaction on the Algorand blockchain, you'll need to acquire some test Algorand.

  1. Go to our Algorand Example application
  2. Login with your email address
  3. Copy your Algorand public address
  4. Go to the Algorand Faucet
  5. Paste your copied Algorand public address in the text input
  6. Now you can use your test Algorand in our example app

#Call Extension Method

Note that the Magic Algorand extension follows the method names and conventions by Algorand's Javascript SDK. To sign a standard Algorand blockchain transaction, you can call the magic.algorand.signTransaction() method.

#ES Modules/TypeScript

import { Magic } from 'magic-sdk';
import { AlgorandExtension } from '@magic-ext/algorand';

const magic = new Magic('YOUR_API_KEY', {
  extensions: {
    algorand: new AlgorandExtension({
      rpcUrl: '',
    }),
  },
});

const sendPaymentTransaction = async () => {
  // Construct Payload
  let params = await algodClient.getTransactionParams().do();
  let note = new TextEncoder().encode("Hello World");
  let txn = algosdk.makePaymentTxnWithSuggestedParams(
    from,
    to,
    amount,
    closeRemainderTo,
    note,
    params
  );
  console.log("txn", txn);

  // Sign Payload
  let encodedTxn = algosdk.encodeObj(txn.get_obj_for_encoding());
  const signedTxn = await magic.algorand.signTransaction(encodedTxn);
  // Broadcast Tx
  const hash = await algodClient.sendRawTransaction(signedTxn.blob).do();
  console.log("hash", hash);
  // Wait for confirmation
  const receipt = await waitForConfirmation(algodClient, hash.txId, 4);
  console.log("receipt", receipt);
};

const sendAssetConfigTransaction = async () => {
  // Construct Payload
  let params = await algodClient.getTransactionParams().do();
  let txn = algosdk.makeAssetCreateTxnWithSuggestedParams(
    from,
    note,
    totalSupply,
    decimals,
    defaultFrozen,
    manager,
    reserve,
    freeze,
    clawback,
    unitName,
    assetName,
    assetURL,
    assetMetadataHash
    params
  );
  console.log("txn", txn);

  // Sign Payload
  let encodedTxn = algosdk.encodeObj(txn.get_obj_for_encoding());
  const signedTxn = await magic.algorand.signTransaction(encodedTxn);
  // Broadcast Tx
  const hash = await algodClient.sendRawTransaction(signedTxn.blob).do();
  console.log("hash", hash);
  // Wait for confirmation
  const receipt = await waitForConfirmation(algodClient, hash.txId, 4);
  console.log("receipt", receipt);
};

const sendAssetTransferTransaction = async () => {
  // Construct Payload
  let params = await algosdk.getTransactionParams().do();
  let txn = algosdk.makeAssetTransferTxnWithSuggestedParams(
    from,
    to,
    closeRemainderTo,
    revocationTarget,
    amount,
    note,
    assetIndex, // can get from from acfg tx receipt
    params
  );

  // Sign Payload
  let encodedTxn = algosdk.encodeObj(txn.get_obj_for_encoding());
  const signedTxn = await magic.algorand.signTransaction(encodedTxn);
  // Broadcast Tx
  const hash = await algosdk.sendRawTransaction(signedTxn.blob).do();
  console.log("hash", hash);
  // Wait for confirmation
  const receipt = await waitForConfirmation(algosdk, hash.txId, 4);
  console.log("receipt", receipt);
};

#Sign Bid

#Call Extension Method

Note that the Magic Algorand extension follows the method names and conventions by Algorand's Javascript SDK. To sign a standard Algorand blockchain Bid, you can call the magic.algorand.signBid() method.

#ES Modules/TypeScript

import { Magic } from 'magic-sdk';
import { AlgorandExtension } from '@magic-ext/algorand';

const magic = new Magic('YOUR_API_KEY', {
  extensions: {
    algorand: new AlgorandExtension({
      rpcUrl: '',
    }),
  },
});

const bid = {
  bidderKey: 'IB3NJALXLDX5JLYCD4TMTMLVCKDRZNS4JONHMIWD6XM7DSKYR7MWHI6I7U',
  auctionKey: '7ZUECA7HFLZTXENRV24SHLU4AVPUTMTTDUFUBNBD64C73F3UHRTHAIOF6Q',
  bidAmount: 1000,
  maxPrice: 10,
  bidID: 2,
  auctionID: 56,
};

const tx = await magic.algorand.signBid(bid);

console.log('signed bid', tx);

#Sign Group Transaction

Call Extension Method

To sign a standard Algorand blockchain Group transaction with magic user, you can call the magic.algorand.signGroupTransaction() method.

import { Magic } from "magic-sdk";
import { AlgorandExtension } from "@magic-ext/algorand";
const algosdk = require('algosdk');

const magic = new Magic('YOUR_API_KEY', {
    extensions: {
        algorand: new AlgorandExtension({
            rpcUrl: ''
        })
    }
});

let client = null;
async function setupClient() {
    if( client == null){
      const token = {
        "x-api-key": "x api key"
      };
      const server = "algorand rpc url";
      const port = '';
      let algodClient = new algosdk.Algodv2(token, server, port);
      client = algodClient;
    } else {
      return client;
    }
    return client;
}


let algodClient = await setupClient();

let params = await algodClient.getTransactionParams().do();

const txns = [{
  from: 'magic user public address',
  to: 'OFHW3Z3T2RML7J2S6KYGHPAMO6IQH76PE2HSCAIN5U5NBGXAIPBOY7DCHI',
  amount: 1000000,
  closeRemainderTo: undefined,
  note: undefined,
  suggestedParams: params,
},
  {
    from: 'magic user public address',
    to: 'XRKQBEV7FINQ66SYAFY33UYHOC4GRAICWI3V6V2TXLCQMPJBGGRHLG2E74',
    amount: 1000000,
    closeRemainderTo: undefined,
    note: undefined,
    suggestedParams: params,
  }
]

const signedTX = await magic.algorand.signGroupTransaction(txns);

console.log("signedTX", signedTX);

#Sign Group Transaction V2

Call Extension Method

To sign a standard Algorand blockchain Group transaction with magic user, you can call the magic.algorand.signGroupTransactionV2() method.

import { Magic } from "magic-sdk";
import { AlgorandExtension } from "@magic-ext/algorand";
const algosdk = require('algosdk');

const magic = new Magic('YOUR_API_KEY', {
    extensions: {
        algorand: new AlgorandExtension({
            rpcUrl: 'algorand rpc url'
        })
    }
});


  let algodClient = await setupClient();

  let suggestedParams = await algodClient.getTransactionParams().do();

  const txn1 = algosdk.makePaymentTxnWithSuggestedParamsFromObject({
    from: publicAddress,
    to: 'OFHW3Z3T2RML7J2S6KYGHPAMO6IQH76PE2HSCAIN5U5NBGXAIPBOY7DCHI',
    amount: 1000,
    suggestedParams,
  });

  const txn2 = algosdk.makePaymentTxnWithSuggestedParamsFromObject({
    from: publicAddress,
    to: 'XRKQBEV7FINQ66SYAFY33UYHOC4GRAICWI3V6V2TXLCQMPJBGGRHLG2E74',
    amount: 2000,
    suggestedParams,
  });

  const txs = [txn1, txn2];
  algosdk.assignGroupID(txs);

  const txn1B64 = Buffer.from(txn1.toByte()).toString('base64');
  const txn2B64 = Buffer.from(txn2.toByte()).toString('base64');

  const txn = [
    {txn: txn1B64},
    {txn: txn2B64},
  ];

  const signedTX = await magic.algorand.signGroupTransactionV2(txn);

  console.log('sign group transaction v2', signedTX);

Did you find what you were looking for?

How to Integrate with the Algorand Blockchain with Magic

Did you find what you were looking for?