Integrate Web3Auth with the Cosmos Blockchain
While using the Web3Auth Web SDK for a non-EVM chain like Cosmos you get
a standard provider from which you can get the private key of the user. Using this private key, you
can use the corresponding libraries of the blockchain to make blockchain calls like getting the
user's account
, chain ID
, fetch balance
, send transaction
, etc. We have highlighted a few
methods here to get you started quickly on that.
This reference is for the Web
, however, you can use Cosmos on other Mobile and Gaming Platforms as
well. Please follow our reference for EVM Blockchains, and similarly use
Cosmos libraries that support the platforms to use the private key and make blockchain calls
accordingly.
Installation
- npm
- Yarn
- pnpm
npm install --save @web3auth/no-modal @web3auth/auth-adapter @web3auth/base @cosmjs/stargate @cosmjs/proto-signing
yarn add @web3auth/no-modal @web3auth/auth-adapter @web3auth/base @cosmjs/stargate @cosmjs/proto-signing
pnpm add @web3auth/no-modal @web3auth/auth-adapter @web3auth/base @cosmjs/stargate @cosmjs/proto-signing
Initializing Provider
Getting the chainConfig
- Mainnet
- Testnet
- Chain Namespace: other
- Chain ID: cosmoshub-4
- Public RPC URL: https://cosmos-rpc.quickapi.com (Avoid using public rpcTarget in production)
- Display Name: Cosmos Mainnet
- Block Explorer Link: https://www.mintscan.io/cosmos
- Ticker: ATOM
- Ticker Name: Cosmos
- Chain Namespace: other
- Chain ID: theta-testnet-001
- Public RPC URL: https://rpc.sentry-02.theta-testnet.polypore.xyz (Avoid using public rpcTarget in production)
- Display Name: Cosmos Testnet
- Block Explorer Link: https://explorer.theta-testnet.polypore.xyz
- Ticker: ATOM
- Ticker Name: Cosmos
Get ChainID
Once a user logs in, the Web3Auth SDK returns a provider. Since Web3Auth doesn't have a native provider for Cosmos, we need to directly use the private key to make the RPC calls.
CosmJS Libraries
@cosmjs/stargate
A client library for the Cosmos SDK 0.40+. Provides a high-level client for
querying, signing and broadcasting. This is an npm library that provides a JavaScript/TypeScript
interface to interact with the Cosmos SDK blockchain via the Tendermint RPC interface.
@cosmjs/proto-signing
It is an npm library for signing messages using protobuf serialization,
which is commonly used in Cosmos SDK-based blockchains. It provides a simple API for generating and
verifying signatures using different algorithms and key types.
In order to get the ChainId, we connect to the RPC using StargateClient and make a call using the
Cosmos RPC client to get the chainId. You can get the private key using
this.provider.request({method: "private_key",})
.
import type { IProvider } from "@web3auth/base";
import { SigningStargateClient, StargateClient } from "@cosmjs/stargate";
import { DirectSecp256k1Wallet, OfflineDirectSigner } from "@cosmjs/proto-signing";
const rpc = "https://rpc.sentry-02.theta-testnet.polypore.xyz";
export default class CosmosRPC {
private provider: IProvider;
constructor(provider: IProvider) {
this.provider = provider;
}
async getPrivateKey(): Promise<any> {
try {
return await this.provider.request({
method: "private_key",
});
} catch (error) {
return error as string;
}
}
async getChainId(): Promise<string> {
try {
const client = await StargateClient.connect(rpc);
// Get the connected Chain's ID
const chainId = await client.getChainId();
return chainId.toString();
} catch (error) {
return error as string;
}
}
}
Get Account
Using DirectSecp256k1Wallet.fromKey()
we can get the accounts via the private key we get through
the provider.
import type { IProvider } from "@web3auth/base";
import { SigningStargateClient, StargateClient } from "@cosmjs/stargate";
import { DirectSecp256k1Wallet, OfflineDirectSigner } from "@cosmjs/proto-signing";
const rpc = "https://rpc.sentry-02.theta-testnet.polypore.xyz";
export default class CosmosRPC {
private provider: IProvider;
constructor(provider: IProvider) {
this.provider = provider;
}
async getAccounts(): Promise<any> {
try {
const privateKey = Buffer.from(await this.getPrivateKey(), "hex");
const walletPromise = await DirectSecp256k1Wallet.fromKey(privateKey, "cosmos");
return (await walletPromise.getAccounts())[0].address;
} catch (error) {
return error;
}
}
}
Get Balance
Using the account address we received in the previous step, we can fetch the balance using an RPC
call to client.getAllBalances(address)
.
import type { IProvider } from "@web3auth/base";
import { SigningStargateClient, StargateClient } from "@cosmjs/stargate";
import { DirectSecp256k1Wallet, OfflineDirectSigner } from "@cosmjs/proto-signing";
const rpc = "https://rpc.sentry-02.theta-testnet.polypore.xyz";
export default class CosmosRPC {
private provider: IProvider;
constructor(provider: IProvider) {
this.provider = provider;
}
async getBalance(): Promise<any> {
try {
const client = await StargateClient.connect(rpc);
const privateKey = Buffer.from(await this.getPrivateKey(), "hex");
const walletPromise = await DirectSecp256k1Wallet.fromKey(privateKey, "cosmos");
const address = (await walletPromise.getAccounts())[0].address;
// Get user's balance in uAtom
return await client.getAllBalances(address);
} catch (error) {
return error as string;
}
}
}
Send transaction
import type { IProvider } from "@web3auth/base";
import { SigningStargateClient, StargateClient } from "@cosmjs/stargate";
import { DirectSecp256k1Wallet, OfflineDirectSigner } from "@cosmjs/proto-signing";
const rpc = "https://rpc.sentry-02.theta-testnet.polypore.xyz";
export default class CosmosRPC {
private provider: IProvider;
constructor(provider: IProvider) {
this.provider = provider;
}
async sendTransaction(): Promise<any> {
try {
await StargateClient.connect(rpc);
const privateKey = Buffer.from(await this.getPrivateKey(), "hex");
const walletPromise = await DirectSecp256k1Wallet.fromKey(privateKey, "cosmos");
const fromAddress = (await walletPromise.getAccounts())[0].address;
const destination = "cosmos15aptdqmm7ddgtcrjvc5hs988rlrkze40l4q0he";
const getSignerFromKey = async (): Promise<OfflineDirectSigner> => {
return DirectSecp256k1Wallet.fromKey(privateKey, "cosmos");
};
const signer: OfflineDirectSigner = await getSignerFromKey();
const signingClient = await SigningStargateClient.connectWithSigner(rpc, signer);
const result = await signingClient.sendTokens(
fromAddress,
destination,
[{ denom: "uatom", amount: "250" }],
{
amount: [{ denom: "uatom", amount: "250" }],
gas: "100000",
},
);
const transactionHash = result.transactionHash;
const height = result.height;
return { transactionHash, height };
} catch (error) {
return error as string;
}
}
}