Google is committed to advancing racial equity for Black communities. See how.
หน้านี้ได้รับการแปลโดย Cloud Translation API
Switch to English

การจับภาพสื่อและข้อ จำกัด

ส่วนสื่อของ WebRTC ครอบคลุมถึงวิธีการเข้าถึงฮาร์ดแวร์ที่มีความสามารถในการจับภาพวิดีโอและเสียงเช่นกล้องและไมโครโฟนรวมถึงการทำงานของสตรีมสื่อ นอกจากนี้ยังครอบคลุมสื่อที่แสดงซึ่งเป็นวิธีที่แอปพลิเคชันสามารถจับภาพหน้าจอได้

อุปกรณ์สื่อ

กล้องและไมโครโฟนทั้งหมดที่รองรับโดยเบราว์เซอร์สามารถเข้าถึงและจัดการผ่านวัตถุ navigator.mediaDevices แอปพลิเคชันสามารถดึงรายการปัจจุบันของอุปกรณ์ที่เชื่อมต่อและรับฟังการเปลี่ยนแปลงเนื่องจากกล้องและ microhpones จำนวนมากเชื่อมต่อผ่าน USB และสามารถเชื่อมต่อและตัดการเชื่อมต่อระหว่างวงจรชีวิตของแอปพลิเคชัน เนื่องจากสถานะของอุปกรณ์สื่อสามารถเปลี่ยนแปลงได้ตลอดเวลาขอแนะนำให้แอปพลิเคชันลงทะเบียนสำหรับการเปลี่ยนแปลงอุปกรณ์เพื่อให้สามารถจัดการกับการเปลี่ยนแปลงได้อย่างถูกต้อง

ข้อ จำกัด

เมื่อเข้าถึงอุปกรณ์สื่อเป็นแนวปฏิบัติที่ดีที่จะจัดเตรียมข้อ จำกัด โดยละเอียดที่สุดเท่าที่จะทำได้ แม้ว่าจะเป็นไปได้ที่จะเปิดกล้องและไมโครโฟนเริ่มต้นด้วยข้อ จำกัด ง่ายๆ แต่ก็อาจส่งกระแสข้อมูลสื่อที่ห่างไกลจากแอพพลิเคชั่นที่เหมาะสมที่สุด

ข้อ จำกัด เฉพาะถูกกำหนดไว้ในวัตถุ MediaTrackConstraint หนึ่งรายการสำหรับเสียงและอีกหนึ่งสำหรับวิดีโอ แอตทริบิวต์ในวัตถุนี้เป็นประเภท ConstraintLong , ConstraintBoolean , ConstraintDouble หรือ ConstraintDOMString สิ่งเหล่านี้อาจเป็นค่าเฉพาะ (เช่นตัวเลขบูลีนหรือสตริง) ช่วง ( LongRange หรือ DoubleRange มีค่าต่ำสุดและสูงสุด) หรือวัตถุที่มีนิยามใน ideal หรือ exact สำหรับค่าเฉพาะเบราว์เซอร์จะพยายามเลือกสิ่งที่ใกล้เคียงที่สุด สำหรับช่วงจะใช้ค่าที่ดีที่สุดในช่วงนั้น เมื่อ exact มีการระบุเพียงกระแสสื่อที่ตรงกับข้อ จำกัด ที่จะถูกส่งกลับ

ใกล้

 // 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
        }
    }
}
 

ในการพิจารณาการกำหนดค่าที่แท้จริงของแทร็กสตรีมมีเดียบางอย่างเราสามารถโทร MediaStreamTrack.getSettings() ซึ่งส่งคืน MediaTrackSettings ใช้อยู่ในปัจจุบัน

นอกจากนี้ยังเป็นไปได้ที่จะอัปเดตข้อ จำกัด ของแทร็กจากอุปกรณ์สื่อที่เราเปิดไว้โดยเรียกใช้ applyConstraints() บนแทร็ก ซึ่งช่วยให้แอปพลิเคชันกำหนดค่าอุปกรณ์สื่อใหม่โดยไม่ต้องปิดสตรีมที่มีอยู่ก่อน

แสดงสื่อ

แอปพลิเคชันที่ต้องการให้การจับภาพหน้าจอและการบันทึกต้องใช้ Display Media API ฟังก์ชัน getDisplayMedia() (ซึ่งเป็นส่วนหนึ่งของ navigator.mediaDevices คล้ายกับ getUserMedia() และใช้เพื่อจุดประสงค์ในการเปิดเนื้อหาของจอแสดงผล (หรือส่วนหนึ่งของมันเช่นหน้าต่าง) MediaStream ส่งคืนจะทำงาน เหมือนกับเมื่อใช้ getUserMedia()

ข้อ จำกัด สำหรับ getDisplayMedia() แตกต่างจากข้อ จำกัด ที่ใช้สำหรับสัญญาณภาพหรือเสียงปกติ

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

ตัวอย่างรหัสข้างต้นแสดงให้เห็นถึงข้อ จำกัด พิเศษสำหรับการบันทึกหน้าจอ โปรดทราบว่าเบราว์เซอร์ทั้งหมดอาจไม่รองรับเบราว์เซอร์ทั้งหมดที่รองรับสื่อดิสเพลย์

สตรีมและแทร็ค

MediaStream หมายถึงสตรีมเนื้อหาสื่อซึ่งประกอบด้วยแทร็ก ( MediaStreamTrack ) ของเสียงและวิดีโอ คุณสามารถดึงข้อมูลแทร็กทั้งหมดจาก MediaStream โดยการเรียก MediaStream.getTracks() ซึ่งจะส่งคืนอาร์เรย์ของวัตถุ MediaStreamTrack

MediaStreamTrack

MediaStreamTrack มีคุณสมบัติ kind ที่เป็น audio หรือ video ระบุประเภทของสื่อที่ใช้แทน แต่ละแทร็กสามารถปิดเสียงได้โดยการสลับคุณสมบัติที่ enabled แทร็กมีคุณสมบัติบูลีน remote ที่ระบุว่ามีแหล่งที่มาจาก RTCPeerConnection และมาจากรีโมตเพียร์