Como monitorar a análise do visualizador de transmissão ao vivo com o Amazon IVS

Em minha última postagem, analisamos as métricas de integridade da transmissão ao vivo do Amazon Interactive Video Service (Amazon IVS) por meio do Amazon CloudWatch SDK. O monitoramento de integridade é um tópico super importante e crucial para manter o desempenho de seus aplicativos de transmissão ao vivo. Outro elemento crucial é a análise do visualizador. Nesta postagem, veremos algumas maneiras de fornecer informações sobre os visualizadores de stream.

Grande parte deste post será semelhante ao meu último post. Isso ocorre porque os dados do visualizador também são armazenados no CloudWatch e podem ser recuperados por meio do SDK. Há um método adicional, como veremos abaixo, para obter uma contagem dos espectadores atuais de uma transmissão ao vivo, que é uma maneira prática de obter uma contagem que pode ser exibida em seu front-end.

Observação: embora esta postagem se concentre em visualizadores de canais de transmissão ao vivo, você também pode recuperar métricas sobre suas salas de bate-papo do Amazon IVS, como ConcurrentChatConnections e messages Delivered . Não abordaremos isso neste post, mas você pode conferir os documentos para saber mais.

Recuperando exibições simultâneas por meio do console do CloudWatch

Se você está apenas procurando dar uma olhada nos dados do visualizador sem recuperar os dados brutos, pode visualizar seus ConcurrentViews por meio do console do CloudWatch. Primeiro, selecione Todas as métricas e, em seguida, escolha IVS .

Em seguida, selecione Por canal .

Em seguida, marque a caixa de seleção na linha que contém ConcurrentViews para qualquer um de seus canais do Amazon IVS.

Outra maneira de encontrar exibições simultâneas para uma sessão de streaming é por meio do console do Amazon IVS. Selecione seu canal e escolha um ID de transmissão na página de detalhes do canal.

Os detalhes de uma sessão de transmissão conterão vários gráficos, um dos quais contém as exibições Simultâneas da sessão.

Recuperando exibições simultâneas por meio do CloudWatch SDK

Para integrar esses dados em seu próprio aplicativo, você pode recuperá-los por meio do CloudWatch SDK. Da mesma forma que as métricas de integridade, você precisará do ARN do canal, um StartTime e um EndTime para recuperar ConcurrentViews .

Em vez de escolher aleatoriamente os horários de início e término, provavelmente faz sentido obter esses horários dinamicamente, escolhendo os horários de início e término de uma sessão de transmissão ao vivo. Você pode recuperar uma lista de sessões de stream por meio do Amazon IVS SDK (como vimos na postagem anterior ).

Lembrete: você sempre precisará de um EndTime , mesmo para transmissões ao vivo no momento. Para transmissões ao vivo, você sempre pode usar a hora atual como EndTime ao usar o SDK para recuperar métricas.

Para recuperar esses dados por meio do AWS SDK for JavaScript (v3), você precisará instalar o pacote @aws-sdk/client-cloudwatch e criar uma instância do cliente ( new CloudWatchClient() ). Depois que a instância do cliente for criada, defina algumas variáveis para as entradas necessárias.

 const startTime = new Date('2023-02-10T14:00:00.000Z'); const endTime = new Date('2023-02-10T14:30:00.000Z'); const arn = process.env.DEMO_CHANNEL_ARN;

Em seguida, crie um objeto de entrada. O objeto de entrada conterá StartTime , EndTime e uma matriz de MetricDataQueries . A matriz de consultas conterá um único objeto que especifica o MetricName ( ConcurrentViews ), o Namespace ( AWS/IVS ) e as Dimensions pelas quais filtrar (nome do canal, neste caso).

 const getMetricDataInput = { StartTime: startTime, EndTime: endTime, MetricDataQueries: [{ Id: "concurrentviews", MetricStat: { Metric: { MetricName: "ConcurrentViews", Namespace: "AWS/IVS", Dimensions: [{ Name: "Channel", Value: arn.split("/")[1] }] }, Period: 5, Stat: "Average", } }], MaxDatapoints: 100 };

Agora envie a solicitação e registre o resultado.

 const getMetricDataRequest = new GetMetricDataCommand(getMetricDataInput); let metrics = await cloudWatchClient.send(getMetricDataRequest); console.log(metrics);

