Kinesis Video Streams dengan WebRTC JavaScript SDK untuk aplikasi web - Kinesis Video Streams

Terjemahan disediakan oleh mesin penerjemah. Jika konten terjemahan yang diberikan bertentangan dengan versi bahasa Inggris aslinya, utamakan versi bahasa Inggris.

Kinesis Video Streams dengan WebRTC JavaScript SDK untuk aplikasi web

Anda dapat menemukan Kinesis Video Streams dengan JavaScript WebRTC SDK untuk aplikasi web dan sampel yang sesuai di. GitHub

Instal Kinesis Video Streams dengan WebRTC SDK di JavaScript

Apakah dan bagaimana Anda menginstal Kinesis Video Streams dengan JavaScript WebRTC SDK tergantung pada apakah kode dijalankan dalam modul atau skrip browser. Node.js

NodeJS module

Cara yang lebih disukai untuk menginstal Kinesis Video Streams dengan JavaScript WebRTC SDK untuk Node.js adalah dengan menggunakan npm, pengelola paket Node.js.

Paket ini di-host di https://www.npmjs.com/package/ amazon-kinesis-video-streams -webrtc.

Untuk menginstal SDK ini di Node.js project Anda, gunakan terminal untuk menavigasi ke direktori yang sama dengan project Anda: package.json

Ketik berikut ini:

npm install amazon-kinesis-video-streams-webrtc

Anda dapat mengimpor kelas SDK seperti modul Node.js biasa:

// JavaScript const SignalingClient = require('amazon-kinesis-video-streams-webrtc').SignalingClient; // TypeScript import { SignalingClient } from 'amazon-kinesis-video-streams-webrtc';
Browser

Anda tidak perlu menginstal SDK untuk menggunakannya dalam skrip browser. Anda dapat memuat paket SDK yang dihosting langsung AWS dengan skrip di halaman HTML Anda.

Untuk menggunakan SDK di browser, tambahkan elemen skrip berikut ke halaman HTML Anda:

<script src="https://unpkg.com/amazon-kinesis-video-streams-webrtc/dist/kvs-webrtc.min.js"></script>

Setelah SDK dimuat di halaman Anda, SDK tersedia dari variabel global KVSWebRTC (atauwindow.KVSWebRTC).

Misalnya, window.KVSWebRTC.SignalingClient.

Kinesis Video Streams JavaScript dengan dokumentasi WebRTC SDK

Dokumentasi untuk metode SDK ada di GitHub readme, di bawah Dokumentasi.

Di bagian Penggunaan, ada informasi tambahan untuk mengintegrasikan SDK ini bersama dengan AWS SDK JavaScript untuk membangun aplikasi penampil berbasis web.

Lihat examples direktori untuk contoh aplikasi lengkap, termasuk peran master dan penampil.

Gunakan Kinesis Video Streams dengan halaman uji WebRTC

Kinesis Video Streams dengan WebRTC juga menghosting halaman uji yang dapat Anda gunakan untuk membuat saluran pensinyalan baru atau terhubung ke saluran yang ada dan menggunakannya sebagai master atau penampil.

Kinesis Video Streams dengan halaman uji WebRTC terletak di https://awslabs.github.io/ - /examples/index.html. amazon-kinesis-video-streams webrtc-sdk-js

Kode untuk halaman uji ada di examples direktori.

