Definir configurações de privacidade

A privacidade do usuário é uma consideração crítica ao gravar o Session Replay. Embora as configurações padrão sejam projetadas para proteger informações confidenciais, pode ser necessário ajustar as configurações de privacidade para atender a necessidades específicas. Esta seção explica como ocultar, bloquear ou ignorar determinados dados para cumprir com os padrões de privacidade e, ao mesmo tempo, manter a funcionalidade do Session Replay.

Por padrão, todos os textos e entradas são substituídos por asteriscos no lado do agente do browser antes que os dados sejam transmitidos para a New Relic. Aqui está um exemplo de como um replay se parece com a privacidade padrão:

Se essa configuração for apropriada, vá para a próxima etapa.

Se precisar personalizar qual conteúdo ou entrada do usuário é capturado, você terá opções para mascarar, bloquear ou ignorar classes específicas e atributos de conteúdo ou entrada do usuário. Certifique-se de verificar com sua equipe de privacidade antes de alterar as configurações de privacidade.

Tipos de configurações de privacidade

O Session Replay oferece dois modos de privacidade nas configurações do seu aplicativo:

• Default privacy settings (recommended): Este modo mascara todo o conteúdo da página substituindo todos os textos e entradas por asteriscos (*)

• Custom privacy settings: Este modo oferece controle granular sobre duas áreas distintas:

  • Text-masking and blocking: Controla texto estático, rótulos, botões e conteúdo geral da página. Você gerencia isso usando os campos Mask selectors e Block selectors.

  • User input masking: Controla elementos de formulário interativos. Você os gerencia usando caixas de seleção para tipos específicos de entrada, como texto, e-mail, números e datas.

    Importante

    Limpar todas as caixas de seleção User input masking apenas desmascara as entradas de formulário. Seu texto estático (como rótulos e botões) permanece mascarado a menos que você também configure o campo Mask selectors.

Mascarar PII específica

Para exibir todo o texto estático (como rótulos, botões e cabeçalhos) e mascarar apenas entradas sensíveis específicas do usuário (como números de cartão de crédito ou SSNs), siga estas etapas:

1. Vá para one.newrelic.com > All Capabilities > Browser.

2. Selecione seu aplicativo de browser.

3. No menu à esquerda, clique em Application settings.

4. Na seção Privacy settings, selecione Custom privacy settings.

5. Na seção Text-masking and blocking, limpe os campos Mask selectors e Block selectors. Isso desmascarará todo o texto estático no seu site, como rótulos e botões.

6. Na seção User input masking :

   1. Desmarque todas as caixas de seleção para remover o mascaramento de todos os campos de entrada do usuário.
   2. Marque as caixas de seleção para os tipos de entrada específicos que você deseja mascarar. Isso garantirá que apenas essas entradas específicas do usuário sejam mascaradas, enquanto todas as outras entradas permanecem visíveis.

7. Reimplante seu aplicativo para aplicar as alterações.

Depois de reimplantar, todo o texto estático é exibido normalmente, enquanto apenas os elementos marcados especificamente permanecem mascarados. Para informações adicionais:

• Para ocultar os detalhes de entrada do usuário, consulte a seção mascarar texto confidencial
• Para exibir o texto estático, consulte a seção desmascarar texto estático
• Para ignorar o conteúdo de entrada do usuário, consulte a seção ignorar a entrada do usuário

Gerenciar CSS de origem cruzada para reprodução de sessão

As configurações CSS de origem cruzada permitem que você controle se os ativos CSS são buscados do domínio remoto durante a inicialização do Session Replay. Isso é crucial para garantir que os replays reflitam com precisão o estilo do seu site. Você pode gerenciar o acesso CSS de origem cruzada por meio da plataforma New Relic ou atualizando manualmente seu código HTML.

Você pode gerenciar CSS de origem cruzada usando uma das duas maneiras a seguir:

• Usando a plataforma New Relic
• Adicionando atributo anônimo ao seu arquivo HTML

