Как инструментировать клиент веб-приложения React с помощью aws xray

Я пытаюсь настроить свое веб-приложение на React с помощью https://docs.aws.amazon.com/xray/latest/devguide/scorekeep-client.html

Я использую перехватчик Axios, но не могу реализовать какие-либо дальнейшие идеи?


person user007    schedule 22.01.2019    source источник


Ответы (1)


Вот код перехватчика Axois, который вам понадобится для X-Ray. Axios не использует базовую библиотеку HTTP от Node, поэтому вам необходимо включить этот патчер.

Недавно я написал образец приложения для публикации, вот фрагмент, который я использовал. Надеюсь, это поможет.

const xray = require('aws-xray-sdk-core');
const segmentUtils = xray.SegmentUtils;

let captureAxios = function(axios) {

  //add a request interceptor on POST

  axios.interceptors.request.use(function (config) {
    var parent = xray.getSegment();
    var subsegment = parent.addNewSubsegment(config.baseURL + config.url.substr(1));
    subsegment.namespace = 'remote';

    let root = parent.segment ? parent.segment : parent;
    let header = 'Root=' + root.trace_id + ';Parent=' + subsegment.id + ';Sampled=' + (!root.notTraced ? '1' : '0');
    config.headers.get={ 'x-amzn-trace-id': header };
    config.headers.post={ 'x-amzn-trace-id': header };

    xray.setSegment(subsegment);

    return config;
  }, function (error) {
    var subsegment = xray.getSegment().addNewSubsegment("Intercept request error");
    subsegment.close(error);

    return Promise.reject(error);
  });

  // Add a response interceptor
  axios.interceptors.response.use(function (response) {
    var subsegment = xray.getSegment();
    const res = { statusCode: response.status, headers: response.headers };

    subsegment.addRemoteRequestData(response.request, res, true);
    subsegment.close();
    return response;
  }, function (error) {
    var subsegment = xray.getSegment();
    subsegment.close(error);

    return Promise.reject(error);
  });
};

module.exports = captureAxios;

использование

Just pass in an initialized instance of Axios.

Что касается React, вам придется рассказать мне немного больше о вашей настройке и о том, чего вы пытаетесь достичь. X-Ray заботится только о маршрутах в вашем приложении - обычно перехватчики устанавливаются на маршрутах для сбора данных и создания (и закрытия) корневого сегмента (см. X-Ray SDK для Node Express здесь). Что касается интеграции через браузер, мы все еще обсуждаем возможные варианты со стороны X-Ray.

person AWSSandra    schedule 22.01.2019
comment
Привет, @AWSSandra, спасибо за информацию, я ищу интеграцию на основе браузера, следуя ссылка - person user007; 23.01.2019
comment
несколько getSetment () кажутся неправильными, если могут быть параллельные вызовы. Я изменил код, чтобы прикрепить подсегмент к конфигурации axios. Также res может быть просто response.request.res - person Andrea Ratto; 10.03.2020