Menginstrumentasi klien aplikasi web

catatan

End-of-support pemberitahuan — Pada tanggal 25 Februari 2027, AWS X-Ray akan menghentikan dukungan untuk AWS X-Ray SDKs dan daemon. Setelah 25 Februari 2027, Anda tidak akan lagi menerima pembaruan atau rilis. Untuk informasi selengkapnya tentang garis waktu dukungan, lihatX-Ray SDK dan daemon akhir garis waktu dukungan. Kami merekomendasikan untuk bermigrasi ke OpenTelemetry. Untuk informasi lebih lanjut tentang migrasi ke OpenTelemetry, lihat Migrasi dari instrumentasi X-Ray ke instrumentasi. OpenTelemetry

Di cabang xray-cognito, Scorekeep menggunakan Amazon Cognito untuk memungkinkan pengguna membuat akun dan masuk dengan akun tersebut untuk mengambil informasi pengguna mereka dari kolam pengguna Amazon Cognito. Saat pengguna masuk, Scorekeep menggunakan kumpulan identitas Amazon Cognito untuk mendapatkan kredensi AWS sementara untuk digunakan dengan. AWS SDK untuk JavaScript

Kolam identitas dikonfigurasi untuk membiarkan masuk pengguna menulis penelusuran data ke AWS X-Ray. Aplikasi web menggunakan kredensialnya untuk mencatat ID pengguna yang masuk, jalur peramban, dan tampilan panggilan klien ke API Skorrekeep.

Sebagian besar pekerjaan dilakukan di kelas layanan bernama xray. Kelas layanan ini menyediakan metode untuk menghasilkan pengidentifikasi yang diperlukan, menciptakan segmen yang sedang berlangsung, menyelesaikan segmen, dan mengirimkan dokumen segmen ke API X-Ray.

contoh public/xray.js – Catat dan unggah segmen

...
  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);
      }
    })
  }

Metode ini disebut di header dan fungsitransformResponse di layanan sumber daya yang digunakan aplikasi web untuk memanggil API Skorrekeep. Untuk menyertakan segmen klien dalam pelacakan yang sama sebagai segmen yang menghasilkan API, aplikasi web harus menyertakan ID pelacakan dan ID segmen di header pelacakan (X-Amzn-Trace-Id) yang dapat dibaca X-Ray SDK. Ketika aplikasi Java instrumented menerima permintaan dengan header ini, X-Ray SDK for Java menggunakan ID penelusuran yang sama dan membuat segmen dari klien aplikasi web induk dari segmennya.

contoh public/app/services.js - Mencatat segmen untuk panggilan sumber daya sudut dan menulis header pelacakan

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);
      },
    },
...

Peta jejak yang dihasilkan menyertakan node untuk klien aplikasi web.

Penelusuran yang mencakup segmen dari aplikasi web menampilkan URL yang dilihat pengguna di peramban (jalur yang dimulai dengan /#/). Tanpa instrumentasi klien, Anda hanya mendapatkan URL sumber daya API yang dipanggil aplikasi web (path dimulai dengan /api/).