Casos de uso: Configurar un formulario de actualización de políticas con Forms

Configura un formulario de actualización de políticas con Forms for Actions

Antes de comenzar

1. Crea una aplicación de máquina a máquina con los siguientes alcances habilitados:

• read:users
• update:users
• create:users
• read:users_app_metadata
• update:users_app_metadata
• create:users_app_metadata

2. Agrega una conexión de Vault con las credenciales de la aplicación M2M.

Forms for Actions te permite crear flujos personalizados de políticas de privacidad y almacenar el consentimiento en el objeto app_metadata.

En las secciones siguientes se explica cómo crear un formulario de actualización de políticas con nodos y flujos, además de los pasos para agregarlo a una Action de Post Login.

​

Crear un formulario desde cero

Sigue estos pasos para crear un formulario y recopilar información:

1. Abre el editor de formularios seleccionando Auth0 Dashboard > Actions > Forms.
2. Selecciona Create Form > Start from scratch.

De forma predeterminada, un formulario nuevo contiene un nodo Start, un nodo Step y un nodo de pantalla final.

​

Configurar el nodo Step

El nodo Step es la interfaz gráfica que ven los usuarios. Agregue Fields al nodo Step para recopilar el nuevo valor de aceptación del acuerdo siguiendo estos pasos:

1. Arrastre un campo de Rich text desde el menú Components al nodo Step.

   • Rich text: Introduzca una descripción de las actualizaciones de sus políticas de privacidad.
   • Seleccione Save.

2. Arrastre un campo Legal al nodo Step.

   • ID: Introduzca privacy_policies.
   • Required: Active la casilla.
   • Legal: Introduzca I agree to the Privacy Policy.
   • Seleccione Save.

3. Seleccione Publish para guardar.

​

Configurar el nodo Flow

Agregue un nodo Flow después del nodo Step para actualizar app_metadata y reanudar el flujo de autenticación. Para ello, siga estos pasos:

1. Seleccione Flow en la parte inferior del editor de formularios.

2. Elimine el vínculo existente entre los nodos Step y Ending Screen.

3. Seleccione el nuevo Flow > Click to add a flow > Create a new flow.

   • Introduzca Update app_metadata en el campo nombre.
   • Seleccione Create.
   • Seleccione Save.

4. Vincule el nodo Flow a los nodos Step y Ending Screen, como se muestra a continuación.

5. Seleccione Publish para guardar.

Agregue una acción Update user de Auth0 al flujo siguiendo estos pasos:

1. Seleccione Flow Update app_metadata > Edit flow para abrir el editor de Flow en una pestaña nueva.

2. Debajo de StartAction, seleccione el icono + para agregar una acción Update user. Complete los siguientes campos y, a continuación, seleccione Save para continuar.

   • Connection: Seleccione en el menú desplegable la conexión de Vault correspondiente a su aplicación M2M.

   • User ID: Introduzca {{context.user.user_id}}.

   • Body: Copie y pegue el siguiente código para actualizar app_metadata con las propiedades privacy_policies y privacy_policies_timestamp.

     {
       "app_metadata": {
         "privacy_policies": true,
         "privacy_policies_timestamp": "{{ functions.toTimestamp() }}"
       }
     }
     

   • Seleccione Save.

3. Seleccione Publish para guardar.

El flujo Update app_metadata agrega el valor privacy_policies true al objeto app_metadata y también genera una marca de tiempo con una función auxiliar.

​

Obtener el código de renderizado del formulario

Obtenga el código de renderizado del formulario para renderizar visualmente el formulario con una Action personalizada de Post Login siguiendo estos pasos:

• En el editor de formularios, seleccione <> Render.
• Seleccione Copiar.

​

Crear una Action de Post Login

Cree una Action de post-login para mostrar el formulario siguiendo estos pasos:

1. Vaya a Auth0 Dashboard > Actions > Flows > Login.

2. Seleccione el icono + y luego Build from scratch:

   • Nombre: Introduzca Render Update Policy Form.
   • Trigger: Seleccione Login / Post Login.
   • Runtime: Seleccione la versión recomendada.

3. Seleccione Create.

Para configurar la Action de post-login:

1. Elimine el código existente del editor de código.

2. Pegue el código de renderizado del formulario en el editor de código.

3. Edite el código para definir la lógica condicional que mostrará el formulario.

   /**
   * @param {Event} event - Detalles sobre el usuario y el contexto en el que está iniciando sesión.
   * @param {PostLoginAPI} api - Interfaz cuyos métodos se pueden usar para cambiar el comportamiento del inicio de sesión.
   */
   exports.onExecutePostLogin = async (event, api) => {
     const FORM_ID = 'REPLACE_WITH_YOUR_FORM_ID';
   
     if (event.user.app_metadata.privacy_policies !== true) {
       api.prompt.render(FORM_ID);
     }
   }
   
   exports.onContinuePostLogin = async (event, api) => { }
   
   El código de ejemplo anterior mostrará el formulario cuando al usuario le falte la propiedad privacy_policies en los metadatos de la aplicación.

4. Seleccione Deploy.

5. Arrastre y suelte la Action Render Update Policy Form en el flujo Login.

   

6. Seleccione Apply.

​

Probar la implementación

Pruebe la implementación siguiendo estos pasos:

1. Inicie sesión con un usuario existente cuyo atributo app_metadata privacy_policies no tenga ningún valor.
2. La Action de post-login en el flujo de inicio de sesión mostrará el formulario y solicitará su aceptación.
3. Seleccione Auth0 Dashboard > User Management > Users, busque al usuario y verifique que el atributo app_metadata privacy_policies contenga un valor true y una marca de tiempo.