Dados do browser em distributed tracing

Se você usar o New Relic para monitor a atividade do browser do usuário final, poderá aproveitar as vantagens do distributed tracing para ver o rastreamento do lado do browser originado da experiência do usuário final.

Trace atividade do frontend ao backend

Ao relatar os dados do browser no distributed tracing, você pode ver a conexão entre a atividade de front-end e a atividade backend . Os dados de rastreamento da New Relic em uma transação completa, desde o tempo gasto por um usuário final no browser da web, até a atividade de rede e serviços backend associados. Isso ajuda você:

• Detecte latências, erros e anomalias no browser ou na rede com mais facilidade.
• Resolva problemas enfrentados pelos clientes com mais rapidez.
• Aplique todos os benefícios do distributed tracing ao monitoramento do usuário final.

Este recurso relata solicitações AJAX (Fetch e XHR) que ocorrem durante uma interação do browser. Por padrão, apenas as solicitações de origem única são monitoradas, a menos que o compartilhamento de recursos de origem cruzada esteja habilitado.

Versões de browser e APM

Certifique-se de ter as versões mínimas necessárias para seu agente monitoramento de browsere seu agente APM:

Browser monitoring:

• Para distributed tracing: agente browser Pro+SPA com distributed tracing habilitado e browser agente versão 1153 ou superior
• Para compartilhamento de recursos de origem cruzada: browser agente versão 1158 ou superior
• Para suporte W3C Trace Context : agente browser versão 1173 ou superior

APM:

• Java 5.9.0 ou superior
• PHP 9.4.0 ou superior
• Outros requisitos de versão do agente APM

Habilitar distributed tracing

Por padrão, para a versão do agente 1173 e superior, os cabeçalhos newrelic, traceparent e tracestate serão adicionados a todas as solicitações AJAX de mesma origem. (Se você excluí-los, nenhum cabeçalho será enviado.) Para obter mais informações, consulte nossa documentação sobre cabeçalhosW3C Trace Context .

Para habilitar distributed tracing para monitoramento do browser:

1. Certifique-se de que seu agente de monitoramento de browser e agente APM sejam compatíveis com distributed tracing. Atualize para a versão mais recente, se aplicável.

2. Vá para

   one.newrelic.com > All capabilities > Browser > (select an app) > Settings > Application settings

   .

3. Ative o botão

   Distributed tracing

   .

4. Opcional: ative o compartilhamento de recursos de origem cruzada.

5. Reimplante o agente de monitoramento do browser, reiniciando o agente APM associado ou atualizando a instalação de copiar/colar do browser.

6. Se você tiver aplicativos ou serviços downstream do seu aplicativo de browser e eles usarem o Infinite Tracing, conclua as etapas de configuração do Infinite Tracing.

Cabeçalhos W3C Trace Context

Com o lançamento do agente de monitoramento de browser versão 1173, oferecemos suporte aos cabeçalhos W3C Trace Context (traceparent e tracestate), portanto, certifique-se de permiti-los em sua configuração. W3C Trace Context define um par de cabeçalhos HTTP de contexto padronizados que servem para propagar informações de correlação de contexto entre serviços:

• Um cabeçalho traceparent contém os elementos de dados que todo modelo distributed tracing requer para definir e propagar o contexto: um ID trace , um ID pai e um sinalizador de amostra.
• Um cabeçalho tracestate contém dados contextuais específicos do fornecedor, normalmente para oferecer suporte a funcionalidades ou otimizações adicionais associadas a uma ferramenta de rastreamento específica.

Para obter mais informações sobre W3C Trace Context, consulte nossa postagem no blog.

Habilitar compartilhamento de recursos de origem cruzada (CORS)

Se você tiver solicitações AJAX que precisam de recursos de origens diferentes, poderá habilitar o compartilhamento de recursos entre origens (CORS). Por padrão, distributed tracing para solicitações de origem cruzada não está ativado devido a restrições de segurança CORS do browser: distributed tracing é implementado adicionando cabeçalhos HTTP personalizados (newrelic, traceparent e tracestate) a solicitações AJAX de saída e browsers normalmente não permitem cabeçalhos personalizados em solicitações de origem cruzada.

Existem duas configurações separadas necessárias para ativar distributed tracing de origem cruzada:

1. Configure o serviço na origem diferente para aceitar o cabeçalho personalizado newrelic .

2. Configure o monitoramento do browser em seu

   Application settings

   para incluir a origem alvo no distributed tracing.

Esta seção fornece os principais conceitos e etapas para habilitar e configurar o CORS. Se você precisar de mais informações sobre como funciona o compartilhamento de recursos entre origens, recomendamos este documento para desenvolvedores da Mozilla.

Access-Control-Allow-Headers: newrelic, traceparent, tracestate

Habilitar rastreamento infinito

Oferecemos um tail-based distributed tracing recurso chamado Infinite Tracing. Se os aplicativos do seu browser tiverem serviços downstream, certifique-se de habilitá-los. Isso garante que seu intervalo raiz (o aplicativo de browser inicial) seja incluído no restante dos intervalos rastreados pelo Infinite Tracing.

Para configurar o rastreamento infinito:

1. Conclua as etapas para ativar distributed tracing.
2. Acesse nossa documentação do Infinite Tracing e siga as etapas para criar um observador trace e selecionar quais aplicativos (fontes de dados) você deseja enviar intervalos trace para o observador trace do Infinite Tracing.

Explore seus dados trace

Aqui estão algumas dicas para encontrar e consultar seus dados trace no New Relic.

Resolução de problemas

Se você não vir spans de usuário final ou estiver tendo outros problemas distributed tracing , consulte nossa documentação sobre resolução de problemas .