Que produz uma saída semelhante à seguinte (metadados SDK estranhos removidos para abreviar):

 { "MetricDataResults": [ { "Id": "concurrentviews", "Label": "ConcurrentViews", "Timestamps": [ "2023-02-10T14:29:00.000Z", "2023-02-10T14:28:00.000Z", "2023-02-10T14:27:00.000Z", "2023-02-10T14:26:00.000Z", "2023-02-10T14:22:00.000Z" ], "Values": [ 3, 3, 3, 3, 10 ], "StatusCode": "PartialData" } ] }

Você pode filtrar, classificar e gerar esses dados para produzir um formato útil para gerar gráficos.

 const viewMetrics = metrics .MetricDataResults .find((metric) => metric.Id === 'concurrentviews'); const viewValues = viewMetrics.Values.reverse(); const viewData = []; viewMetrics .Timestamps .reverse() .forEach((t, i) => { viewData.push({ timestamp: t, concurrentviews: viewValues[i], }) }); console.log(JSON.stringify(viewData));

Que produz uma matriz de objetos.

 [ { "timestamp": "2023-02-10T14:22:00.000Z", "concurrentviews": "10.00" }, { "timestamp": "2023-02-10T14:26:00.000Z", "concurrentviews": "3.00" }, ... ]

Você pode usar esses dados com nossa biblioteca de gráficos favorita (ou um gerador de gráficos on-line genérico, como eu fiz).

Gerando imagens de gráfico com o CloudWatch SDK

Na última postagem, analisamos a geração da imagem diretamente por meio do CloudWatch SDK. Essa abordagem também se aplica às suas métricas de exibição.

 const startTime = new Date('2023-02-10T14:00:00.000Z'); const endTime = new Date('2023-02-10T14:25:00.000Z'); const arn = process.env.DEMO_CHANNEL_ARN; const cloudWatchClient = new CloudWatchClient(); const getMetricWidgetImageInput = { MetricWidget: JSON.stringify({ metrics: [ [ "AWS/IVS", "ConcurrentViews", "Channel", arn.split("/")[1] ] ], start: startTime, end: endTime, period: 5, stat: "Average" }) }; const getMetricWidgetImageRequest = new GetMetricWidgetImageCommand(getMetricWidgetImageInput); const metricImage = await cloudWatchClient.send(getMetricWidgetImageRequest);

Que retorna um objeto com a chave MetricWidgetImage que contém um buffer de matriz ( Uint8Array ) contendo a imagem do gráfico.

 { "MetricWidgetImage": { "0": 137, "1": 80, "2": 78, ... } }

Para converter esse buffer de matriz em uma string base64:

 const buffer = Buffer.from(metricImage.MetricWidgetImage); console.log(buffer.toString('base64'));

O que nos dá:

 iVBORw0KGgoAAAANSUhEUgAAAlgAAAGQCAIAAAD9V4nPAAAACXBIWXMA...

Isso pode ser convertido em uma imagem que se parece com isso:

Recuperando Sessões Atuais de Visualização ao Vivo para um Canal

Conforme mencionado acima, você pode facilmente obter uma contagem das sessões de exibição atuais para a transmissão ao vivo ativa em um canal por meio do módulo cliente Amazon IVS no AWS SDK. Para isso, utilize o método GetStream .

 import { GetStreamCommand, IvsClient } from "@aws-sdk/client-ivs"; const client = new IvsClient(); const getStreamCommandInput = { channelArn: process.env.DEMO_CHANNEL_ARN, }; const getStreamRequest = new GetStreamCommand(getStreamCommandInput); const getStreamResponse = await client.send(getStreamRequest); console.log(getStreamResponse);

Que produz uma saída como a seguinte.

 { "stream": { "channelArn": "arn:aws:ivs:us-east-1:[redacted]:channel/[redacted]", "health": "HEALTHY", "playbackUrl": "https://[redacted].us-east-1.playback.live-video.net/api/video/v1/us-east-1.[redacted].channel.x4aGUUxIp5Vw.m3u8", "startTime": "2023-02-10T15:46:36.000Z", "state": "LIVE", "streamId": "st-[redacted]", "viewerCount": 5 } }

Observe a propriedade viewerCount , que é uma contagem ao vivo de sessões de visualização para a transmissão ao vivo atual.

Resumo

Nesta postagem, aprendemos como recuperar dados de exibição para nossas transmissões ao vivo do Amazon IVS por meio dos SDKs CloudWatch e Amazon IVS. Para saber mais, confira a documentação .

Coroa