Streaming dari halaman pengujian ke AWS Management Console

  1. Buka Kinesis Video Streams dengan halaman uji WebRTC dan lengkapi yang berikut ini:

    • Wilayah AWS. Sebagai contoh,us-west-2.

    • Kunci AWS akses dan kunci rahasia untuk pengguna atau peran IAM Anda. Biarkan token sesi kosong jika Anda menggunakan AWS kredensi jangka panjang.

    • Nama saluran pensinyalan yang ingin Anda sambungkan.

      Jika Anda ingin terhubung ke saluran pensinyalan baru, pilih Buat Saluran untuk membuat saluran pensinyalan dengan nilai yang disediakan di kotak.

      catatan

      Nama saluran pensinyalan Anda harus unik untuk akun dan wilayah saat ini. Anda dapat menggunakan huruf, angka, garis bawah (_), dan tanda hubung (-), tetapi bukan spasi.

    • Apakah Anda ingin mengirim audio, video, atau keduanya.

    • Generasi kandidat ICE. BiarkanSTUN/TURNdipilih dan biarkan Trickle ICE diaktifkan.

  2. Pilih Mulai Master untuk terhubung ke saluran pensinyalan.

    Izinkan akses ke kamera dan/atau mikrofon Anda, jika diperlukan.

  3. Buka konsol Kinesis Video Streams di. AWS Management Console

    Pastikan wilayah yang benar dipilih.

  4. Di navigasi kiri, pilih saluran pensinyalan.

    Pilih nama saluran pensinyalan di atas. Gunakan bilah pencarian, jika perlu.

  5. Perluas bagian Penampil pemutaran media.

  6. Pilih tombol putar pada pemutar video. Ini bergabung dengan sesi WebRTC sebagai. viewer

    Media yang sedang dikirim pada halaman demo harus ditampilkan di AWS Management Console.

Streaming dari halaman pengujian ke halaman pengujian

  1. Buka Kinesis Video Streams dengan halaman uji WebRTC dan lengkapi informasi berikut:

    • Wilayah AWS. Sebagai contoh,us-west-2.

    • Kunci AWS akses dan kunci rahasia untuk pengguna atau peran IAM Anda. Biarkan token sesi kosong jika Anda menggunakan AWS kredensi jangka panjang.

    • Nama saluran pensinyalan yang ingin Anda sambungkan.

      Jika Anda ingin terhubung ke saluran pensinyalan baru, pilih Buat Saluran untuk membuat saluran pensinyalan dengan nilai yang disediakan di kotak.

      catatan

      Nama saluran pensinyalan Anda harus unik untuk akun dan wilayah saat ini. Anda dapat menggunakan huruf, angka, garis bawah (_), dan tanda hubung (-), tetapi bukan spasi.

    • Apakah Anda ingin mengirim audio, video, atau keduanya.

    • Generasi kandidat ICE. BiarkanSTUN/TURNdipilih dan biarkan Trickle ICE diaktifkan.

  2. Pilih Mulai Master untuk terhubung ke saluran pensinyalan sebagai master peran.

    Izinkan akses ke kamera dan/atau mikrofon Anda, jika diperlukan.

  3. Buka tab browser lain dan buka Kinesis Video Streams dengan halaman uji WebRTC. Semua informasi dari proses sebelumnya harus dimuat.

  4. Gulir ke bawah dan pilih Mulai Penampil untuk terhubung ke saluran pensinyalan sebagai viewer peran.

    Anda harus melihat media dipertukarkan antara master danviewer.

Edit Kinesis Video Streams dengan halaman uji WebRTC

Untuk mengedit SDK dan halaman pengujian untuk tujuan pengembangan, ikuti petunjuk di bawah ini.

Prasyarat

NodeJS versi 16+

catatan

Kami merekomendasikan mengunduh versi dukungan jangka panjang (LTS) terbaru dari https://nodejs.org/en/download.

Edit halaman pengujian
  1. Unduh Kinesis Video Streams dengan JavaScript WebRTC SDK di.

    Ketik yang berikut ini di terminal:

    git clone https://github.com/awslabs/amazon-kinesis-video-streams-webrtc-sdk-js.git
  2. Arahkan ke direktori dengan file package.json. File ini terletak di direktori root repositori.

    Ketik yang berikut ini di terminal:

    cd amazon-kinesis-video-streams-webrtc-sdk-js
  3. Instal dependensi.

    Ketik perintah CLI npm berikut di terminal:

    npm install
  4. Mulai server web untuk mulai melayani halaman web.

    Ketik perintah CLI npm berikut di terminal:

    npm run develop
  5. Di browser Anda, kunjungi http://localhost:3001/.

    Anda dapat melakukan pengeditan ke halaman web dengan mengedit file di examples direktori.