Social login plus MPC/threshold-cryptography wallets. Splits the user's signing key across device, network, and recovery shares so accounts are non-custodial yet recoverable. Works across EVM, Solana, and most major chains.
- 01social login (Google/Apple/X)
- 02MPC / threshold wallets
- 03key recovery without seed phrases
- 04multi-chain consumer apps
- 05mobile + web parity
- pnpm add @web3auth/modal
| Variable | Scope | Description |
|---|---|---|
| NEXT_PUBLIC_WEB3AUTH_CLIENT_ID | Client | Web3Auth client ID from the Web3Auth dashboard. Tied to a specific network (Sapphire Mainnet / Sapphire Devnet). |
Use Web3Auth for social login with MPC-backed key shares. Wrap the app in `<Web3AuthProvider config={{ clientId: process.env.NEXT_PUBLIC_WEB3AUTH_CLIENT_ID!, web3AuthNetwork: WEB3AUTH_NETWORK.SAPPHIRE_MAINNET, chainConfig }}>` from `@web3auth/modal`. Read state with the `useWeb3Auth()`, `useWeb3AuthConnect()`, `useWeb3AuthDisconnect()`, and `useWeb3AuthUser()` hooks. Call `connect()` to open the modal, then bridge the returned EIP-1193 provider into wagmi/viem (or `@web3auth/solana-provider` for Solana). For server verification, validate the JWT via `jose` against Web3Auth's JWKS at `https://api-auth.web3auth.io/jwks`.
- ⚑Sapphire Mainnet and Sapphire Devnet are entirely separate networks — wallets created against Devnet do not exist on Mainnet, even with the same login.
- ⚑Whitelist every domain (including Vercel preview URLs) in the Web3Auth dashboard; otherwise the modal returns a vague `whitelist` error in production.
- ⚑MFA enrollment is permanent per user — once a user enrolls, they cannot log in without their factor. Provide clear recovery UX before pushing users into MFA.
- ⚑Always verify the ID token server-side via the JWKS endpoint; never trust the wallet address sent from the browser.
- ⚑In-app browsers (TikTok, Instagram, Telegram) block OAuth popups — detect and fall back to redirect mode or external-browser deep links.