Email Verification for Storefront Next

Storefront Next supports email verification to confirm shopper identity using a one-time passcode (OTP). A Business Manager site preference controls email verification. When enabled, the site preference activates these features.

  • Passwordless registration and login as default — Shoppers create accounts and log in using an OTP instead of a password.
  • Email verification — Shoppers verify their email address during registration and on the Account Details page.
  • Email update support — Shoppers have the option to change their email address in account details. If they don’t have a password, OTP-based identity confirmation is required before the system applies the change. OTP verification isn’t required for shoppers who do have a password.
  • Configure a Shopper Login and API Access Service (SLAS) private client with passwordless login enabled. For instructions, see Configure a SLAS Private Client in the B2C Commerce API Developer Guide.
  • In config.server.ts, set commerce.api.privateKeyEnabled to true. If false, passwordless login is disabled at run time.
  • Enable Enable Loginid Updates for SCAPI. With this setting, shoppers can update their login email via SCAPI. Contact support to enable this feature.
  • In Merchant Tools > Site Preferences > Storefront Login Preferences, turn on Enable Email Verification. This preference enables passwordless registration, post-registration email verification, and the email change flow in account details.

Enable Email Verification site preference in Storefront Login Preferences

Changes to site preferences can take up to 5 minutes to reflect on a deployed storefront.

To control OTP settings, update auth and features.otpRequest in config.server.ts.

  • otpLength: The length of the OTP code. Valid values are 6 or 8. Defaults to 6. Make sure that this value matches the OTP length configured in your SLAS client. See Configure a SLAS Private Client in the B2C Commerce API Developer Guide.
  • mode: The mode used to deliver the OTP to the shopper (email or callback). Defaults to email. The callback mode doesn’t support email verification.

To override configuration options, use Managed Runtime (MRT) environment variables with the PUBLIC__ prefix.

Passwordless login supports both email and callback modes, but only the email mode supports email verification. When mode is set to email, SLAS sends the OTP directly to the shopper’s email without third-party integration. This mode doesn’t require a callback URI.

  1. Configure SLAS for passwordless login with email. See Passwordless Login with Email in the B2C Commerce API Developer Guide.
  2. In config.server.ts, set the OTP mode to email.

This diagram shows the complete registration flow. When Enable Email Verification is turned off, accounts are created without verification. When it’s turned on, shoppers can use passwordless mode (the default) or create a password to register. The numbered callouts in the diagram correspond to the steps described in each registration method (Passwordless and Password-Based with Email Verification).

Registration flow diagram showing passwordless and password-based paths with numbered callouts

If a site has Enable Email Verification turned on, the registration page defaults to passwordless mode. To create an account, shoppers enter their name and email and complete OTP verification.

  1. The shopper submits their name and email (1).
  2. The storefront calls the SLAS passwordless login endpoint, which creates the account and sends an OTP to the shopper’s email.
  3. The shopper enters the OTP in the verification modal to complete registration (2).

Passwordless registration form with OTP verification modal

Shoppers who register with a password also verify their email after account creation.

  1. The shopper submits their name, email, and password (3).
  2. The storefront creates the account and immediately requests an OTP for the registered email.
  3. The shopper enters the OTP in the verification modal (4). If the OTP request fails, the account is still created and the shopper is redirected without requiring verification. The shopper can verify their email on the Account Details page at a later time.

Password-based registration form with OTP verification modal

If a site has Enable Email Verification turned on, the login page defaults to passwordless mode. To log in, shoppers enter their email and complete OTP verification.
Login page showing passwordless, password, and social login options
If Enable Email Verification is turned off, the login page supports password (1) or social login (2), if configured.

If Enable Email Verification is turned on, the login page supports passwordless (3), password (4), and social login (5), if configured. Both login pages in this example also include Forgot your password? buttons.

If a site uses email verification, the Account Details page shows a Verified or Unverified badge next to the shopper’s email address.

Account Details page showing Verified email badgeAccount Details page showing Unverified email badge

The Account Details page only shows the Change Email button if the site has email verification turned on. The identity confirmation method depends on whether the shopper has a password.

  • Accounts without a password — The shopper verifies their identity with an OTP sent to their current email address before they can change their email.
  • Accounts with a password — The shopper verifies their identity with their current password.
  1. The shopper clicks Change Email.
  2. The shopper confirms their identity using their password.
  3. The shopper enters their new email address and submits the change.

For passwordless accounts (accounts without a password), the password card shows a Reset Password button instead of Change Password, so shoppers can set a password if they choose.
Password card showing Reset Password button for passwordless accounts

For common troubleshooting scenarios, see [Troubleshoot Passwordless Login](https://developer.salesforce.com/docs/commerce/commerce-api/guide/slas-passwordless-login-troubleshoot.html) in the B2C Commerce API Developer Guide.