Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

เปิดกล้องหลัง (Rear Camera) ด้วย HTML5 getUserMedia

ใช้ MediaStreamTrack.getSources() เลือกกล้อง (Deprecated)

API เก่า: MediaStreamTrack.getSources() หา sourceId ของกล้องหลัง

API ใหม่: navigator.mediaDevices.enumerateDevices()

navigator.mediaDevices.enumerateDevices()
    .then(devices => {
        var videoDevices = devices.filter(d => d.kind === 'videoinput');
        var rearCamera = videoDevices.find(d => d.label.includes('back') || d.label.includes('rear'));
        var constraints = {
            video: { deviceId: rearCamera ? { exact: rearCamera.deviceId } : undefined }
        };
        return navigator.mediaDevices.getUserMedia(constraints);
    })
    .then(stream => {
        video.srcObject = stream;
    });

facingMode: 'environment' (กล้องหลัง) / 'user' (กล้องหน้า) ใช้ง่ายกว่า:

navigator.mediaDevices.getUserMedia({ video: { facingMode: 'environment' } })
    .then(stream => { video.srcObject = stream; });