การอัปเดตสื่อใน Chrome 62

ฟร็องซัว โบฟอร์
François Beaufort
GitHub

ใบอนุญาตถาวรสำหรับ Android

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

จนถึงปัจจุบัน ChromeOS เป็นแพลตฟอร์มเดียวที่รองรับใบอนุญาตถาวร เรื่องนี้ไม่จริงอีกต่อไป เล่นเนื้อหาที่มีการคุ้มครองผ่าน EME ขณะที่อุปกรณ์ออฟไลน์ก็เล่นใน Android ได้เช่นกัน

const config = [{
  sessionTypes: ['persistent-license'],
  videoCapabilities: [{
    contentType: 'video/webm; codecs="vp09.00.10.08"',
    robustness: 'SW_SECURE_DECODE' // Widevine L3
  }]
}];

// Chrome will prompt user if website is allowed to uniquely identify
// user's device to play protected content.
navigator.requestMediaKeySystemAccess('com.widevine.alpha', config)
.then(access => {
  // User will be able to watch encrypted content while being offline when
  // license is stored locally on device and loaded later.
})
.catch(error => {
  // Persistent licenses are not supported on this platform yet.
});

คุณลองใช้ใบอนุญาตถาวรด้วยตนเองได้โดยดูที่ Sample Media PWA และทำตามขั้นตอนต่อไปนี้

  1. ไปที่ https://biograf-155113.appspot.com/ttt/episode-2/
  2. คลิก "ทำให้ใช้งานแบบออฟไลน์ได้" และรอให้วิดีโอดาวน์โหลด
  3. เปิดโหมดบนเครื่องบิน
  4. คลิกปุ่ม "เล่น" แล้วเพลิดเพลินไปกับวิดีโอได้เลย

Widevine L1 สำหรับ Android

คุณอาจทราบแล้วว่าอุปกรณ์ Android ทั้งหมดต้องรองรับ Widevine ความปลอดภัยระดับ 3 (widevine L3) อย่างไรก็ตาม มีอุปกรณ์อีกจำนวนมากที่รองรับระดับการรักษาความปลอดภัยสูงสุดด้วย ซึ่งก็คือ widevine Security ระดับ 1 ซึ่งใช้การประมวลผลเนื้อหา วิทยาการเข้ารหัส และการควบคุมทั้งหมดภายในสภาพแวดล้อมการดำเนินการที่เชื่อถือได้ (TEE)

ข่าวดี Chrome สำหรับ Android รองรับ Widevine L1 แล้วเพื่อให้เล่นสื่อได้อย่างปลอดภัยที่สุด โปรดทราบว่าแอปนี้รองรับ ใน Chrome OS อยู่แล้ว

const config = [{
  videoCapabilities: [{
    contentType: 'video/webm; codecs="vp09.00.10.08"',
    robustness: 'HW_SECURE_ALL' // Widevine L1
  }]
}];

// Chrome will prompt user if website is allowed to uniquely identify
// user's device to play protected content.
navigator.requestMediaKeySystemAccess('com.widevine.alpha', config)
.then(access => {
  // User will be able to watch encrypted content in the most secure way.
})
.catch(error => {
  // Widevine L1 is not supported on this platform yet.
});

Shaka Player ซึ่งเป็นไลบรารี JavaScript สำหรับรูปแบบสื่อแบบปรับขนาดได้ (เช่น DASH และ HLS) มีการสาธิตให้คุณลองใช้ Widevine L1 ดังนี้

  1. ไปที่ https://shaka-player-demo.appspot.com/demo/ แล้วคลิก "อนุญาต" เมื่อได้รับข้อความแจ้ง
  2. เลือก "Angel One (มัลติโค้ด, หลายภาษา, Widevine)"
  3. ป้อน HW_SECURE_ALL ในช่อง "คุณภาพของวิดีโอ" ของส่วน "การกำหนดค่า"
  4. คลิกปุ่ม "โหลด" แล้วเพลิดเพลินไปกับวิดีโอได้เลย

การเพิ่มประสิทธิภาพแทร็กวิดีโอในเบื้องหลัง (MSE เท่านั้น)

ทีม Chrome พยายามหาวิธีใหม่ๆ ในการยืดอายุการใช้งานแบตเตอรี่อยู่เสมอ และ Chrome 62 ก็เช่นกัน

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

ปรับแต่งช่วงที่ค้นหาได้ในสตรีม MSE แบบสด

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

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

ในโค้ดด้านล่าง แหล่งที่มาของสื่อได้แนบกับองค์ประกอบสื่อแล้ว และมีเฉพาะกลุ่ม init เท่านั้น

const mediaSource = new MediaSource();
...

mediaSource.duration = +Infinity;
// Seekable time ranges: { }
// Buffered time ranges: { }

mediaSource.setLiveSeekableRange(1 /* start */, 4 /* end */);
// Seekable time ranges: { [1.000, 4.000) }
// Buffered time ranges: { }

// Let's append a media segment that starts at 3 seconds and ends at 6.
mediaSource.sourceBuffers[0].appendBuffer(someData);
// Seekable time ranges: { [1.000, 6.000) }
// Buffered time ranges: { [3.000, 6.000) }

mediaSource.clearLiveSeekableRange();
// Seekable time ranges: { [0.000, 6.000) }
// Buffered time ranges: { [3.000, 6.000) }

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

Intent to Ship | Chromestatus Tracker | ข้อบกพร่อง Chromium

FLAC ใน MP4 สำหรับ MSE

การเล่นสื่อตามปกติรองรับรูปแบบการเขียนโค้ดเสียง FLAC แบบไม่สูญเสียข้อมูลตั้งแต่ Chrome 56 หลังจากนั้นไม่นานก็มีการเพิ่ม FLAC ในการรองรับ ISO-BMFF (หรือ FLAC ใน MP4) และตอนนี้ FLAC ใน MP4 พร้อมใช้งานแล้วใน Chrome 62 สำหรับส่วนขยายแหล่งที่มาของสื่อ (MSE)

หากต้องการทราบข้อมูลนี้ นักพัฒนา Firefox คือผู้ที่พัฒนาและนำการรองรับ FLAC ในข้อกำหนดการห่อหุ้ม MP4 มาใช้ โดย BBC ได้ทดลองนำรูปแบบดังกล่าวไปใช้กับ MSE คุณสามารถอ่านโพสต์ "Delivering Radio 3 Concert Sound" ของ BBC เพื่อดูข้อมูลเพิ่มเติม

ต่อไปนี้คือวิธีที่คุณสามารถตรวจสอบว่า MSE สนับสนุน FLAC ใน MP4 หรือไม่

if (MediaSource.isTypeSupported('audio/mp4; codecs="flac"')) {
  // TODO: Fetch data and feed it to a media source.
}

หากต้องการดูตัวอย่างแบบเต็ม โปรดดูตัวอย่างอย่างเป็นทางการของเรา

Intent to Ship | Chromestatus Tracker | ข้อบกพร่อง Chromium

วิดีโออัตโนมัติจะแสดงแบบเต็มหน้าจอเมื่อมีการหมุนอุปกรณ์

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