Configurar ajustes de privacidad

La privacidad del usuario es una consideración fundamental al grabar la repetición de la sesión. Aunque la configuración predeterminada está diseñada para proteger información confidencial, es posible que necesite ajustar la configuración de privacidad para satisfacer necesidades específicas. Esta sección explica cómo enmascarar, bloquear o ignorar ciertos datos para cumplir con los estándares de privacidad y mantener la funcionalidad de Session Replay.

Por defecto, todo el texto y las entradas se reemplazan con asteriscos en el lado del agente de browser antes de que los datos se transmitan a New Relic. Este es un ejemplo de cómo se ve una repetición con la privacidad predeterminada:

Si esta configuración es adecuada, pase al siguiente paso.

Si necesita personalizar qué contenido o entrada del usuario se captura, tiene opciones para enmascarar, bloquear o ignorar clases y atributos específicos de contenido o entrada del usuario. Asegúrese de consultar con su equipo de privacidad antes de cambiar la configuración de privacidad.

Tipos de ajustes de privacidad

Session Replay ofrece dos modos de privacidad en la configuración de tu aplicación:

• Default privacy settings (recommended): este modo enmascara todo el contenido de la página al reemplazar todo el texto y las entradas con asteriscos (*)

• Custom privacy settings: Este modo proporciona un control granular sobre dos áreas distintas:

  • Text-masking and blocking: Controla texto estático, etiquetas, botones y contenido general de la página. Puede administrarlos usando los campos Mask selectors y Block selectors.

  • User input masking: controla elementos de formulario interactivos. Puede administrarlos usando casillas de verificación para tipos de entrada específicos, como texto, correo electrónico, números y fechas.

    Importante

    Desmarcar todas las casillas de verificación User input masking solo desenmascara las entradas del formulario. Su texto estático (como etiquetas y botones) permanece enmascarado a menos que también configure el campo Mask selectors.

Enmascarar PII específica

Para mostrar todo el texto estático (como etiquetas, botones y encabezados) y solo enmascarar entradas de usuario confidenciales específicas (como números de tarjetas de crédito o SSN), siga estos pasos:

1. Vaya a one.newrelic.com > All Capabilities > Browser.

2. Seleccione la aplicación de su browser .

3. En el menú de la izquierda, haga clic en Application settings.

4. En la sección Privacy settings, seleccione Custom privacy settings.

5. En la sección Text-masking and blocking, borre los campos Mask selectors y Block selectors. Esto desenmascarará todo el texto estático en su sitio, como etiquetas y botones.

6. En la sección User input masking :

   1. Desmarque todas las casillas de verificación para eliminar el enmascaramiento de todos los campos de entrada del usuario.
   2. Seleccione las casillas de verificación para los tipos de entrada específicos que desea enmascarar. Esto garantizará que solo esas entradas específicas del usuario estén enmascaradas mientras que todas las demás entradas permanezcan visibles.

7. Vuelva a implementar su aplicación para aplicar los cambios.

Después de volver a implementar, todo el texto estático se muestra normalmente mientras que solo los elementos marcados específicamente permanecen enmascarados. Para obtener información adicional:

• Para ocultar los detalles de entrada del usuario, consulte la sección enmascarar texto confidencial
• Para mostrar el texto estático, consulte la sección desenmascarar texto estático
• Para ignorar el contenido de entrada del usuario, consulte la sección ignorar entrada del usuario

Gestionar CSS de origen cruzado para la reproducción de sesiones

Las configuraciones CSS de origen cruzado le permiten controlar si los recursos CSS se obtienen del dominio remoto durante la inicialización de la reproducción de sesión. Esto es crucial para garantizar que las repeticiones reflejen con precisión el estilo de su sitio web. Puede gestionar el acceso CSS de origen cruzado a través de la plataforma New Relic o actualizando manualmente su código HTML.

Puede gestionar CSS de origen cruzado empleando una de las siguientes dos formas:

• Usando la plataforma New Relic
• Cómo agregar un atributo anónimo a su archivo HTML

Usando la plataforma New Relic

De forma predeterminada, la opción Fetch cross-origin CSS when session replay starts está habilitada para la reproducción de sesión en la plataforma New Relic . Puede cambiar esta configuración desde la página de Application settings habilitando o deshabilitando la opción Fetch cross-origin CSS when session replay starts .

Agregando anonymous

Agregue el atributo crossorigin="anonymous" a sus elementos <link rel="stylesheet"> en su código HTML. Este atributo le indica al browser que permita el acceso de origen cruzado para esos archivos CSS específicos, lo que permite que nuestro agente del browser registre e integre la información de estilo.

