การแก้ไขข้อบกพร่องขององค์ประกอบสื่อ HTML เช่น <video>
และ <audio>
อาจทำได้ยากเนื่องจากการใช้งานเครื่องมือถอดรหัสจะแตกต่างกันไปตามสิ่งที่ถือว่าเป็นข้อผิดพลาด (โดยทั่วไปแล้ว เครื่องมือถอดรหัสฮาร์ดแวร์เข้มงวดที่สุด) โดยเฉพาะอย่างยิ่งเมื่อการเล่นอาจใช้ฟีเจอร์ที่เป็นความลับของตัวแปลงรหัสบางอย่าง โชคดีสำหรับเรามีเครื่องมือหลายอย่างที่เรานำมาใช้ประโยชน์ได้
เวลาแก้ไขข้อบกพร่องของข้อผิดพลาดในการเล่นสื่อ สิ่งแรกที่เรามักจะตรวจสอบคือแอตทริบิวต์ MediaError error
ในองค์ประกอบสื่อ HTML แอตทริบิวต์นี้เป็นคำแนะนำระดับสูงของสาเหตุที่ทำให้เกิดข้อผิดพลาดในการเล่นสื่อ พร็อพเพอร์ตี้ MediaError.code
แสดงผลค่าตัวเลขซึ่งแสดงประเภทข้อผิดพลาดที่เกิดขึ้นในองค์ประกอบสื่อ พร็อพเพอร์ตี้ MediaError.message
อีกรายการอาจระบุสตริงที่มีข้อมูลการวินิจฉัยบางอย่างจากเบราว์เซอร์
const video = document.querySelector('video');
video.addEventListener('error', () => {
console.log('Error code: ' + video.error.code);
console.log('Error message: ' + video.error.message);
});
พร็อพเพอร์ตี้เหล่านี้มีประโยชน์มากที่สุดสำหรับการวิเคราะห์การวัดและส่งข้อมูลทางไกล และอาจให้ข้อมูลไม่เพียงพอที่จะแก้ไขข้อบกพร่องในการเล่น ในบางครั้ง ข้อความแสดงข้อผิดพลาดทั้งหมดอาจถูกละเว้นด้วยเหตุผลด้านความเป็นส่วนตัว
หากต้องการเข้าถึงข้อมูลข้อผิดพลาดทั้งหมด ให้ใช้เครื่องมือสำหรับนักพัฒนาเว็บใน Chrome "แผงสื่อ" เพื่อดูบันทึกสื่อ คุณจะพบข้อมูลมากมาย เช่น เหตุการณ์ คำเตือน และข้อความแสดงข้อผิดพลาดที่จะให้คำแนะนำที่ดีเกี่ยวกับข้อผิดพลาดในการเล่นสื่อ
![ภาพหน้าจอของแผงสื่อในเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome](https://web.developers.google.cn/static/articles/debug-playback-errors/image/screenshot-the-media-pan-96619b7be4c41.png?authuser=6&hl=th)
นอกจากนี้ คุณยังสามารถใช้แอปพลิเคชันฟรีของ FFmpeg เพื่อตรวจสอบความสมบูรณ์ของไฟล์สื่อด้วยคำสั่งนี้
ffmpeg -err_detect explode -i <file> -f null -
ต่อไปนี้คือข้อผิดพลาดบางประการที่คุณอาจได้รับจากคำสั่งเหล่านี้สำหรับไฟล์วิดีโอที่มีตัวแปลงรหัสไม่ถูกต้อง
[mov,mp4,m4a,3gp,3g2,mj2 @ 0x7fc62df05380] Could not find codec parameters for stream 0 (Video: none (zzzz / 0x7A7A7A7A), none(smpte170m/smpte170m/bt709, progressive), 320x240, 4 kb/s): unknown codec
Consider increasing the value for the 'analyzeduration' (0) and 'probesize' (5000000) options
[matroska,webm @ 0x7fd45b705380] Unknown EBML doctype '0000'
[matroska,webm @ 0x7f8d17904d40] Element at 0x8b ending at 0x10400000095 exceeds containing master element ending at 0x9b
Truncating packet of size 9069 to 94
โปรแกรมดูโครงสร้างกล่อง MP4Box.js / ISOBMFF เป็นเครื่องมือที่มีประโยชน์ในการแก้ไขปัญหาบิตสตรีม อย่างไรก็ตาม การใช้งานจะต้องมีความเข้าใจ MP4 อยู่แล้ว
สุดท้าย เครื่องมือระดับมืออาชีพสำหรับการวิเคราะห์สตรีมวิดีโอ เช่น VQAnalyzer, Elecard StreamEye และ Codecian CodecVisa อาจคุ้มค่ากับการลงทุนของคุณ