Terjemahan disediakan oleh mesin penerjemah. Jika konten terjemahan yang diberikan bertentangan dengan versi bahasa Inggris aslinya, utamakan versi bahasa Inggris.
# Amazon 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](https://github.com/awslabs/amazon-kinesis-video-streams-webrtc-sdk-js)
**Topics**
+ [Instal SDK](#install-sdk-js)
+ [WebRTC SDK dokumentasi JavaScript](#docs-sdk-js)
+ [Gunakan aplikasi sampel](#build-sdk-js)
+ [Edit aplikasi sampel](#run-sdk-js)
## Instal SDK
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.](https://www.npmjs.com/)
Paket ini di-host di [https://www.npmjs.com/package/amazon-kinesis-video-streams-webrtc](https://www.npmjs.com/package/amazon-kinesis-video-streams-webrtc?activeTab=readme).
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:
```
```
Setelah SDK dimuat di halaman Anda, SDK tersedia dari variabel global `KVSWebRTC` (atau`window.KVSWebRTC`).
Misalnya, `window.KVSWebRTC.SignalingClient`.
------
## WebRTC SDK dokumentasi JavaScript
[Dokumentasi untuk metode SDK ada di GitHub readme, di bawah Dokumentasi.](https://github.com/awslabs/amazon-kinesis-video-streams-webrtc-sdk-js?tab=readme-ov-file#documentation)
Di bagian [Penggunaan](https://github.com/awslabs/amazon-kinesis-video-streams-webrtc-sdk-js?tab=readme-ov-file#usage), 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 aplikasi sampel
Kinesis Video Streams dengan WebRTC juga menghosting aplikasi sampel 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 aplikasi sampel WebRTC terletak di. [GitHub](https://awslabs.github.io/amazon-kinesis-video-streams-webrtc-sdk-js/examples/index.html)
Kode untuk aplikasi sampel ada di `examples` direktori.
**Topics**
+ [Streaming peer-to-peer dari aplikasi sampel ke Konsol Manajemen AWS](#sdk-js-stream-console)
+ [Streaming peer-to-peer dari aplikasi sampel ke aplikasi sampel](#sdk-js-stream-test)
+ [Streaming peer-to-peer dengan WebRTC Ingestion dari halaman sampel ke halaman sampel](#sdk-js-stream-ingestion)
### Streaming peer-to-peer dari aplikasi sampel ke Konsol Manajemen AWS
1. Buka [Kinesis Video Streams dengan aplikasi sampel WebRTC](https://awslabs.github.io/amazon-kinesis-video-streams-webrtc-sdk-js/examples/index.html) dan lengkapi yang berikut ini:
+ AWS Region. Misalnya,`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.
+ WebRTC Tertelan dan Penyimpanan. Perluas node dan pilih salah satu dari berikut ini:
+ Pilih **Secara otomatis menentukan mode konsumsi.**
+ **Pastikan **Secara otomatis menentukan mode konsumsi** tidak dipilih dan atur penggantian manual ke OFF.**
**catatan**
**Secara otomatis menentukan mode konsumsi** memiliki aplikasi memanggil [DescribeMediaStorageConfiguration](https://docs.aws.amazon.com//kinesisvideostreams/latest/dg/API_DescribeMediaStorageConfiguration.html)API untuk menentukan mode mana yang akan dijalankan (atau konsumsi Peer-to-peer WebRTC). Panggilan API tambahan ini menambahkan sedikit waktu startup.
Jika Anda tahu sebelumnya mode mana saluran pensinyalan ini berjalan, gunakan penggantian manual untuk melewati panggilan API ini.
+ Generasi kandidat ICE. Biarkan`STUN`/`TURN`dipilih dan biarkan `Trickle ICE` diaktifkan.
1. Pilih **Mulai Master** untuk terhubung ke saluran pensinyalan.
Izinkan akses ke and/or mikrofon kamera Anda, jika diperlukan.
1. Buka konsol [Kinesis Video](https://console.aws.amazon.com//kinesisvideo/home/) Streams di. Konsol Manajemen AWS
Pastikan wilayah yang benar dipilih.
1. Di navigasi kiri, pilih **[saluran pensinyalan](https://console.aws.amazon.com//kinesisvideo/home#/signalingChannels/)**.
Pilih nama saluran pensinyalan di atas. Gunakan bilah pencarian, jika perlu.
1. Perluas bagian **Penampil pemutaran media**.
1. Pilih tombol **putar** pada pemutar video. Ini bergabung dengan sesi WebRTC sebagai. `viewer`
Media yang sedang dikirim pada halaman demo harus ditampilkan di Konsol Manajemen AWS.
### Streaming peer-to-peer dari aplikasi sampel ke aplikasi sampel
1. Buka [Kinesis Video Streams dengan aplikasi sampel WebRTC](https://awslabs.github.io/amazon-kinesis-video-streams-webrtc-sdk-js/examples/index.html) dan lengkapi informasi berikut:
+ AWS Region. Misalnya,`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.
+ WebRTC Tertelan dan Penyimpanan. Perluas node dan pilih salah satu dari berikut ini:
+ Pilih **Secara otomatis menentukan mode konsumsi.**
+ **Pastikan **Secara otomatis menentukan mode konsumsi** tidak dipilih dan atur penggantian manual ke OFF.**
**catatan**
**Secara otomatis menentukan mode konsumsi** memiliki aplikasi memanggil [DescribeMediaStorageConfiguration](https://docs.aws.amazon.com//kinesisvideostreams/latest/dg/API_DescribeMediaStorageConfiguration.html)API untuk menentukan mode mana yang akan dijalankan (atau konsumsi Peer-to-peer WebRTC). Panggilan API tambahan ini menambahkan sedikit waktu startup.
Jika Anda tahu sebelumnya mode mana saluran pensinyalan ini berjalan, gunakan penggantian manual untuk melewati panggilan API ini.
+ Generasi kandidat ICE. Biarkan`STUN`/`TURN`dipilih dan biarkan `Trickle ICE` diaktifkan.
1. Pilih **Mulai Master** untuk terhubung ke saluran pensinyalan sebagai `master` peran.
Izinkan akses ke and/or mikrofon kamera Anda, jika diperlukan.
1. Buka tab browser lain dan buka [Kinesis Video Streams dengan aplikasi contoh WebRTC](https://awslabs.github.io/amazon-kinesis-video-streams-webrtc-sdk-js/examples/index.html). Semua informasi dari proses sebelumnya harus dimuat.
1. Gulir ke bawah dan pilih **Mulai Penampil** untuk terhubung ke saluran pensinyalan sebagai `viewer` peran.
Anda harus melihat media dipertukarkan antara `master` dan`viewer`.
### Streaming peer-to-peer dengan WebRTC Ingestion dari halaman sampel ke halaman sampel
1. Ikuti [Menelan media dari browser](ingest-media.md#ingest-browser) untuk menghubungkan peserta utama dan pastikan itu terhubung ke sesi penyimpanan.
1. Ikuti [Tambahkan pemirsa ke sesi konsumsi](ingest-media.md#ingest-add-viewers) untuk menambahkan peserta pemirsa.
Peserta pemirsa akan terhubung dan menerima media dari sesi penyimpanan. Mereka dapat mengirim audio opsional kembali ke sesi penyimpanan.
Sesi penyimpanan menangani pencampuran media yang diterima dari peserta master dan pemirsa dan mengirimkannya ke tujuan yang sesuai.
1. Anda dapat melihat dan menggunakan media yang dicerna melalui pemutaran [Kinesis Video Streams](https://docs.aws.amazon.com//kinesisvideostreams/latest/dg/how-playback.html).
## Edit aplikasi sampel
Untuk mengedit SDK dan contoh aplikasi 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](https://nodejs.org/en/download).
**Edit aplikasi sampel**
1. Unduh Kinesis Video Streams dengan JavaScript WebRTC SDK di.
Ketik berikut ini di terminal:
```
git clone https://github.com/awslabs/amazon-kinesis-video-streams-webrtc-sdk-js.git
```
1. Arahkan ke direktori dengan file package.json. File ini terletak di direktori root repositori.
Ketik berikut ini di terminal:
```
cd amazon-kinesis-video-streams-webrtc-sdk-js
```
1. Instal dependensi.
Ketik perintah [CLI npm](https://docs.npmjs.com/cli/v10/commands) berikut di terminal:
```
npm install
```
1. Mulai server web untuk mulai melayani halaman web.
Ketik perintah [CLI npm](https://docs.npmjs.com/cli/v10/commands) berikut di terminal:
```
npm run develop
```
1. Di browser Anda, kunjungi [http://localhost:3001/](http://localhost:3001/).
Anda dapat melakukan pengeditan ke halaman web dengan mengedit file di `examples` direktori.