Instrumentar o cliente do aplicativo web

Na ramificação xray-cognito, o Scorekeep usa o Amazon Cognito para permitir que os usuários criem uma conta e façam login com ela para recuperar informações de um grupo de usuários do Amazon Cognito. Quando um usuário faz login, o Scorekeep usa um pool de identidade do Amazon Cognito para obter credenciais AWS temporárias para uso com o. AWS SDK for JavaScript

O grupo de identidades é configurado para permitir que os usuários conectados rastreiem dados para o AWS X-Ray. O aplicativo web usa essas credenciais para gravar o ID do usuário conectado, o caminho do navegador e a visualização de chamadas do cliente para a API do Scorekeep.

A maior parte do trabalho é feita em uma classe de serviço chamada xray. Essa classe de serviço oferece métodos para gerar os identificadores necessários, criar segmentos em andamento, finalizar segmentos e enviar documentos de segmentos à API do X-Ray.

exemplo public/xray.js: gravar e carregar segmentos

...
  service.beginSegment = function() {
    var segment = {};
    var traceId = '1-' + service.getHexTime() + '-' + service.getHexId(24);

    var id = service.getHexId(16);
    var startTime = service.getEpochTime();

    segment.trace_id = traceId;
    segment.id = id;
    segment.start_time = startTime;
    segment.name = 'Scorekeep-client';
    segment.in_progress = true;
    segment.user =  sessionStorage['userid'];
    segment.http = {
      request: {
        url: window.location.href
      }
    };

    var documents = [];
    documents[0] = JSON.stringify(segment);
    service.putDocuments(documents);
    return segment;
  }

  service.endSegment = function(segment) {
    var endTime = service.getEpochTime();
    segment.end_time = endTime;
    segment.in_progress = false;
    var documents = [];
    documents[0] = JSON.stringify(segment);
    service.putDocuments(documents);
  }

  service.putDocuments = function(documents) {
    var xray = new AWS.XRay();
    var params = {
      TraceSegmentDocuments: documents
    };
    xray.putTraceSegments(params, function(err, data) {
      if (err) {
        console.log(err, err.stack);
      } else {
        console.log(data);
      }
    })
  }

Esses métodos são chamados no cabeçalho e nas funções transformResponse nos serviços do recurso que o aplicativo web usa para chamar a API do Scorekeep. Para incluir o segmento do cliente no mesmo rastreamento que o segmento gerado pela API, a aplicação web deve incluir o ID do rastreamento e o ID do segmento em um cabeçalho de rastreamento (X-Amzn-Trace-Id) que o X-Ray SDK possa ler. Quando a aplicação Java instrumentada recebe uma solicitação com esse cabeçalho, o X-Ray SDK para Java usa o mesmo ID de rastreamento e torna o segmento do cliente da aplicação web o pai do respectivo segmento.

exemplo public/app/services.js: gravar segmentos para chamadas de recurso angular e gravar cabeçalhos de rastreamento

var module = angular.module('scorekeep');
module.factory('SessionService', function($resource, api, XRay) {
  return $resource(api + 'session/:id', { id: '@_id' }, {
    segment: {},
    get: {
      method: 'GET',
      headers: {
        'X-Amzn-Trace-Id': function(config) {
          segment = XRay.beginSegment();
          return XRay.getTraceHeader(segment);
        }
      },
      transformResponse: function(data) {
        XRay.endSegment(segment);
        return angular.fromJson(data);
      },
    },
...

O mapa de rastreamento resultante inclui um nó para o cliente do aplicativo web.

Os rastreamentos que incluem segmentos do aplicativo web mostram a URL que o usuário vê no navegador (caminhos começando com /#/). Sem instrumentação de cliente, você só obtém a URL do recurso da API que o aplicativo web chama (caminhos começando com /api/).