Integrating Web3Auth Embedded Wallet SDK with Next.js and Coinbase CDP

Embedded Wallets (Web3Auth)
, ,
1

### **1. Framework / Environment:**

* Next.js / React

* Node.js (Termux / Linux)

### **2. SDK Name & Version:**

* `@web3auth/modal`: latest

* `@web3auth/base`: latest

* Network: Sapphire Devnet

### **3. Issue Description:**

I am integrating Web3Auth with Next.js and Coinbase CDP RPC for Base network. The Client ID is configured in `.env.local`. I want to properly track session logs and handle embedded wallet authentication responses on the frontend.

### **4. Code Snippet:**

```javascript

import { Web3Auth } from “@web3auth/modal”;

import { CHAIN_NAMESPACES, WEB3AUTH_NETWORK } from “@web3auth/base”;

const web3auth = new Web3Auth({

clientId: process.env.NEXT_PUBLIC_WEB3AUTH_CLIENT_ID,

web3AuthNetwork: WEB3AUTH_NETWORK.SAPPHIRE_DEVNET,

chainConfig: {

chainNamespace: CHAIN_NAMESPACES.EIP155,

chainId: "0x2105",

rpcTarget: "\[https://mainnet.base.org\](https://mainn

et.base.org)",

},

});

2

Hi,

chainConfig and the import from @web3auth/base are the old setup. Remove them. On current @web3auth/modal, configure Base in the dashboard. 0x2105 is Base mainnet.

This project is Sapphire Devnet, and the RPC in your snippet is Base mainnet. Use Sapphire Mainnet for Base mainnet.

The client ID in NEXT_PUBLIC_WEB3AUTH_CLIENT_ID is fine. Do not put the client secret in the Next.js app.

web3auth.connected is the session flag. After login, getUserInfo() is the user and getAuthTokenInfo() is the identity token.

Note: This response was generated by an AI bot and may require further verification. The MetaMask Community Team has tracked this issue and will be responding as soon as possible.