Pemutaran video dengan MPEG - DASH

Untuk melihat aliran video Kinesis menggunakan MPEG -DASH, pertama-tama Anda membuat sesi streaming menggunakan G etDASHStreaming Session. URL Tindakan ini mengembalikan URL (berisi token sesi) untuk mengakses DASH sesi MPEG -. Anda kemudian dapat menggunakan URL dalam pemutar media atau aplikasi mandiri untuk menampilkan aliran.

Aliran video Amazon Kinesis memiliki persyaratan berikut untuk menyediakan video melalui MPEG -: DASH

• Untuk persyaratan trek pemutaran video streaming, lihatURLPersyaratan G etDASHStreaming Session.

• Retensi data harus lebih besar dari 0.

• Track video dari setiap fragmen harus berisi data pribadi codec dalam Advanced Video Coding (AVC) untuk format H.264 dan untuk format H.265. HEVC Untuk informasi lebih lanjut, lihat MPEG-4 ISO IEC spesifikasi/14496-15. Untuk informasi tentang mengadaptasi data aliran ke format tertentu, lihat Bendera NAL Adaptasi.

• Track audio (jika ada) dari setiap fragmen harus berisi data pribadi codec dalam AAC format (AACISOIECspesifikasi/13818-7) atau format MS Wave.

Contoh: Menggunakan MPEG - DASH di HTML dan JavaScript

Contoh berikut menunjukkan cara mengambil sesi MPEG - DASH streaming untuk aliran video Kinesis dan memutarnya kembali di halaman web. Contoh menunjukkan cara memutar video di pemain berikut:

• Pemain Google Shaka

• dash.js

Siapkan klien Kinesis Video Streams MPEG untuk - pemutaran DASH

Untuk mengakses streaming video dengan MPEG -DASH, pertama-tama buat dan konfigurasikan klien Kinesis Video Streams (untuk mengambil titik akhir layanan) dan klien media yang diarsipkan (untuk MPEG mengambil sesi - streaming). DASH Aplikasi mengambil nilai yang diperlukan dari kotak input pada HTML halaman.

var streamName = $('#streamName').val();

// Step 1: Configure SDK Clients
var options = {
    accessKeyId: $('#accessKeyId').val(),
    secretAccessKey: $('#secretAccessKey').val(),
    sessionToken: $('#sessionToken').val() || undefined,
    region: $('#region').val(),
    endpoint: $('#endpoint').val() || undefined
    }
var kinesisVideo = new AWS.KinesisVideo(options);
var kinesisVideoArchivedContent = new AWS.KinesisVideoArchivedMedia(options);

Ambil titik akhir konten yang diarsipkan Kinesis Video Streams untuk - pemutaran MPEG DASH

Setelah klien dimulai, ambil titik akhir konten yang diarsipkan Kinesis Video Streams sehingga Anda dapat mengambil sesi - streaming sebagai berikut: MPEG DASH URL

 // Step 2: Get a data endpoint for the stream
console.log('Fetching data endpoint');
kinesisVideo.getDataEndpoint({
    StreamName: streamName,
    APIName: "GET_DASH_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);

Ambil sesi MPEG - DASH streaming URL

Jika Anda memiliki titik akhir konten yang diarsipkan, panggil etDASHStreamingSesi G URL API untuk mengambil sesi MPEG - DASH streaming sebagai berikut: URL

// Step 3: Get a Streaming Session URL
var consoleInfo = 'Fetching ' + protocol + ' Streaming Session URL';
console.log(consoleInfo);

if (protocol === 'DASH') {
    kinesisVideoArchivedContent.getDASHStreamingSessionURL({
        StreamName: streamName,
        PlaybackMode: $('#playbackMode').val(),
        DASHFragmentSelector: {
            FragmentSelectorType: $('#fragmentSelectorType').val(),
            TimestampRange: $('#playbackMode').val() === "LIVE" ? undefined : {
                StartTimestamp: new Date($('#startTimestamp').val()),
                EndTimestamp: new Date($('#endTimestamp').val())
            }
        },
        DisplayFragmentTimestamp: $('#displayFragmentTimestamp').val(),
        DisplayFragmentNumber: $('#displayFragmentNumber').val(),
        MaxManifestFragmentResults: parseInt($('#maxResults').val()),
        Expires: parseInt($('#expires').val())
    }, function(err, response) {
        if (err) { return console.error(err); }
        console.log('DASH Streaming Session URL: ' + response.DASHStreamingSessionURL);
                

Tampilkan video streaming dengan MPEG - DASH pemutaran

Saat Anda memiliki sesi DASH streamingURL, berikan ke pemutar video. MPEG Metode untuk menyediakan URL ke pemutar video khusus untuk pemutar yang Anda gunakan.

Contoh kode berikut menunjukkan cara menyediakan sesi streaming URL ke pemutar Google Shaka:

// Step 4: Give the URL to the video player.

//Shaka Player elements 
<video id="shaka" class="player" controls autoplay></video>
<script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.4.1/shaka-player.compiled.js">
</script>
...

var playerName = $('#player').val();

if (playerName === 'Shaka Player') {
    var playerElement = $('#shaka');
    playerElement.show();

    var player = new shaka.Player(playerElement[0]);
    console.log('Created Shaka Player');

    player.load(response.DASHStreamingSessionURL).then(function() {
        console.log('Starting playback');
    });
    console.log('Set player source');
}

Contoh kode berikut menunjukkan cara menyediakan sesi streaming URL ke pemutar dash.js:

<!-- dash.js Player elements -->
<video id="dashjs" class="player" controls autoplay=""></video>
<script src="https://cdn.dashjs.org/latest/dash.all.min.js"></script>

...

var playerElement = $('#dashjs');
playerElement.show();

var player = dashjs.MediaPlayer().create();
console.log('Created DASH.js Player');

player.initialize(document.querySelector('#dashjs'), response.DASHStreamingSessionURL, true);
console.log('Starting playback');
console.log('Set player source');
}

Contoh lengkap

Anda dapat mengunduh atau melihat kode contoh lengkap pada GitHub.