How can I enable users to change their email address from a SPA or native app?

Knowledge Solutions
1

Question: How can I enable users to change their email address from a SPA or native app?

Answer:

Public clients (like SPAs and native applications) are restricted from requesting tokens for the management API with the proper scopes for updating a user’s email. These types of applications are limited to a few specific scopes. Because of these limitations, email change requests from public clients must flow through a backend or proxy API. This could be a serverless function with the sole purpose of handling these requests, or an added endpoint on your existing backend API.

In this example, we will use an existing backend API to process the email change on request from a SPA/native app. If you need to set up a backend API, take a look at our backend/API quickstarts.

The following diagram describes our desired flow:

ChangeEmailDiagram
ChangeEmailDiagram1939×1104 233 KB

Let’s walk through the steps:

  1. The user visits the SPA/native app with intent to login and change email address.
  2. SPA/native app makes a request to authorize the user and get an access token for the backend API. The backend API should be set up and registered with Auth0 and the request to authorize should include an audience={YOUR_API_IDENTIFIER} parameter.
  3. SPA/native app makes an email change request to the backend API on behalf of the user, sending the access token in the header.
  4. Backend API verifies the token and if the backend API doesn’t have an existing, valid management API token, requests a management API token. Make sure your backend is not requesting a new token for every email change.
  5. Using the user_id from the original user access token, and the management API token in the header, the backend makes a request to /api/v2/users/{id} with the updated email.

Notes:

  • If the user enters an email address that they don’t have access to (e.g. they made a typo when inputting the email), they will no longer be able to complete the forgot password workflow. It is recommended you notify the user and/or ask them to confirm their address before submitting the update.
  • If the user enters an email that already exists the management API will return an error that should be communicated to the user.

Please open a topic if you have any questions.

4 Likes