Skip to content

Search is only available in production builds. Try building and previewing the site to test it out locally.

User Auth Functions

The User Auth drop-in provides API functions that enable you to programmatically control behavior, fetch data, and integrate with Adobe Commerce backend services.

Version: 2.1.5
FunctionDescription
confirmEmailCompletes the customer activation process using the supplied customerEmail and customerConfirmationKey parameters.
createCustomerCreates a customer account based on the data supplied in the forms parameter.
createCustomerAddressDefines a new customer address.
getAttributesFormRetrieves EAV attributes associated with customer and customer address frontend forms.
getCustomerDataRetrieves data about the customer represented by the value of the auth_dropin_user_token parameter.
getCustomerTokenHandles the sign-in operation.
getStoreConfigCalls the storeConfig query to retrieve store configuration data..
requestPasswordResetEmailInitiates the process of resetting a customer’s password.
resendConfirmationEmailResends the email confirmation to the customer using the supplied customerEmail parameter.
resetPasswordResets a customer’s password using the supplied email, resetPasswordToken, and newPassword parameters.
revokeCustomerTokenRevokes the customer’s token and clears cookie.
verifyTokenChecks the validity of the provided authentication token.

confirmEmail

The confirmEmail function completes the customer activation process using the supplied customerEmail and customerConfirmationKey parameters. Adobe Commerce sends the confirmation key to the customer when they request to create an account. The function calls the confirmEmail mutation .

const confirmEmail = async (
{ customerEmail, customerConfirmationKey, }: confirmEmailProps
): Promise<confirmEmailResponse | undefined>
ParameterTypeReq?Description
optionsconfirmEmailPropsYesAn object containing `customerEmail` (customer’s email address) and `customerConfirmationKey` (confirmation key sent by Adobe Commerce).

Events

Does not emit any drop-in events.

Returns

Returns confirmEmailResponse | undefined.


createCustomer

The createCustomer function creates a customer account based on the data supplied in the forms parameter. By default, the function calls the createCustomer mutation . If the apiVersion2 parameter is set to true, the function calls the createCustomerV2 mutation .

const createCustomer = async (
forms: Customer,
apiVersion2: boolean
): Promise<CustomerModel>
ParameterTypeReq?Description
formsCustomerYesCustomer account data including email, password, firstName, lastName, and optional custom attributes.
apiVersion2booleanYesWhether to use the v2 API (createCustomerV2 mutation) instead of the original createCustomer mutation.

Events

Does not emit any drop-in events.

Returns

Returns CustomerModel.


createCustomerAddress

The createCustomerAddress function defines a new customer address. The customer can subsequently designate the address for billing or shipping orders. The function calls the createCustomerAddress mutation .

const createCustomerAddress = async (
address: AddressFormProps
): Promise<string>
ParameterTypeReq?Description
addressAddressFormPropsYesThe new customer address including street, city, region, country, postal code, and optional fields like company name and phone number.

Events

Does not emit any drop-in events.

Returns

Returns string.


getAttributesForm

The getAttributesForm function retrieves EAV attributes associated with customer and customer address frontend forms. The function calls the attributesForm query .

const getAttributesForm = async (
formCode: string
): Promise<AttributesFormModel[]>
ParameterTypeReq?Description
formCodestringYesThe form code, one of: customer_account_create, customer_account_edit, customer_address_create, or customer_address_edit.

Events

Does not emit any drop-in events.

Returns

Returns AttributesFormModel[].


getCustomerData

The getCustomerData function retrieves data about the customer represented by the value of the auth_dropin_user_token parameter. The function calls the customer query .

const getCustomerData = async (
user_token: string
): Promise<CustomerModel>
ParameterTypeReq?Description
user_tokenstringYesThe customer authentication token from the auth_dropin_user_token cookie.

Events

Does not emit any drop-in events.

Returns

Returns CustomerModel.


getCustomerToken

The getCustomerToken function handles the sign-in operation. It requires userName and password parameters and performs the following actions under the hood:

  1. Retrieves the customer token.
  2. Fetches customer data using the token.
  3. Sets the auth_dropin_firstname and auth_dropin_user_token cookies.
  4. Publishes an Adobe Client Data Layer (ACDL) event.
  5. Emits an “authenticated” event.

You can use the getCustomerToken function to build a custom authentication flow that remains fully integrated with other drop-in components. The function calls the generateCustomerToken mutation .

