Skip to content

Latest commit

 

History

History
81 lines (61 loc) · 3.2 KB

File metadata and controls

81 lines (61 loc) · 3.2 KB
title Email passwordless Login with Embedded Wallets
sidebar_label Email passwordless
description Email Passwordless Login with Embedded Wallets | Embedded Wallets

import EmailPasswordlessToggle from '@site/static/img/embedded-wallets/dev-dashboard/email-passwordless-toggle.png' import EmailPasswordlessAddConnection from '@site/static/img/embedded-wallets/dev-dashboard/email-passwordless-add-connection.png' import EmailPasswordlessOnboarding from '@site/static/img/embedded-wallets/dev-dashboard/email-passwordless-onboarding.png'

Embedded Wallets provides built-in support for email and SMS-based authentication, allowing users to sign in without repeating the full flow using a one-time passcode (OTP) sent to their email address or phone number. This form of passwordless authentication simplifies the onboarding process, removes friction for end users, and expands accessibility, especially in regions where social login options may be limited.

Email Passwordless Onboarding

Set up a custom email connection

:::success Enable on dashboard

To use this feature, developers must first enable Email Passwordless from the Social Connections section in the dashboard.

By default, Web3Auth uses its own pre-configured credentials for email login.

:::

Email Passwordless Toggle

For enhanced control and branding, developers are encouraged to configure a custom email connection. Follow these steps:

  1. Visit the dashboard.
  2. Navigate to the Social Connections section.
  3. Click the Settings icon (next to the toggle for Email Passwordless.
  4. Enter your custom Auth Connection ID.
  5. Click Add Connection to complete the setup.

Email Passwordless Add Connection

Usage

import { WALLET_CONNECTORS, WEB3AUTH_NETWORK } from '@web3auth/modal'
import { type Web3AuthContextConfig } from '@web3auth/modal/react'

const web3AuthContextConfig: Web3AuthContextConfig = {
  web3AuthOptions: {
    clientId: 'YOUR_WEB3AUTH_CLIENT_ID', // Pass your Web3Auth Client ID, ideally using an environment variable
    web3AuthNetwork: WEB3AUTH_NETWORK.SAPPHIRE_MAINNET,
    modalConfig: {
      connectors: {
        [WALLET_CONNECTORS.AUTH]: {
          label: 'auth',
          // focus-start
          loginMethods: {
            email_passwordless: {
              name: 'email passwordless login',
              authConnectionId: 'w3a-email_passwordless-demo',
            },
          },
          // focus-end
        },
      },
    },
  },
}

export default web3AuthContextConfig

Troubleshooting

If OTP or magic link emails do not arrive, the recipient may have unsubscribed from Embedded Wallets transactional email. See Email OTP or magic link not received for the resubscribe form and other checks.

Next steps

Follow our quickstart to set up the basic flow.