Batasan dan pengambilan media

Bagian media WebRTC membahas cara mengakses hardware yang dapat merekam video dan audio, seperti kamera dan mikrofon, serta cara kerja streaming media. Bagian ini juga mencakup media tampilan, yaitu cara aplikasi dapat melakukan perekaman 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 mikrofon terhubung melalui USB dan dapat terhubung serta 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 kamera dan mikrofon default dapat dibuka dengan batasan sederhana, hal ini dapat menghasilkan aliran media yang jauh dari yang paling optimal untuk aplikasi.

Batasan spesifik ditentukan dalam objek MediaTrackConstraint, satu untuk audio dan satu untuk video. Atribut dalam objek ini berjenis 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 media yang cocok persis dengan batasan tersebut yang akan ditampilkan.

// Camera with a resolution as close to 640x480 as possible
{
    "video": {
        "width": 640,
        "height": 480
    }
}

// Camera with a resolution in the range 640x480 to 1024x768
{
    "video": {
        "width": {
            "min": 640,
            "max": 1024
        },
        "height": {
            "min": 480,
            "max": 768
        }
    }
}

// Camera with the exact resolution of 1024x768
{
    "video": {
        "width": {
            "exact": 1024
        },
        "height": {
            "exact": 768
        }
    }
}

Untuk menentukan konfigurasi sebenarnya yang dimiliki jalur tertentu dari aliran media, kita dapat memanggil MediaStreamTrack.getSettings() yang menampilkan MediaTrackSettings yang saat ini diterapkan.

Anda juga dapat memperbarui batasan trek dari perangkat media yang telah dibuka, dengan memanggil applyConstraints() di trek. Hal ini memungkinkan aplikasi mengonfigurasi ulang perangkat media tanpa harus menutup streaming yang ada terlebih dahulu.

Menampilkan media

Aplikasi yang ingin dapat melakukan pengambilan 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 sebagiannya, seperti jendela). MediaStream yang ditampilkan berfungsi sama seperti saat menggunakan getUserMedia().

Batasan untuk getDisplayMedia() berbeda dengan batasan yang digunakan untuk input video atau audio biasa.

{
    video: {
        cursor: 'always' | 'motion' | 'never',
        displaySurface: 'application' | 'browser' | 'monitor' | 'window'
    }
}

Cuplikan kode di atas menunjukkan cara kerja batasan khusus untuk perekaman layar. Perhatikan bahwa fitur ini mungkin tidak didukung oleh semua browser yang memiliki dukungan media tampilan.

Aliran dan jalur

MediaStream merepresentasikan aliran 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.

MediaStreamTrack

MediaStreamTrack memiliki properti kind yang berupa audio atau video, yang menunjukkan jenis media yang diwakilinya. Setiap jalur dapat diredam dengan mengganti properti enabled-nya. Trek memiliki properti Boolean remote yang menunjukkan apakah trek tersebut bersumber dari RTCPeerConnection dan berasal dari peer jarak jauh.