const getCustomerToken = async (
{ email, password, translations, onErrorCallback, handleSetInLineAlertProps, }: getCustomerTokenProps
): Promise<{
errorMessage: string;
userName: string;
userEmail: string;
}>
ParameterTypeReq?Description
optionsgetCustomerTokenPropsYesAn object containing `userName` (customer’s email or username) and `password` (customer’s password).

Events

Does not emit any drop-in events.

Returns

Returns Promise<{ errorMessage: string; userName: string; userEmail: string; }>.


getStoreConfig

The getStoreConfig function calls the storeConfig query to retrieve store configuration data.

const getStoreConfig = async (): Promise<StoreConfigModel>

Events

Does not emit any drop-in events.

Returns

Returns StoreConfigModel.


requestPasswordResetEmail

The requestPasswordResetEmail function initiates the process of resetting a customer’s password. The function calls the requestPasswordResetEmail mutation .

const requestPasswordResetEmail = async (
email: string
): Promise<PasswordResetEmailModel>
ParameterTypeReq?Description
emailstringYesThe email address of the customer requesting a password reset.

Events

Does not emit any drop-in events.

Returns

Returns PasswordResetEmailModel.


resendConfirmationEmail

The resendConfirmationEmail function resends the email confirmation to the customer using the supplied customerEmail parameter. The function calls the resendConfirmationEmail mutation , which is included in the Storefront Compatibility Package.

const resendConfirmationEmail = async (
customerEmail: string
): Promise<resendConfirmationEmailResponse>
ParameterTypeReq?Description
customerEmailstringYesThe email address of the customer who needs the confirmation email resent.

Events

Does not emit any drop-in events.

Returns

Returns resendConfirmationEmailResponse.


resetPassword

The resetPassword function resets a customer’s password using the supplied email, resetPasswordToken, and newPassword parameters. The function calls the resetPassword mutation .

const resetPassword = async (
email: string,
resetPasswordToken: string,
newPassword: string
): Promise<ResetPasswordModel>
ParameterTypeReq?Description
emailstringYesThe email address of the customer resetting their password.
resetPasswordTokenstringYesThe password reset token sent to the customer’s email.
newPasswordstringYesThe new password for the customer account.

Events

Does not emit any drop-in events.

Returns

Returns ResetPasswordModel.


revokeCustomerToken

The revokeCustomerToken function revokes the customer’s token and clears cookie. It then publishes an ACDL event and emits an “authenticated” event. This API can also be used to build a custom sign-out flow that stays fully integrated with other drop-in components. The function calls the revokeCustomerToken mutation .

const revokeCustomerToken = async (): Promise<RevokeCustomerTokenModel>

Events

Does not emit any drop-in events.

Returns

Returns RevokeCustomerTokenModel.


verifyToken

The verifyToken function checks the validity of the provided authentication token. It verifies the token by making a GraphQL request to validate the customer. If valid, it emits an authenticated event with true and the customer’s group ID. If invalid or missing, it emits an authenticated event with false, removes the token cookie, and clears the authentication header.

const verifyToken = async (
authType = 'Authorization',
type = 'Bearer'
): Promise<any>
ParameterTypeReq?Description
authTypestringNoThe HTTP header name to use for authentication. Defaults to `Authorization`. This allows customization of the authentication header if your backend uses a different header name.
typestringNoThe authentication scheme type to use. Defaults to `Bearer`. This is prepended to the token value in the authentication header (e.g., `Bearer <token>`).

Events

Does not emit any drop-in events.

Returns

Returns void.


Data Models

The following data models are used by functions in this drop-in.

CustomerModel

The CustomerModel object is returned by the following functions: createCustomer, getCustomerData.

interface CustomerModel {
firstName: string;
lastName: string;
email: string;
groupUid: string;
customAttributes?: Record<string, string>[];
errors?: { message: string }[];
}

PasswordResetEmailModel

The PasswordResetEmailModel object is returned by the following functions: requestPasswordResetEmail.

interface PasswordResetEmailModel {
message: string | '';
success: boolean;
}

ResetPasswordModel

The ResetPasswordModel object is returned by the following functions: resetPassword.

interface ResetPasswordModel {
message: string | '';
success: boolean;
}

RevokeCustomerTokenModel

The RevokeCustomerTokenModel object is returned by the following functions: revokeCustomerToken.

interface RevokeCustomerTokenModel {
message: string | '';
success: boolean;
}

StoreConfigModel

The StoreConfigModel object is returned by the following functions: getStoreConfig.

interface StoreConfigModel {
autocompleteOnStorefront: boolean;
minLength: number;
requiredCharacterClasses: number;
createAccountConfirmation: boolean;
customerAccessTokenLifetime: number;
}