Generate TON Connect Proof

Recommended: JavaScript SDK with React Hooks

For new React apps, we recommend the JavaScript SDK with React Hooks (@dynamic-labs-sdk/react-hooks) instead of the legacy React SDK documented here. The JS SDK comes with many benefits such as a much smaller bundle size and other optimizations. Use the React quickstart (JavaScript SDK) to get started.

TON Connect proof is used for authentication with backend services. This generates a cryptographic proof that the user owns the wallet.

import { useDynamicContext } from '@dynamic-labs/sdk-react-core';
import { isTonWallet, TonConnectProof } from '@dynamic-labs/ton';

const GenerateTonConnectProofButton = () => {
  const { primaryWallet } = useDynamicContext();

  const onGenerateProof = async () => {
    if (!primaryWallet || !isTonWallet(primaryWallet)) {
      throw new Error('TON wallet not found');
    }

    // Generate the TON Connect proof
    const payload = 'authentication-challenge-from-backend';
    const proof: TonConnectProof = await primaryWallet.generateTonConnectProof(
      payload,
    );

    console.log('TON Connect Proof:', proof);
    // {
    //   address: "UQ...",
    //   domain: { lengthBytes: 11, value: "example.com" },
    //   timestamp: 1704067200,
    //   payload: "authentication-challenge-from-backend",
    //   signature: "base64-encoded-signature"
    // }

    // Send this proof to your backend for verification
  };

  return <button onClick={onGenerateProof}>Generate TON Connect Proof</button>;
};

TonConnectProof Object

Field	Type	Description
address	string	Wallet address
domain	TonConnectDomain	Domain information
timestamp	number	Unix timestamp in seconds
payload	string	The payload string that was signed
signature	string	Signature as base64 string

TonConnectDomain Object

Field	Type	Description
lengthBytes	number	Length of domain value in bytes
value	string	Domain value (e.g., “example.com”)