Signing Transactions

When it comes to transaction signing, using Capsule is just as straightforward as using any regular or default wallet.

Signing Transactions

The below examples assume you have already setup the Capsule object and created a user and an associated wallet. If you have not completed these steps yet, please refer to the Initial Setupand Creating Users & Wallets sections first.

For ease of integration, Capsule has created class extensions that are fully compatible with two popular libraries, ethersjs and viem

Server-Side Signing

In addition to the Web SDK, Capsule offers a Node.js compatible server side SDK. This can be used to import an active session from client-side after a user has authenticated and sign from the backend. This can be useful in cases where transactions signing is already occurring from a backend. This functionality relies upon the developer exporting a session from the client side and importing it server-side, as shown in the code snippets below.

Ethers

import { CapsuleEthersSigner } from '@usecapsule/ethers-v6-integration';
import { ethers } from 'ethers';

const provider = new ethers.JsonRpcProvider(
  CHAIN_PROVIDER,
  CHAIN,
);
const example_tx = {
  from: CURRENT_WALLET_ADDRESS,
  to: DEFAULT_TO_ADDRESS,
  value: 10101010000000,
  gasLimit: 21000,
  maxPriorityFeePerGas: 1000000000,
  maxFeePerGas: 3000000000,
  nonce: await provider.getTransactionCount(currentWallet.address),
  chainId: '11155111',
  type: 2,
};

const ethersSigner = new CapsuleEthersSigner(capsule, provider);
const res = await ethersSigner.sendTransaction(example_tx)

import { CapsuleEthersSigner } from '@usecapsule/ethers-v6-integration';
import { ethers } from 'ethers';

const provider = new ethers.JsonRpcProvider(
  CHAIN__PROVIDER,
  CHAIN,
);    
await capsule.init();  // Mobile only
const example_tx = {
  from: CURRENT_WALLET_ADDRESS,
  to: DEFAULT_TO_ADDRESS,
  value: 10101010000000,
  gasLimit: 21000,
  maxPriorityFeePerGas: 1000000000,
  maxFeePerGas: 3000000000,
  nonce: await provider.getTransactionCount(currentWallet.address),
  chainId: '11155111',
  type: 2,
};

const ethersSigner = new CapsuleEthersSigner(capsule, provider);
const res = await ethersSigner.sendTransaction(example_tx)

// in frontend - once a user is created/signed in, you can export the session
const serializedSession = capsule.exportSession();
// then transfer `serializedSession` to your backend over some secure method

// in backend - import `serializedSession` to enable signing functionality
import { CapsuleEthersSigner } from '@usecapsule/ethers-v6-integration';
import Capsule, { Environment } from '@usecapsule/server-sdk';
import { ethers } from 'ethers';

const capsule = new Capsule(Environment.DEVELOPMENT, YOUR_API_KEY);
// read in `serializedSession` from your secure transfer method
await capsule.importSession(serializedSession);

const ethersSigner = new CapsuleEthersSigner(capsule, undefined);
const signature = await ethersSigner.signMessage('hello-world');

Viem

import { createCapsuleViemClient } from '@usecapsule/viem-v1-integration';
import { http } from 'viem';

const viemClient = createCapsuleViemClient(capsule, {
  chain: CHAIN,
  transport: http(CHAIN_PROVIDER),
});

const example_tx = {
  value: BigInt(101010100000000),
  to: DEFAULT_TO_ADDRESS,
  chain: CHAIN,
  gas: BigInt(21000),
  maxPriorityFeePerGas: BigInt(1000000000),
  maxFeePerGas: BigInt(3000000000),
  account: viemClient.account!,
  nonce: 0,
};
await viemClient.sendTransaction(example_tx);

import { createCapsuleViemClient } from '@usecapsule/viem-v1-integration';
import { http } from 'viem';

const viemClient = createCapsuleViemClient(capsule, {
  chain: CHAIN,
  transport: http(CHAIN_PROVIDER),
});

await capsule.init();  // Mobile only
const example_tx = {
  value: BigInt(101010100000000),
  to: DEFAULT_TO_ADDRESS,
  chain: CHAIN,
  gas: BigInt(21000),
  maxPriorityFeePerGas: BigInt(1000000000),
  maxFeePerGas: BigInt(3000000000),
  account: viemClient.account!,
  nonce: 0,
};
await viemClient.sendTransaction(example_tx);

// in frontend - once a user is created/signed in, you can export the session
const serializedSession = capsule.exportSession();
// then transfer `serializedSession` to your backend over some secure method

// in backend - import `serializedSession` to enable signing functionality
import Capsule, { Environment } from '@usecapsule/server-sdk';
import { createCapsuleViemClient } from '@usecapsule/viem-v1-integration';
import { http } from 'viem';

