As traduções são geradas por tradução automática. Em caso de conflito entre o conteúdo da tradução e da versão original em inglês, a versão em inglês prevalecerá. # Reprodução de vídeo com HLS O [HTTP Live Streaming (HLS)](https://en.wikipedia.org/wiki/HTTP_Live_Streaming) é um protocolo de comunicação de streaming de mídia baseado em HTTP padrão do setor. Você pode usar o HLS para ver um stream de vídeo do Kinesis, seja para reprodução ao vivo ou para ver vídeos arquivados. Você pode usar HLS para reprodução ao vivo. A latência geralmente é de 3 a 5 segundos, mas pode ser de 1 a 10 segundos, dependendo do caso de uso, do player e das condições da rede. Você pode usar um player de terceiros (como o [Video.js](https://github.com/videojs/video.js/) ou o [Google Shaka Player](https://github.com/google/shaka-player)) para exibir o streaming de vídeo fornecendo a URL da sessão de streaming HLS de forma programática ou manual. Você também pode reproduzir vídeo inserindo o URL da sessão de streaming HLS na barra de localização dos navegadores [Apple Safari](https://www.apple.com/safari/) ou [Microsoft Edge](https://www.microsoft.com/en-us/edge). [Para ver um stream de vídeo do Kinesis usando o HLS, primeiro crie uma sessão de streaming usando Get SessionURL. HLSStreaming](https://docs.aws.amazon.com/kinesisvideostreams/latest/dg/API_reader_GetHLSStreamingSessionURL.html) Essa ação retorna uma URL (contendo um token de sessão) para acessar a sessão HLS. Em seguida, você pode usar a URL em um player de mídia ou em um aplicativo autônomo para exibir o streaming. **Importante** Nem todas as mídias enviadas para o Kinesis Video Streams podem ser reproduzidas por meio do HLS. Consulte [GetHLSStreamingSessionURL](API_reader_GetHLSStreamingSessionURL.md) os requisitos específicos de carregamento. **Topics** + [Use o AWS CLI para recuperar um URL de sessão de streaming HLS](#retrieve-hls-url) + [Exemplo: Use HLS em HTML e JavaScript](#how-hls-ex1) + [Solução de problemas de HLS](#how-hls-ex1-ts) ## Use o AWS CLI para recuperar um URL de sessão de streaming HLS O procedimento a seguir demonstra como usar o AWS CLI para gerar um URL de sessão de streaming HLS para um stream de vídeo do Kinesis. Para obter instruções de instalação, consulte o [Guia AWS Command Line Interface do usuário](https://docs.aws.amazon.com//cli/latest/userguide/getting-started-install.html#getting-started-install-instructions). Após a instalação, [configure o AWS CLI](https://docs.aws.amazon.com//cli/latest/userguide/getting-started-quickstart.html#getting-started-quickstart-new) com credenciais e região. Como alternativa, abra o AWS CloudShell terminal, que tem o AWS CLI instalado e configurado. Consulte o [Guia do usuário do AWS CloudShell](https://docs.aws.amazon.com//cloudshell/latest/userguide/welcome.html#how-to-get-started) para obter mais informações. **Recupere o endpoint de URL do HLS para seu stream de vídeo do Kinesis.** 1. Digite o seguinte no terminal: ``` aws kinesisvideo get-data-endpoint \ --api-name GET_HLS_STREAMING_SESSION_URL \ --stream-name YourStreamName ``` Você receberá uma resposta parecida com esta: ``` { "DataEndpoint": "https://b-1234abcd.kinesisvideo.aws-region.amazonaws.com" } ``` 1. Faça a solicitação de URL da sessão de streaming HLS para esse endpoint retornado. ------ #### [ Live ] Para reprodução ao vivo, a playlist de mídia HLS é continuamente atualizada com a mídia mais recente à medida que ela é disponibilizada. Quando você reproduz esse tipo de sessão em um reprodutor de mídia, a interface do usuário normalmente exibe uma notificação “**ao vivo**”, sem controle manual para escolher a posição na janela de reprodução a ser exibida. Certifique-se de fazer upload de mídia para esse stream ao executar esse comando. ``` aws kinesis-video-archived-media get-hls-streaming-session-url \ --endpoint-url https://b-1234abcd.kinesisvideo.aws-region.amazonaws.com \ --stream-name YourStreamName \ --playback-mode LIVE ``` ------ #### [ Live replay ] Para reprodução ao vivo, a reprodução começa a partir de um horário de início especificado. A lista de reprodução de mídia do HLS também é atualizada continuamente com as mídias mais recentes à medida que são disponibilizadas. A sessão continuará a incluir mídia recém-ingerida até que a sessão expire ou até o horário de término especificado, o que ocorrer primeiro. Esse modo é útil para poder iniciar a reprodução a partir da detecção de um evento e continuar transmitindo ao vivo a mídia que ainda não foi ingerida no momento da criação da sessão. Determine uma data e hora de início. Neste exemplo, usamos o formato de **hora em segundos do Unix Epoch**. Consulte a seção Carimbos de [data e hora no Guia do AWS Command Line Interface usuário para obter mais informações sobre a formatação de carimbos](https://docs.aws.amazon.com//cli/latest/userguide/cli-usage-parameters-types.html#parameter-type-timestamp) de data e hora. Consulte [UnixTime.org](https://unixtime.org/) para ver uma ferramenta de conversão. + **1708471800** é igual a **20 de fevereiro de 2024 3:30:00 PM** GMT- 08:00 Neste exemplo, não especificamos uma data e hora de término, o que significa que a sessão continuará a incluir mídia recém-ingerida até que a sessão expire. Invoque a `GetHLSStreamingSessionURL` API com o modo de `LIVE_REPLAY` reprodução e um seletor de [fragmentos HLS especificado](https://docs.aws.amazon.com//kinesisvideostreams/latest/dg/API_reader_GetHLSStreamingSessionURL.html#KinesisVideo-reader_GetHLSStreamingSessionURL-request-HLSFragmentSelector). ``` aws kinesis-video-archived-media get-hls-streaming-session-url \ --endpoint-url https://b-1234abcd.kinesisvideo.aws-region.amazonaws.com \ --stream-name YourStreamName \ --playback-mode LIVE_REPLAY \ --hls-fragment-selector \ "FragmentSelectorType=SERVER_TIMESTAMP,TimestampRange={StartTimestamp=1708471800}" ``` ------ #### [ On-demand ] Para reprodução sob demanda, a playlist de mídia HLS contém a mídia especificada pelo seletor de fragmentos HLS. Quando esse tipo de sessão é reproduzido em um reprodutor de mídia, a interface do usuário normalmente exibe um controle de depuração para escolher a posição na janela de reprodução a ser exibida. Para criar um URL para uma determinada seção do stream, primeiro determine os carimbos de data e hora de início e término. Neste exemplo, usamos o formato de **hora em segundos do Unix Epoch**. Consulte a seção Carimbos de [data e hora no Guia do AWS Command Line Interface usuário para obter mais informações sobre a formatação de carimbos](https://docs.aws.amazon.com//cli/latest/userguide/cli-usage-parameters-types.html#parameter-type-timestamp) de data e hora. Consulte [UnixTime.org](https://unixtime.org/) para ver uma ferramenta de conversão. + **1708471800** é igual a **20 de fevereiro de 2024 3:30:00 PM** GMT- 08:00 + **1708471860** é igual a **20 de fevereiro de 2024 3:31:00 PM** GMT- 08:00 Invoque a `GetHLSStreamingSessionURL` API com o modo de `ON_DEMAND` reprodução e um seletor de [fragmentos HLS especificado](https://docs.aws.amazon.com//kinesisvideostreams/latest/dg/API_reader_GetHLSStreamingSessionURL.html#KinesisVideo-reader_GetHLSStreamingSessionURL-request-HLSFragmentSelector). ``` aws kinesis-video-archived-media get-hls-streaming-session-url \ --endpoint-url https://b-1234abcd.kinesisvideo.aws-region.amazonaws.com \ --stream-name YourStreamName \ --playback-mode ON_DEMAND \ --hls-fragment-selector \ "FragmentSelectorType=SERVER_TIMESTAMP,TimestampRange={StartTimestamp=1708471800,EndTimestamp=1708471860}" ``` **nota** Os carimbos de data/hora devem estar dentro de 24 horas um do outro, conforme mencionado na documentação. [HLSTimestampRange](API_reader_HLSTimestampRange.md) ------ Você receberá uma resposta parecida com esta: ``` { "HLSStreamingSessionURL": "https://b-1234abcd.kinesisvideo.aws-region.amazonaws.com/hls/v1/getHLSMasterPlaylist.m3u8?SessionToken=CiAz...DkRE6M~" } ``` **Importante** Não compartilhe nem armazene esse token onde uma entidade não autorizada possa acessá-lo. O token fornece acesso ao conteúdo do stream. Proteja o token com as mesmas medidas que você usaria com suas AWS credenciais. Você pode usar esse URL e qualquer player do HLS para ver o stream do HLS. Por exemplo, use o media player VLC. Você também pode reproduzir o HLS Stream inserindo o URL da sessão de streaming HLS na barra de localização dos navegadores Apple Safari ou Microsoft Edge. ## Exemplo: Use HLS em HTML e JavaScript O exemplo a seguir mostra como usar o AWS SDK para JavaScript v2 para recuperar uma sessão de streaming HLS para um stream de vídeo do Kinesis e reproduzi-la em uma página da web. O exemplo mostra como reproduzir vídeo nos seguintes players: + [Video.js](https://github.com/videojs/video.js/) + [Google Shaka Player](https://github.com/google/shaka-player) + [hls.js](https://github.com/video-dev/hls.js/) Veja o [código de exemplo completo](https://github.com/aws-samples/amazon-kinesis-video-streams-media-viewer) e a [página da web hospedada](https://aws-samples.github.io/amazon-kinesis-video-streams-media-viewer/) em GitHub. Essa página da web estática simplifica o teste e a experimentação com a saída HLS e MPEG-DASH do stream de vídeo do Amazon Kinesis. A página de exemplo fornece campos de entrada para os seguintes parâmetros: + Região da AWS: A região em que seu stream de vídeo do Kinesis está localizado + Nome do stream: o nome do seu stream de vídeo do Kinesis + Modo de reprodução: o modo de reprodução HLS (LIVE, LIVE\$1REPLAY ou ON\$1DEMAND) + Tipo de seletor de fragmentos: o método usado para selecionar fragmentos (SERVER\$1TIMESTAMP ou PRODUCER\$1TIMESTAMP) + Número do fragmento: o número do fragmento inicial (quando aplicável) + Formato do contêiner: o formato do contêiner de mídia (FRAGMENTED\$1 ou MP4 MPEG\$1TS) O aplicativo recupera esses valores das caixas de entrada na página HTML e os usa para criar a solicitação de uma sessão de streaming HLS que é exibida na página. **Topics** + [Importe o AWS SDK JavaScript para navegadores](#how-hls-ex1-import) + [Configurar o cliente Kinesis Video Streams](#how-hls-ex1-setup) + [Recupere o endpoint para reprodução HLS](#how-hls-ex1-endpoint) + [Configurar o cliente de mídia arquivada Kinesis Video Streams](#how-hls-ex1-session) + [Recupere o URL da sessão de streaming do HLS](#how-hls-ex1-retrieve-url) + [Exibir o fluxo HLS na página da web](#how-hls-ex1-display) ### Importe o AWS SDK JavaScript para navegadores Na página da web, inclua a seguinte tag de script para importar o AWS SDK para JavaScript v2 no projeto. ``` ``` Para obter mais informações, consulte o [AWS SDK para obter](https://docs.aws.amazon.com//sdk-for-javascript/v2/developer-guide/loading-the-jssdk.html) a JavaScript documentação. ### Configurar o cliente Kinesis Video Streams Para acessar o streaming de vídeo com o HLS, primeiro crie e configure o cliente Kinesis Video Streams. Consulte [Definindo credenciais em um navegador da Web](https://docs.aws.amazon.com//sdk-for-javascript/v2/developer-guide/setting-credentials-browser.html) para ver outros métodos de autenticação. ``` const clientConfig = { accessKeyId: 'YourAccessKey', secretAccessKey: 'YourSecretKey', region: 'us-west-2' }; const kinesisVideoClient = new AWS.KinesisVideo(clientConfig); ``` O aplicativo recupera os valores necessários das caixas de entrada na página HTML. ### Recupere o endpoint para reprodução HLS Use o cliente Kinesis Video Streams para [GetDataEndpoint](API_GetDataEndpoint.md) invocar a API para recuperar o endpoint. ``` const getDataEndpointOptions = { StreamName: 'YourStreamName', APIName: 'GET_HLS_STREAMING_SESSION_URL' }; const getDataEndpointResponse = await kinesisVideoClient .getDataEndpoint(getDataEndpointOptions) .promise(); const hlsDataEndpoint = getDataEndpointResponse.DataEndpoint; ``` Esse código armazena o endpoint na `hlsDataEndpoint` variável. ### Configurar o cliente de mídia arquivada Kinesis Video Streams Na configuração do cliente de mídia arquivada do Kinesis Video Streams, especifique o endpoint que você obteve na etapa anterior. ``` const archivedMediaClientConfig = { accessKeyId: 'YourAccessKey', secretAccessKey: 'YourSecretKey', region: 'us-west-2', endpoint: hlsDataEndpoint }; const kinesisVideoArchivedMediaClient = new AWS.KinesisVideoArchivedMedia(archivedMediaClientConfig); ``` ### Recupere o URL da sessão de streaming do HLS Use o cliente de mídia arquivada Kinesis Video Streams para [GetHLSStreamingSessionURL](API_reader_GetHLSStreamingSessionURL.md) invocar a API e recuperar o URL de reprodução do HLS. ``` const getHLSStreamingSessionURLOptions = { StreamName: 'YourStreamName', PlaybackMode: 'LIVE' }; const getHLSStreamingSessionURLResponse = await kinesisVideoArchivedMediaClient .getHLSStreamingSessionURL(getHLSStreamingSessionURLOptions) .promise(); const hlsUrl = getHLSStreamingSessionURLResponse.HLSStreamingSessionURL; ``` ### Exibir o fluxo HLS na página da web Quando tiver a URL da sessão de streaming HLS, forneça-a para o player de vídeo. O método para fornecer a URL ao player de vídeo é específico ao player usado. ------ #### [ Video.js ] Faça o seguinte para importar o [Video.js](https://github.com/videojs/video.js/) e suas classes CSS para o script do nosso navegador: ``` ``` Crie um elemento `video` HTML para exibir o vídeo: ``` ``` Defina o URL do HLS como a fonte do elemento de vídeo HTML: ``` const playerElement = document.getElementById('videojs'); const player = videojs(playerElement); player.src({ src: hlsUrl, type: 'application/x-mpegURL' }); player.play(); ``` ------ #### [ Shaka ] Faça o seguinte para importar o [player Google Shaka](https://github.com/shaka-project/shaka-player) para o script do nosso navegador: ``` ``` Crie um elemento `video` HTML para exibir o vídeo: ``` ``` Crie um player Shaka especificando o elemento de vídeo e chame o método load: ``` const playerElement = document.getElementById('shaka'); const player = new shaka.Player(playerElement); player.load(hlsUrl); ``` ------ #### [ hls.js ] Faça o seguinte para importar o [hls.js para o](https://github.com/video-dev/hls.js/) script do nosso navegador: ``` ``` Crie um elemento `video` HTML para exibir o vídeo: ``` ``` Crie um player hls.js, forneça a URL do HLS e peça para ele jogar: ``` const playerElement = document.getElementById('hlsjs'); const player = new Hls(); player.loadSource(hlsUrl); player.attachMedia(playerElement); player.on(Hls.Events.MANIFEST_PARSED, function() { video.play(); }); ``` ------ ## Solução de problemas de HLS Esta seção descreve problemas que você pode encontrar ao usar HTTP Live Streaming (HLS) com o Kinesis Video Streams. **Topics** + [A recuperação do URL da sessão de streaming HLS foi bem-sucedida, mas a reprodução no player de vídeo apresentou falha](#troubleshooting-hls-playback) + [Latência muito alta entre o produtor e o player](#troubleshooting-hls-latency) ### A recuperação do URL da sessão de streaming HLS foi bem-sucedida, mas a reprodução no player de vídeo apresentou falha Essa situação ocorre quando o URL de uma sessão de streaming HLS pode ser recuperada com êxito usando `GetHLSStreamingSessionURL`, mas a reprodução do vídeo falha quando o URL é fornecido a um player de vídeo. Para solucionar essa situação, tente o seguinte: + Determine se o stream de vídeo é reproduzido no console do Kinesis Video Streams. Considere qualquer erro que o console mostra. + Se a duração de fragmento for menor que um segundo, aumente-a para um segundo. Se a duração do fragmento for muito curta, o serviço poderá restringir o player porque ele está fazendo solicitações de fragmentos de vídeo com muita frequência. + Verifique se a URL de cada sessão de streaming HLS está sendo usada por apenas um player. Se mais de um player estiver usando um único URL de sessão de streaming HLS, o serviço poderá receber muitas solicitações e limitá-las. + Verifique se o player é compatível com todas as opções que você está especificando para a sessão de streaming do HLS. Experimente diferentes combinações de valores para os seguintes parâmetros: + `ContainerFormat` + `PlaybackMode` + `FragmentSelectorType` + `DiscontinuityMode` + `MaxMediaPlaylistFragmentResults` Alguns reprodutores de mídia (reprodutores similares HTML5 e móveis) normalmente suportam apenas HLS com o formato de MP4 contêiner f. Outros reprodutores de mídia (como Flash e reprodutores personalizados) podem suportar apenas HLS com o formato de contêiner MPEG TS. Recomendamos experimentar o `ContainerFormat` parâmetro para iniciar a solução de problemas. + Verifique se cada fragmento tem um número consistente de trilhas. Verifique se os fragmentos no stream não estão mudando entre ter uma faixa de áudio e vídeo e somente uma faixa de vídeo. Verifique também se as configurações do codificador (resolução e taxa de quadros) não estão mudando entre os fragmentos em cada faixa. ### Latência muito alta entre o produtor e o player Essa situação ocorre quando a latência é muito alta em relação a quando o vídeo é capturado e quando é reproduzido no player de vídeo. O vídeo é reproduzido por meio de HLS por fragmento. Portanto, a latência não pode ser menor que a duração do fragmento. A latência também inclui o tempo necessário para o armazenamento em buffer e a transferência de dados. Se a sua solução exigir latência menor que um segundo, considere usar a API `GetMedia`. É possível ajustar os parâmetros a seguir para reduzir a latência geral, mas o ajuste desses parâmetros também pode reduzir a qualidade do vídeo ou aumentar a taxa de rearmazenamento em buffer. + Duração do **fragmento — A duração** do fragmento é a quantidade de vídeo entre as divisões no stream, controlada pela frequência dos quadros-chave gerados pelo codificador de vídeo. O valor recomendado é um segundo. Ter uma duração de fragmento mais curta significa que menos tempo é gasto aguardando que o fragmento seja concluído para transmitir os dados do vídeo para o serviço. Fragmentos mais curtos também são mais rápidos para o serviço processar. No entanto, se a duração de fragmento for muito curta, aumentará a probabilidade do player não ter conteúdo suficiente e precisar interromper e armazenar o conteúdo em buffer. Se a duração de fragmento for inferior a 500 milissegundos, o produtor poderá criar muitas solicitações, fazendo com que o serviço as limite. + **Taxa de bits** — Um stream de vídeo com uma taxa de bits mais baixa leva menos tempo para ler, gravar e transmitir. No entanto, um streaming de vídeo com uma taxa de bits menor tem menor qualidade de vídeo. + **Contagem de fragmentos em playlists de mídia** — Um player sensível à latência só deve carregar os fragmentos mais recentes em uma playlist de mídia. Em vez disso, a maioria dos jogadores começa com o fragmento mais antigo. Ao reduzir o número de fragmentos na playlist, você reduz o tempo de separação entre o fragmento anterior e o novo. Com um tamanho de playlist menor, é possível que um fragmento seja ignorado durante a reprodução se houver um atraso na adição de novos fragmentos à playlist ou se houver um atraso no player em obter uma playlist atualizada. Recomendamos usar de 3 a 5 fragmentos e usar um player configurado para carregar somente os fragmentos mais recentes de uma playlist. + **Tamanho do buffer do player** — A maioria dos reprodutores de vídeo tem uma duração mínima configurável do buffer, geralmente com um padrão de 10 segundos. Para a latência mais baixa, o valor pode ser definido como 0 segundos. No entanto, isso significa que o player rebuffere se houver algum atraso na produção de fragmentos, pois o player não terá buffer para absorver o atraso. + **Player “catch up”** — Os reprodutores de vídeo normalmente não capturam automaticamente a reprodução até a frente do buffer de vídeo se o buffer estiver cheio, como quando um fragmento atrasado causa a reprodução de um acúmulo de fragmentos. Um player personalizado pode evitar isso descartando quadros ou aumentando a velocidade de reprodução (por exemplo para 1.1x) para alcançar a frente do buffer. Isso faz com que a reprodução fique instável ou que a velocidade aumente conforme o player faz a correção, e o rearmazenamento em buffer pode ser mais frequente como o tamanho do buffer permanece curto.