Skip to main content
Phantom Browser SDK The Phantom Browser SDK provides a framework-agnostic JavaScript/TypeScript interface for connecting to existing Phantom user wallets in web applications.

Features

  • Framework Agnostic: Works with vanilla JavaScript/TypeScript and any web framework
  • Multi-Chain Support: Solana (available now); Ethereum, Bitcoin, and Sui networks (coming soon)
  • Native Transaction Support: Direct transaction object handling
  • User Wallet Integration: Connect to existing Phantom user wallets
  • TypeScript Support: Full TypeScript definitions included

Security

The Browser SDK connects to existing Phantom user wallets, ensuring:
  • Users control their own wallets and private keys
  • Integration with Phantom’s secure wallet infrastructure
  • No private key handling in your application
  • User maintains full control of their assets

Prerequisites

  • Register your application
    Sign up or log in to the Phantom Portal and register your application.
  • Obtain your App ID
    • In the Portal, go to your app and open URL Config (left-hand menu).
    • This page shows your allowed origins and redirect URLs.
    • Scroll down to the App ID section at the bottom of the page — your App ID is listed there, below the URL configurations.
    • Copy the App ID for use in your integration.
  • Whitelist your domains and redirect URLs
    • Add your application’s domains and redirect URLs in the Phantom Portal to enable wallet connections.

Authentication Configuration

When using the embedded provider, you’ll need to configure authentication options:
authOptions: {
  redirectUrl: "https://yourapp.com/auth/callback", // Your callback page
}
Important notes about redirectUrl:
  • Must be an existing page/route in your application
  • Must be whitelisted in your Phantom Portal app configuration
  • This is where users will be redirected after completing OAuth with Google

Installation

npm install @phantom/browser-sdk@beta

Quick Start

User Wallet Connection

import { BrowserSDK, AddressType } from "@phantom/browser-sdk";

// Connect to Phantom user wallets
const sdk = new BrowserSDK({
  providerType: "embedded", // or "injected" for browser extension
  addressTypes: [AddressType.solana, AddressType.ethereum],
  appId: "your-app-id",
  authOptions: {
    authUrl: "https://connect.phantom.app/login",
    redirectUrl: "https://yourapp.com/auth/callback", // Must be an existing page in your app and whitelisted in Phantom Portal
  },
});

const { addresses } = await sdk.connect();
console.log("Connected addresses:", addresses);

// Chain-specific operations
const message = "Hello from Phantom!";
const solanaSignature = await sdk.solana.signMessage(message);

// Encode the message as hex for EVM
const encoded = "0x" + Buffer.from(message, "utf8").toString("hex");
const ethSignature = await sdk.ethereum.signPersonalMessage(encoded, addresses[1].address);

Chain-Specific APIs

The SDK provides separate interfaces for each blockchain with optimized methods:

Solana Chain (sdk.solana)

// Message signing
const signature = await sdk.solana.signMessage("Hello Solana!");

// Transaction signing (without sending)
const signedTx = await sdk.solana.signTransaction(transaction);

// Sign and send transaction
const result = await sdk.solana.signAndSendTransaction(transaction);

// Network switching
await sdk.solana.switchNetwork('devnet');

Ethereum Chain (sdk.ethereum)

// Message signing
const signature = await sdk.ethereum.signPersonalMessage(message, address);

// Transaction sending
const result = await sdk.ethereum.sendTransaction({
  to: "0x...",
  value: "1000000000000000000", // 1 ETH in wei
  gas: "21000",
});

// Network switching
await sdk.ethereum.switchChain(1); // Ethereum mainnet

Auto-Confirm

The SDK provides auto-confirm functionality that allows automatic transaction confirmation for specified chains.
import { NetworkId } from "@phantom/browser-sdk";

// Enable auto-confirm for specific chains
const result = await sdk.enableAutoConfirm({
  chains: [NetworkId.SOLANA_MAINNET, NetworkId.ETHEREUM_MAINNET]
});

// Enable auto-confirm for all supported chains  
const result = await sdk.enableAutoConfirm();

// Disable auto-confirm
await sdk.disableAutoConfirm();

// Get current status
const status = await sdk.getAutoConfirmStatus();

Available AddressTypes

AddressTypeSupported Chains
AddressType.solanaSolana Mainnet, Devnet, Testnet
AddressType.ethereumEthereum, Polygon, Arbitrum, and more

Next Steps

I