Universal Login page not showing friendly error message

[rodrigo.bernardino]

I created a Pre User Registration action to create the new user in my app external database during the user signup and I have configured a few friendly error messages to improve UX:

const axios = require("axios")

/**
* Handler that will be called during the execution of a PreUserRegistration flow.
*
* @param {Event} event - Details about the context and user that is attempting to register.
* @param {PreUserRegistrationAPI} api - Interface whose methods can be used to change the behavior of the signup.
*/
exports.onExecutePreUserRegistration = async (event, api) => {
  const newBaseUser = {
    email: event.user.email,
    name: event.user.name,
    picture_uri: event.user.picture
  };

  const response = await axios.post(`${event.secrets.ELVIE_API_URL}/api/users/create-user`, newBaseUser, {
    headers: {
      "Content-Type": "application/json",
      "X-API-Key": event.secrets.ELVIE_API_KEY
    } 
  });

  if (response.status === 403) {
    api.access.deny("forbidden_api_access", "Forbidden access to the Elvie API. Please check if the API Key header is being sent.");
  }
  else if (response.status === 401) {
    api.access.deny("unauthorized_api_access", "Unauthorized access to the Elvie API. Please check if the API Key header is valid.");
  }
  else if (response.status === 400) {
    api.access.deny("user_already_exists", "An user with the specified email already exists");
  }
  else if (response.status !== 200) {
    api.access.deny("api_internal_error", "Elvie API internal error");
  }
};

However, when an error occurs, I’m getting an generic Extensibility error message:

The pre-user-registration API object documentation states that the userMessage may be presented directly in end-user interfaces. How can I make sure that the custom userMessage will be presented in my end-user interface?

[dan.woda]

Hi @rodrigo.bernardino,

If everything was working correctly, I would expect to see the string in one of the userMessages displayed in the signup prompt. I suspect something else in your pre-user registration action is throwing an error and causing the ‘extensibility error’ message.

[rodrigo.bernardino]

You were correct, my action was not catching the axios error response correctly. This is the updated code:

const axios = require("axios")

/**
* Handler that will be called during the execution of a PreUserRegistration flow.
*
* @param {Event} event - Details about the context and user that is attempting to register.
* @param {PreUserRegistrationAPI} api - Interface whose methods can be used to change the behavior of the signup.
*/
exports.onExecutePreUserRegistration = async (event, api) => {
  const newBaseUser = {
    email: event.user.email,
    name: event.user.username,
    picture_uri: event.user.picture
  };
  try {
    await axios.post(`${event.secrets.ELVIE_API_URL}/api/users/create-user`, newBaseUser, {
      headers: {
        "Content-Type": "application/json",
        "X-API-Key": event.secrets.ELVIE_API_KEY
      } 
    });
  } catch (error) {
    if (error.response.status === 403) {
      api.access.deny("forbidden_api_access", "Forbidden access to the Elvie API. Please check if the API Key header is being sent.");
    }
    else if (error.response.status === 401) {
      api.access.deny("unauthorized_api_access", "Unauthorized access to the Elvie API. Please check if the API Key header is valid.");
    }
    else if (error.response.status === 400) {
      api.access.deny("user_already_exists", "An user with the specified email already exists");
    }
    else if (error.response.status !== 200) {
      api.access.deny("api_internal_error", "Elvie API internal error");
    }
  }
};

Also, I disabled this setting to have a full support for readable error messages during signup:
Tenant Settings → Advanced → Use a generic response in public signup API error message

[dan.woda]

Great, thanks for posting an update!