Batasan dan pengambilan media

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.