const capsule = new Capsule(Environment.DEVELOPMENT, YOUR_API_KEY);
// read in `serializedSession` from your secure transfer method
await capsule.importSession(serializedSession);

const viemClient = createCapsuleViemClient(capsule, {
  chain: CHAIN,
  transport: http(CHAIN_PROVIDER),
});

const example_tx = {
  value: BigInt(101010100000000),
  to: DEFAULT_TO_ADDRESS,
  chain: CHAIN,
  gas: BigInt(21000),
  maxPriorityFeePerGas: BigInt(1000000000),
  maxFeePerGas: BigInt(3000000000),
  account: viemClient.account!,
  nonce: 0,
};
await viemClient.sendTransaction(example_tx);

Cosmos - Cosm.js

Capsule has also created a cosmjs-compatible signer for builders in the Cosmos Ecosystem.

import { CapsuleProtoSigner } from '@usecapsule/cosmjs-v0-integration';
import { SigningStargateClient } from '@cosmjs/stargate';

// prefix is optional and used to indicate a non cosmos address
// eg 'celestia' to use 'celestia1...' addresses
const protoSigner = new CapsuleProtoSigner(capsule, prefix);
const client = await SigningStargateClient.connectWithSigner(
  COSMOS_TESTNET_RPC,
  protoSigner,
);

await client.getAccount(protoSigner.address));
await client.getAllBalances(protoSigner.address));
const fromAddress = protoSigner.address;

await client.sendTokens(
  fromAddress,
  COSMOS_DEFAULT_TO_ADDRESS,
  [
    {
      denom: 'uatom',
      amount: '9500',
    },
  ],
  {
    amount: [
      {
        amount: '500',
        denom: 'uatom',
      },
    ],
    gas: '200000',
  },
 );

import { CapsuleProtoSigner } from '@usecapsule/cosmjs-v0-integration';
import { SigningStargateClient } from '@cosmjs/stargate';

const protoSigner = new CapsuleProtoSigner(capsule);
const client = await SigningStargateClient.connectWithSigner(
  COSMOS_TESTNET_RPC,
  protoSigner,
);

await capsule.init();  // Mobile only
await client.getAccount(protoSigner.address);
await client.getAllBalances(protoSigner.address);
const fromAddress = protoSigner.address;

await client.sendTokens(
  fromAddress,
  COSMOS_DEFAULT_TO_ADDRESS,
  [
    {
      denom: 'uatom',
      amount: '9500',
    },
  ],
  {
    amount: [
      {
        amount: '500',
        denom: 'uatom',
      },
    ],
    gas: '200000',
  },
 );

// in frontend - once a user is created/signed in, you can export the session
const serializedSession = capsule.exportSession();
// then transfer `serializedSession` to your backend over some secure method

// in backend - import `serializedSession` to enable signing functionality
import Capsule, { Environment } from '@usecapsule/server-sdk';
import { CapsuleProtoSigner } from '@usecapsule/cosmjs-v0-integration';
import { SigningStargateClient } from '@cosmjs/stargate';

const capsule = new Capsule(Environment.DEVELOPMENT, YOUR_API_KEY);
// read in `serializedSession` from your secure transfer method
await capsule.importSession(serializedSession);

const protoSigner = new CapsuleProtoSigner(capsule);
const client = await SigningStargateClient.connectWithSigner(
  COSMOS_TESTNET_RPC,
  protoSigner,
);

await client.getAccount(protoSigner.address);
await client.getAllBalances(protoSigner.address);
const fromAddress = protoSigner.address;

await client.sendTokens(
  fromAddress,
  COSMOS_DEFAULT_TO_ADDRESS,
  [
    {
      denom: 'uatom',
      amount: '9500',
    },
  ],
  {
    amount: [
      {
        amount: '500',
        denom: 'uatom',
      },
    ],
    gas: '200000',
  },
 );

Signing a transaction directly

If you are already directly managing transactions encodings and aren't using any of the above signer libraries, you can use the following functions to directly sign an rlpEncodedTxBase64 transaction and receive a txHash.

const signedTx = await capsule.sendTransaction(
    walletId, 
    rlpEncodedTxBase64, 
    chainId
)

const signedTypedMessage = await wallet.signTypedData(address, payload)

This code initiates a transaction, where walletId is the unique identifier of your wallet (this is different than your wallet address and is only used within the context of Capsule), rlpEncodedTxBase64 represents the transaction details, and chainId specifies the blockchain on which the transaction will take place.

PreviousOAuth & Social Logins NextSession Management

Last updated 1 month ago