Usando a plataforma New Relic

Por padrão, a opção Fetch cross-origin CSS when session replay starts está habilitada para o Session Replay na plataforma New Relic . Você pode alterar essa configuração na página de Application settings , habilitando ou desabilitando a opção Fetch cross-origin CSS when session replay starts .

Adicionando anonymous

Adicione o atributo crossorigin="anonymous" aos seus elementos <link rel="stylesheet"> no seu código HTML. Este atributo instrui o browser a permitir acesso de origem cruzada para esses arquivos CSS específicos, permitindo que nosso agente de browser registre e integre as informações de estilo.

Por exemplo:

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

Mascarar texto sensível

Você pode mascarar texto confidencial, o que significa que o texto será substituído por asteriscos (*). Por exemplo, você pode mascarar o ID da conta de um usuário exibido em um URL.

Para especificar qual entrada deve ser mascarada, você tem algumas opções:

• Na página Application settings , adicione seus próprios seletores CSS ou marque as caixas de mascaramento. Observe que usar seletores de bloco não ocultará a entrada do usuário, portanto, se você precisar ocultar a entrada do usuário, recomendamos usar seletores de bloco.

  

• Adicione nossa classe CSS nr-mask ou atributo data-nr-mask ao HTML da sua página da web.

  Por exemplo, para mascarar a exibição de um ID de conta no URL, adicione nr-mask ao <div> que contém o ID da conta:

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

Essas opções usam um asterisco (*) para mascarar todo o texto naquele elemento, ocultando o texto real, mas revelando o número de caracteres inseridos. No entanto, asteriscos não são números válidos, portanto, mascarar campos específicos de tipo numérico, como números de telefone ou de cartão de crédito, resultará em um campo em branco na reprodução.

Unmask texto estático

Por padrão, todo o texto estático é mascarado quando você usa as configurações recomendadas. Se você quiser desmascarar explicitamente elementos de texto estático específicos, poderá adicionar a classe nr-unmask ou o atributo data-nr-unmask a esse elemento específico. Isso é útil quando você deseja manter o mascaramento global ativado, mas precisa que determinados elementos permaneçam visíveis.

Para desmascarar elementos de texto específicos, use uma das seguintes opções:

• Na plataforma New Relic: na página Application settings, adicione seletores CSS ao campo Mask selectors. Para desmascarar todo o texto estático, limpe este campo.

• No seu código: adicione a classe CSS nr-unmask ou o atributo data-nr-unmask aos seus elementos HTML.

  Por exemplo, para exibir o nome de um produto enquanto outro texto permanece mascarado usando:

  • Uma classe CSS inline:

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

  Copiar
  • Um atributo de dados inline:

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

  Copiar

Bloquear conteúdo do site

Você pode bloquear seções inteiras de conteúdo no seu site, o que significa que a seção aparecerá como um espaço reservado vazio no Session Replay. Por exemplo, se você tiver uma imagem na sua página da web Sobre nós e não precisar que ela seja capturada, poderá bloquear a classe que contém a imagem.

Para bloquear aulas ou atributos específicos, você tem algumas opções:

• Na página Configurações do aplicativo, adicione seus seletores CSS no campo *Seletores de bloco .

  

• Adicione manualmente nossa classe CSS nr-block ou atributo data-nr-block ao HTML da sua página da web. Por exemplo, se você quiser bloquear textos e imagens irrelevantes do Session Replay, adicione 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>

  Copiar

Ignorar a entrada do usuário

Você pode ignorar as alterações em um campo de entrada do usuário, o que significa que o campo de entrada ainda será exibido na reprodução, mas você não exibirá as alterações no valor. Por exemplo, você pode ignorar a classe que contém o endereço de e-mail ou os campos do cartão de crédito. Os campos de entrada de senha são sempre mascarados. 

Para ignorar a entrada, adicione a classe CSS nr-ignore ao nome da classe do campo de entrada. Por exemplo, se quiser ignorar informações confidenciais em uma página de faturamento, adicione 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>