🔑

Web3Auth.io

Moralis is now fully integrated with Web3Auth.

Integrating Moralis and Web3Auth

Moralis supports authentication using Web3Auth. This allows for user onboarding through both social logins, and web3 wallets.

1. Create a Web3Auth account

To get started, make an account here and get the publishable clientId.
clientId: 'ABC*****************'

2. Add the Web3Auth SDK

Import the SDK based on how moralis was imported into the project - CDN, npm, or yarn.
CDN
npm
yarn
<script src="https://unpkg.com/@web3auth/[email protected]/dist/web3auth.umd.min.js"></script>
npm install --save @web3auth/web3auth
yarn add @web3auth/web3auth

3. Call the authenticate function

JS
React
const user = await Moralis.authenticate({
provider: "web3Auth",
clientId: "ABC*****************",
})
import { useMoralis } from "react-moralis";
function App() {
const { authenticate, isAuthenticated } = useMoralis();
const login = async () => {
if (!isAuthenticated) {
await authenticate({
provider: "web3Auth",
clientId: "ABC*****************",
})
.then(function (user) {
console.log(user!.get("ethAddress"));
})
.catch(function (error) {
console.log(error);
});
}
};
}
Then call authenticate like above, but with a provider option, and the required params. The clientId is the only required param.

Parameters

Parameters that can be passed into Moralis.authenticate() when using the web3Auth provider
Parameters
Values
clientId
The publishable clientId from the web3Auth dashboard.
chainId
(optional)The chainId of the supported network to connect to. By default Ethereum mainnet 0x1
appLogo
(optional)URL of the logo is to be shown at the top of the modal. By default Moralis Logo
loginMethodsOrder
(optional) An array of strings, which contains the social logins that you want to allow, and the order in which they show up. Default: ["google", "facebook", "twitter", "reddit", "discord", "twitch", "apple", "line", "github", "kakao", "linkedin", "weibo", "wechat", "email_passwordless"]
theme
(optional)The theme of the login modal. Can be one of light or dark. By default dark

Tutorial

Moralis and Web3Auth Integration
Last modified 5mo ago