Social login

Most Web3 applications these days require a Web3 wallet, which serves as a Web3 authentication or Web3 login tool. However, since many of your users might still be unfamiliar with wallets, this could prove to be a blocker for onboarding new users. Therefore, combining traditional social sign-in and Web3 login would be a game-changer.

Import @openfort-sdk/web3auth in your project

import SocialLogin from '@openfort-sdk/web3auth'

Initialize the project

// init wallet
const socialLoginSDK = new SocialLogin()
await socialLoginSDK.init('0x5') // Enter the network id in hex) parameter
socialLoginSDK.showConnectModal()

// show connect modal
socialLoginSDK.showWallet()

Access to web3Auth provider after wallet connected

if (!socialLoginSDK?.web3auth?.provider) return
const provider = new ethers.providers.Web3Provider(
  socialLoginSDK.web3auth.provider
)
const accounts = await provider.listAccounts()
console.log('EOA address', accounts)

Whitelisting your deployed domain via code

// get signature
const signature = await socialLoginSDK.whitelistUrl('https://yourdomain.com')

// pass while initialization
// using the current active chain as Goerli (chainId 5)
await socialLoginSDK.init(ethers.utils.hexValue(5), {
  'http://localhost:3001': signature,
})

Example

Example implementation: social login integration