Потоковое видео с AWS Kinesis на клиент JS - PullRequest
Новая
       18

Потоковое видео с AWS Kinesis на клиент JS

0 голосов
/ 01 июля 2019

Я пытаюсь использовать видео из потока AWS Kinesis.Поток виден в консоли AWS, но я не могу использовать его в приложении JS, которое пытаюсь создать.

Я следовал этому учебнику, но не могу получить потоковую передачуURL.

Мой код здесь: 

import React, { Component} from 'react'
import ReactPlayer from 'react-player'
import AWS from "aws-sdk";
import { STREAM_NAME, ACCESS_KEY_ID, SECRET_ACCESS_KEY, REGION } from '../secrets'

var streamName = STREAM_NAME;

// Step 1: Configure SDK Clients
var options = {
    accessKeyId: ACCESS_KEY_ID,
    secretAccessKey: SECRET_ACCESS_KEY,
    region: REGION
}
var kinesisVideo = new AWS.KinesisVideo(options);
var kinesisVideoArchivedContent = new AWS.KinesisVideoArchivedMedia(options);

// Step 2: Get a data endpoint for the stream
kinesisVideo.getDataEndpoint({
    StreamName: streamName,
    APIName: "GET_HLS_STREAMING_SESSION_URL"
}, function(err, response) {
    if (err) { return console.error(err); }
    console.log('Data endpoint: ' + response.DataEndpoint);
    kinesisVideoArchivedContent.endpoint = new AWS.Endpoint(response.DataEndpoint);
});

// Step 3: Get an HLS Streaming Session URL
console.log('Fetching HLS Streaming Session URL');
var playbackMode = 'LIVE'; // 'LIVE' or 'ON_DEMAND'
//var startTimestamp = new Date('START_TIMESTAMP'); // For ON_DEMAND only
//var endTimestamp = new Date('END_TIMESTAMP'); // For ON_DEMAND only
var fragmentSelectorType = 'SERVER_TIMESTAMP'; // 'SERVER_TIMESTAMP' or 'PRODUCER_TIMESTAMP'
const SESSION_EXPIRATION_SECONDS = 60*60
console.log(kinesisVideo)
const hlsUrl = kinesisVideoArchivedContent.getHLSStreamingSessionURL({
    StreamName: streamName,
    //StreamARN: "arn:aws:kinesisvideo:us-east-1:635420739373:stream/mr-pinchers-dot-org/1561848963391",
    PlaybackMode: playbackMode,
    HLSFragmentSelector: {
        FragmentSelectorType: fragmentSelectorType,
        TimestampRange: playbackMode === 'LIVE' ? undefined : {
//            StartTimestamp: startTimestamp,
//            EndTimestamp: endTimestamp
        }
    },
    Expires: parseInt(SESSION_EXPIRATION_SECONDS)
}, function(err, response) {
    if (err) { return console.error("Darn", err); }
    console.log('HLS Streaming Session URL: ' + response.HLSStreamingSessionURL, response);
  }
)

console.log("here", hlsUrl)

class Home extends Component {
  render () {
    return <ReactPlayer url={hlsUrl} playing={true} />
  }
}

export default Home

Ответ, полученный на шаге 3 (response.HLSStreamingSessionURL), не определен.

Шаг 2 работает нормально,и я возвращаю конечную точку, так что я уверен, что это не проблема с разрешениями.

Часть меня думает, что я должен использовать некоторые асинхронные / ожидающие вызовы, но я не уверен, все еще довольно плохо знаком сJS и все эти асинхронные вещи не знали, как включить это в это.

Я потратил довольно много времени, пытаясь выяснить это, но документация по Kinesis все еще довольно легкая, хотя еслиу кого-то есть хороший ресурс для этого, пожалуйста, дайте мне знать.

1 Ответ

0 голосов
/ 01 июля 2019

Это базовое асинхронное поведение JavaScript. Вы выполняете шаг 3 до завершения шага 2. Вы не можете использовать ответ, пока он не произошел.

Это можно исправить, запустив шаг 3 после завершения шага 2 следующим образом: 

kinesisVideo.getDataEndpoint({
    StreamName: streamName,
    APIName: "GET_HLS_STREAMING_SESSION_URL"
}, function(err, response) {
    if (err) { return console.error(err); }
    console.log('Data endpoint: ' + response.DataEndpoint);
    kinesisVideoArchivedContent.endpoint = new AWS.Endpoint(response.DataEndpoint);

    var playbackMode = 'LIVE';
    var fragmentSelectorType = 'SERVER_TIMESTAMP';
    const SESSION_EXPIRATION_SECONDS = 60*60

    kinesisVideoArchivedContent.getHLSStreamingSessionURL({...});
    // remainder of code here
});

Или вы можете использовать async / await и обещать варианты методов AWS SDK следующим образом: 

(async () => {
    const kv_response = await kv.getDataEndpoint({...}).promise();
    // ...
    const hls_response = await kvac.getHLSStreamingSessionURL({...}).promise();
})();

Обратите внимание, что await может использоваться только внутри функции async, следовательно, анонимная асинхронная оболочка.

...