Bagian media WebRTC mencakup cara mengakses hardware yang dapat merekam video dan audio, seperti kamera dan mikrofon, serta cara kerja streaming media. Ini juga mencakup media tampilan, yang merupakan cara aplikasi dapat mengambil layar.
Perangkat Media
Semua kamera dan mikrofon yang didukung oleh browser diakses dan
dikelola melalui objek navigator.mediaDevices
. Aplikasi dapat mengambil
daftar perangkat terhubung saat ini dan juga memproses perubahan, karena banyak
kamera dan microhpone yang terhubung melalui USB serta dapat terhubung dan
terputus selama siklus proses aplikasi. Karena status perangkat media
dapat berubah kapan saja, sebaiknya aplikasi mendaftar untuk
perubahan perangkat agar dapat menangani perubahan dengan benar.
Batasan
Saat mengakses perangkat media, sebaiknya berikan batasan sedetail mungkin. Meskipun Anda dapat membuka kamera dan mikrofon default dengan batasan sederhana, streaming dan media mungkin jauh dari optimal untuk aplikasi.
Batasan spesifik ditentukan dalam objek MediaTrackConstraint
, satu untuk
audio dan satu untuk video. Atribut dalam objek ini adalah jenis ConstraintLong
, ConstraintBoolean
, ConstraintDouble
, atau ConstraintDOMString
. Ini dapat berupa nilai tertentu (misalnya, angka, boolean, atau string), rentang (LongRange
atau DoubleRange
dengan nilai minimum dan maksimum), atau objek dengan definisi ideal
atau exact
. Untuk
nilai tertentu, browser akan mencoba memilih sesuatu yang sedekat mungkin.
Untuk rentang, nilai terbaik dalam rentang tersebut akan digunakan. Jika exact
ditentukan, hanya aliran data media yang sama persis dengan batasan tersebut yang akan ditampilkan.
Dekat
// Camera with a resolution as close to 640x480 as possible
{
"video": {
"width": 640,
"height": 480
}
}
Rentang
// Camera with a resolution in the range 640x480 to 1024x768
{
"video": {
"width": {
"min": 640,
"max": 1024
},
"height": {
"min": 480,
"max": 768
}
}
}
Persis
// Camera with the exact resolution of 1024x768
{
"video": {
"width": {
"exact": 1024
},
"height": {
"exact": 768
}
}
}
Untuk menentukan konfigurasi sebenarnya yang dimiliki trek streaming media tertentu,
kita dapat memanggil MediaStreamTrack.getSettings()
yang menampilkan
MediaTrackSettings
yang saat ini diterapkan.
Anda juga dapat memperbarui batasan jalur dari perangkat media yang telah
dibuka, dengan memanggil applyConstraints()
pada jalur. Hal ini memungkinkan
aplikasi mengonfigurasi ulang perangkat media tanpa harus menutup
streaming yang ada terlebih dahulu.
Media tampilan
Aplikasi yang ingin dapat melakukan perekaman dan perekaman
layar harus menggunakan Display Media API. Fungsi getDisplayMedia()
(yang merupakan bagian
dari navigator.mediaDevices
mirip dengan getUserMedia()
dan digunakan untuk
tujuan membuka konten tampilan (atau sebagian, seperti
jendela). MediaStream
yang ditampilkan berfungsi sama seperti saat menggunakan
getUserMedia()
.
Batasan untuk getDisplayMedia()
berbeda dengan batasan yang digunakan untuk input audio atau video
reguler.
{
video: {
cursor: 'always' | 'motion' | 'never',
displaySurface: 'application' | 'browser' | 'monitor' | 'window'
}
}
Kode Chromebase di atas menunjukkan cara kerja batasan khusus untuk perekaman layar. Perhatikan bahwa ini mungkin tidak didukung oleh semua browser yang memiliki dukungan media display.
Streaming dan lagu
MediaStream
mewakili streaming konten media, yang terdiri dari trek
(MediaStreamTrack
) audio dan video. Anda dapat mengambil semua jalur dari
MediaStream
dengan memanggil MediaStream.getTracks()
, yang menampilkan array
objek MediaStreamTrack
.
MediaTrackTrack
MediaStreamTrack
memiliki properti kind
yang berupa audio
atau video
,
yang menunjukkan jenis media yang diwakilinya. Setiap jalur dapat dibisukan dengan mengalihkan properti enabled
. Lintasan memiliki properti Boolean remote
yang menunjukkan
apakah sumber tersebut berasal dari RTCPeerConnection
dan berasal dari pembanding jarak jauh.