Por ejemplo:

<link
  rel="stylesheet"
  href="assets.yoursite.com/styles.css"
  crossorigin="anonymous"
/>

Enmascarar texto sensible

Puede enmascarar texto confidencial, lo que significa que el texto se reemplazará con asteriscos (*). Por ejemplo, puede enmascarar el ID de cuenta de un usuario que se muestra en una URL.

Para especificar qué entrada debe enmascararse, tiene algunas opciones:

• En la página Application settings , agregue sus propios selectores CSS o marque las casillas de enmascaramiento. Tenga en cuenta que el uso de selectores enmascarados no enmascarará la entrada del usuario, por lo que si necesita ocultar la entrada del usuario, le recomendamos emplear selectores de bloque.

  

• Agregue nuestra clase CSS nr-mask o atributo data-nr-mask al HTML de su sitio web.

  Por ejemplo, para ocultar un ID de cuenta para que no se muestre en la URL, agregue nr-mask al <div> que contiene el ID de cuenta:

  <div>Account ID: <span class="nr-mask">99881123</span></div>

Estas opciones emplean un asterisco (*) para enmascarar todo el texto en ese elemento, ocultando el texto real pero revelando la cantidad de caracteres ingresados. Sin embargo, los asteriscos no son números válidos, por lo que enmascarar campos específicos del tipo de número, como números de teléfono o de tarjetas de crédito, dará como resultado un campo en blanco en una repetición.

Unmask texto estático

De forma predeterminada, todo el texto estático está enmascarado cuando utiliza la configuración recomendada. Si desea desenmascarar explícitamente elementos de texto estático específicos, puede agregar la clase nr-unmask o el atributo data-nr-unmask a ese elemento específico. Esto es útil cuando desea mantener habilitado el enmascaramiento global pero necesita que ciertos elementos permanezcan visibles.

Para desenmascarar elementos de texto específicos, utilice una de las siguientes opciones:

• En la plataforma New Relic: en la página Application settings, agregue selectores CSS al campo Mask selectors. Para desenmascarar todo el texto estático, borre este campo.

• En su código: agregue la clase CSS nr-unmask o el atributo data-nr-unmask a sus elementos HTML.

  Por ejemplo, para mostrar el nombre de un producto mientras que el resto del texto permanece enmascarado utilizando:

  • Una clase CSS en línea:

  <p>Product Name: <span class="nr-unmask">Premium Widget</span></p>

  Copia
  • Un atributo de datos en línea:

  <p>Product Name: <span data-nr-unmask>Premium Widget</span></p>

  Copia

Bloquear contenido del sitio

Puede bloquear secciones enteras de contenido en su sitio, lo que significa que la sección aparecerá como un marcador de posición vacío en Session Replay. Por ejemplo, si tiene una imagen en su página web Acerca de nosotros y no necesita que se capture, podría bloquear la clase que contiene la imagen.

Para bloquear clases o atributos específicos, tienes algunas opciones:

• En la página de configuración de la aplicación, agregue sus selectores CSS en el campo *Bloquear selectores .

  

• Agregue manualmente nuestra clase CSS nr-block o atributo data-nr-block al HTML de su página web. Por ejemplo, si desea bloquear texto e imágenes irrelevantes de Session Replay, agregue nr-block a <div class>:

  <html>
    <head>
      <title>Sample image and text</title>
    </head>
    <body>
      <div class="image-text-container nr-block">
        <img src="https://example.com/image.png" alt="Image description" />
      </div>
    </body>
  </html>

  Copia

Ignorar la entrada del usuario

Puede ignorar los cambios en un campo de entrada del usuario, lo que significa que el campo de entrada seguirá mostrar en la repetición, pero no mostrará los cambios en el valor. Por ejemplo, puede ignorar la clase que contiene los campos de dirección de email o tarjeta de crédito. Los campos de entrada de contraseña siempre están enmascarados. 

Para ignorar la entrada, agregue la clase CSS nr-ignore al nombre de clase del campo de entrada. Por ejemplo, si desea ignorar información confidencial en una página de facturación, agregue class="nr-ignore" a <input type>:

<div class="sensitive-information">
  <h2>Sensitive Information</h2>
  <p>
    Credit card number:
    <input type="number" class="nr-ignore" id="creditCardNumber" />
  </p>
  <p>
    Expiration date:
    <input type="number" class="nr-ignore" id="expirationDate" />
  </p>
  <p>CVV code: <input type="number" class="nr-ignore" id="cvvCode" /></p>
</div>