ซับไตเติล WebVTT (.vtt)
W3C มาตรฐานWeb Video Text Tracks (WebVTT) คือมาตรฐานเว็บอย่างเป็นทางการของ W3C สำหรับคำบรรยายแทนเสียง ซับไตเติล และคำอธิบายบท โดยรองรับในตัวในองค์ประกอบวิดีโอ HTML5 (<track>) และการสตรีมสดผ่าน HTTP (HLS) สมัยใหม่
แปลง SRT เป็น VTT
ตัวแปลงจาก SRT เป็น VTT ฟรีในเบราว์เซอร์ แปลงไฟล์ได้ทันทีบนอุปกรณ์ของคุณ
ตรวจสอบไฟล์และข้อมูลเมตา
ระบบปฏิบัติการและเครื่องมือวิเคราะห์ไฟล์จะระบุไฟล์ WebVTT โดยการตรวจสอบลำดับไบต์ไบนารีส่วนต้น:
ลายเซ็นส่วนหัวระดับไบต์
ระบบปฏิบัติการและเครื่องมือวิเคราะห์ไฟล์จะระบุไฟล์ WebVTT โดยการตรวจสอบลำดับไบต์ไบนารีส่วนต้น:
ลายเซ็น HEX (OFFSET 0):
57 45 42 56 54 54การแสดงผลรูปแบบ ASCII: WEBVTT
มาตรฐาน: W3C WebVTT Recommendation
ข้อมูลจำเพาะทางเทคนิค
| สถาปัตยกรรมคอนเทนเนอร์ | ไฟล์ข้อความ UTF-8 ที่เริ่มด้วยลายเซ็น 'WEBVTT' ตามด้วยบล็อก STYLE และ NOTE ที่เลือกมีได้ แล้วจึงเป็นบล็อกคิวตามลำดับ |
| การบีบอัด | ข้อความล้วนแบบไม่บีบอัด (โดยทั่วไปบีบอัดระหว่างส่งผ่าน HTTP ด้วย Gzip หรือ Brotli) |
| การจัดลำดับไบต์ | สตรีมข้อความ UTF-8 |
| พื้นที่สี | รองรับ CSS Color Module Level 4 อย่างเต็มรูปแบบในรูปแบบของคิว |
| ช่องสัญญาณและโครงสร้าง | คิวที่กำหนดเวลาด้วยรหัสเวลา, ค่าความเชื่อมั่นของการรู้จำเสียงพูด, รูปแบบ CSS และการตั้งค่าตำแหน่งบนหน้าจอ |
| ขนาดสูงสุด | จำนวนคิวคำบรรยายต่อเนื่องไม่จำกัด |
| ความโปร่งใส | รองรับค่าความทึบและความโปร่งใสแบบอัลฟาของ CSS เต็มรูปแบบผ่านองค์ประกอบเทียม '::cue' |
| การสตรีมและแบบโปรเกรสซีฟ | รองรับการสตรีมโดยตรงผ่านองค์ประกอบ <video> ของ HTML5 และรายการสตรีมวิดีโอสด HLS / DASH |
ตารางเปรียบเทียบทางเทคนิค: WebVTT กับคู่แข่ง
| คุณลักษณะทางเทคนิค | WebVTT (ปัจจุบัน) | SRT | ASS | SUB |
|---|---|---|---|---|
| การบูรณาการเว็บ HTML5 | มาตรฐานที่รองรับในตัว 100% (<track>) | ต้องใช้การแปลง JS | ต้องใช้ WebAssembly | ต้องทำการแปลง |
| การจัดสไตล์ CSS | รองรับการจัดรูปแบบ CSS ในตัวเต็มรูปแบบ (::cue) | แท็ก HTML พื้นฐานเท่านั้น | แท็กการลบล้างที่เป็นกรรมสิทธิ์ | ไม่มี |
| การสตรีม HLS / DASH | WebVTT ใช้กับแทร็กข้อความแบบกำหนดเวลาในวิดีโอเบราว์เซอร์และเพลย์ลิสต์สตรีมมิงบางประเภท การรองรับขึ้นอยู่กับรูปแบบการส่ง | รองรับผ่านการมักซ์ (Muxing) | รองรับการสตรีมจำกัด | ไม่มี |
| ข้อกำหนดส่วนหัว | ต้องมีข้อความ 'WEBVTT' ในบรรทัด 1 อย่างเคร่งครัด | ไม่ต้องมีส่วนหัว | ส่วน [Script Info] | ไม่ต้องมีส่วนหัว |
รูปแบบความเสียหายทั่วไปและคู่มือการกู้คืน Hex
ข้อผิดพลาดในคอนโซลเบราว์เซอร์: 'ไฟล์ WebVTT ไม่ถูกต้อง: ขาดลายเซ็น WEBVTT'
สาเหตุหลัก: ขาดสตริง 'WEBVTT' ในบรรทัดที่ 1 หรือมีบรรทัดว่างก่อนส่วนหัว
การกู้คืน: ใส่ 'WEBVTT\n\n' ไว้ที่ด้านบนสุดของไฟล์โดยใช้ File2File.app Subtitle Converter
การวิเคราะห์ความปลอดภัยและเวกเตอร์การโจมตีตัวแยกวิเคราะห์
ตัวแยกวิเคราะห์ WebVTT ในเว็บเบราว์เซอร์ประมวลผลคิวที่ไม่น่าเชื่อถือ ซึ่งอาจนำไปสู่การโจมตีแบบ Cross-Site Scripting (XSS) หากเรนเดอร์โดยไม่มีการฆ่าเชื้อ (sanitization) เข้าสู่ DOM
เวกเตอร์การโจมตีที่ทราบ
- การฉีด XSS ผ่านเนื้อหาคิว HTML ที่ไม่ได้ฆ่าเชื้อซึ่งแทรกเข้าไปใน DOM ของเครื่องเล่นวิดีโอบนเว็บ
- การปลอมแปลงคำขอฝั่งเซิร์ฟเวอร์ (SSRF) ระหว่างการสร้างภาพขนาดย่อคำบรรยายฝั่งเซิร์ฟเวอร์อัตโนมัติ
- การปฏิเสธการให้บริการผ่านตัวเลือกคิว CSS ที่จัดรูปแบบไม่ถูกต้อง
แนวทางปฏิบัติที่ดีที่สุดในการป้องกัน: พึ่งพาการเรนเดอร์แท็ก <track> ของเบราว์เซอร์เนทีฟและทำความสะอาดเพย์โหลดคิว (cue payloads) ก่อนการแทรก DOM ด้วยตนเอง
ประวัติความเป็นมาและเหตุการณ์สำคัญ
ข้อได้เปรียบและจุดเด่นสำคัญ
- องค์ประกอบ HTML <track> ใช้ WebVTT สำหรับคำบรรยายและซับไตเติล เบราว์เซอร์แสดงเวลา cue และรูปแบบผ่านเครื่องเล่นวิดีโอ โดยฟีเจอร์ cue ที่รองรับอาจแตกต่างกัน
- รองรับการจัดรูปแบบ CSS ได้หลากหลาย: ปรับแต่งสี ฟอนต์ พื้นหลัง และตำแหน่งด้วย CSS pseudo-element '::cue' ที่มีมาในตัว
- บริการ HLS และ MPEG-DASH สามารถส่งแทร็กคำบรรยาย WebVTT พร้อมเซกเมนต์วิดีโอได้ โปรดตรวจสอบว่าเครื่องเล่นปลายทางรองรับการบรรจุคำบรรยายในเพลย์ลิสต์และแทร็กภาษา
ข้อจำกัดทางเทคนิคและข้อควรพิจารณา
- ข้อกำหนดส่วนหัวที่เข้มงวด: ไฟล์ต้องเริ่มต้นด้วยข้อความ 'WEBVTT' ในบรรทัดแรกสุด มิฉะนั้นเบราว์เซอร์จะปฏิเสธ
- ตัวคั่นมิลลิวินาทีที่เป็นจุด ('00:01:20.500') ต้องมีการแปลงจากไฟล์ SRT ที่คั่นด้วยจุลภาครุ่นเก่า
- เครื่องเล่นฮาร์ดแวร์รุ่นเก่าที่ไม่ใช่เบราว์เซอร์ (เช่น กล่องเล่นสื่อ USB ราคาถูก) มักไม่รองรับ WebVTT ในตัว
เกร็ดความรู้ทางเทคนิคที่น่าสนใจ
- ไฟล์ WebVTT ที่ถูกต้องทุกไฟล์ต้องขึ้นต้นด้วยคำว่า 'WEBVTT' ในบรรทัดแรก มิฉะนั้น สิ่งอื่นใดจะทำให้เบราว์เซอร์เพิกเฉยต่อไฟล์นั้น
- เดิมที WebVTT ถูกเรียกว่า 'WebSRT' เนื่องจากได้รับการออกแบบมาโดยเจตนาให้ดูเกือบจะเหมือนกับคำบรรยาย SRT แบบคลาสสิก
- WebVTT ยังสามารถใช้สำหรับบทวิดีโอและคำแนะนำภาพขนาดย่อแบบโต้ตอบเมื่อวางเมาส์เหนือแถบเลื่อนวิดีโอได้อีกด้วย
คำถามทางเทคนิคที่พบบ่อย
WebVTT ใช้สำหรับทำอะไร
WebVTT เป็นรูปแบบมาตรฐานเว็บอย่างเป็นทางการสำหรับการเพิ่มซับไตเติล, คำบรรยายแทนเสียง, บท และคำอธิบายลงในองค์ประกอบ HTML5 <video> บนเว็บไซต์
ฉันจะแปลงซับไตเติล SRT เป็น WebVTT ได้อย่างไร
คุณสามารถแปลงไฟล์ SRT เป็นไฟล์ WebVTT ที่สะอาดเรียบร้อยได้ในคลิกเดียวโดยใช้ File2File.app บนเบราว์เซอร์ของคุณ
เหตุใดซับไตเติล WebVTT ของฉันจึงไม่แสดงขึ้นในเบราว์เซอร์
ตรวจสอบให้แน่ใจว่าไฟล์ของคุณเริ่มต้นด้วย 'WEBVTT' ในบรรทัดที่ 1, มีบรรทัดว่างหลังจากนั้น และเว็บเซิร์ฟเวอร์ของคุณให้บริการพร้อมกับส่วนหัว 'Content-Type: text/vtt'
คู่การแปลงไฟล์ WebVTT ที่เกี่ยวข้อง
การแปลงไฟล์ SubRip Text เป็นรูปแบบ WebVTT ช่วยเปลี่ยนคำบรรยายที่เป็นข้อความธรรมดาให้กลายเป็นแทร็กเวลาสมัยใหม่ที่รองรับ HTML5 สำหรับโปรแกรมเล่นวิดีโอบนเว็บ
การแปลงไฟล์ WebVTT เป็น SubRip Text ช่วยให้สามารถเล่นคำบรรยายวิดีโอ HTML5 บนโปรแกรมเล่นมีเดียเดสก์ท็อปรุ่นเก่าและฮาร์ดแวร์ตัดต่อรุ่นเก่าได้อย่างราบรื่น