وقتی VTTاز مبدأ دیگری میآید، بازشدنِ نشانیِ آن در مرورگر بهتنهایی نشان نمیدهد عنصر trackاجازهٔ استفاده از فایل را دارد. مبدأ شامل پروتکل، میزبان و پورت است. این راهنما دو مبدأِ محلیِ واقعی را مقایسه میکند و بارگذاریِ مجاز، نبودِ هدرِ CORSو۴۰۴را جدا ثبت میکند.
دو سمتِ قرارداد را جدا بررسی کنیم
برای trackِ بیرون از مبدأ صفحه، ویژگیcrossoriginروی عنصرِ والدِaudioیاvideoو پاسخِ مجازِ میزبانِ متن هر دو اهمیت دارند. در تمرین، والدcrossOrigin='anonymous'دارد. مبدأ دوم فقط در مسیرallowed.vttهدرِAccess-Control-Allow-Originرا برابرِ دقیقِ مبدأ اول برمیگرداند؛ مسیرblocked.vttهمان متن را بدون آن هدر میدهد.
متنِ نمونه باContent-Type:text/vttوUTF-8و سه cueاصیل فرستاده میشود. کد،track.modeراhiddenمیگذارد تا cueها درخواست شوند و رویدادloadیاerrorرا با زمانِ انتظار محدود ثبت میکند. hiddenبه معنی نمایشِ زیرنویس نیست؛ خواندنِ داده را از ظاهر جدا نگه میداریم.
نتیجهٔ چهار مسیر در مرورگرِ واقعی
| حالت | رخداد مشاهدهشده | تعداد cue |
|---|---|---|
| VTTهممبدأ | load | ۳ |
| مبدأ دوم با هدرِ مجازِ دقیق | load | ۳ |
| مبدأ دوم، همان متن بدون هدر | error | ۰ |
| نشانیِ متنِ ناموجود | error | ۰ |
دو خطای آخر از نگاهِ رخدادِ trackشبیهاند؛ برای تشخیص علت باید وضعیتِ پاسخ و پیامِ کنسول هم دیده شود. ازerrorتنها نتیجه نمیگیریم حتماً CORSخراب است. این جدول از درخواست و پردازشِ واقعیِ مرورگر به دو HTTPمحلی آمده، نه فقط مشاهدهٔ هدر با ابزارِ خط فرمان.
آزمون را بازتولید کنیم
پس از اجرای سرورِ همراه، نشانی اول را درAو دوم را درBبگذارید. تابعِ همراه را با await loadTeachingTrack(A+'/tone.wav', B+'/allowed.vtt')اجرا کنید؛ سپس فقطallowed.vttرا بهblocked.vttعوض کنید. کنترلِ هممبدأ باA+'/chapters.vtt'و کنترلِ۴۰۴باB+'/missing.vtt'است. نشانیها را از اجرای خودتان بردارید؛ پورتِ ثبتشدهٔ آزمایش، مقصدِ عمومی و دائمی نیست.
نمونه به حسابِ کاربری یا کوکی نیاز ندارد. تنظیمِ مجازِ این فایلِ آموزشی، راهکارِ عمومی برای خصوصیکردن یا عمومیکردنِ رسانهٔ مشتری نیست. no-cors،خاموشکردنِ حفاظت مرورگر یا نصب افزونه راهِ اصلاحِ این قرارداد نیست؛ پاسخِ سرور و مبدأِ مجاز باید برای همان کاربرد درست شوند.
بارگذاریِ متن، تأییدِ محتوای آن نیست
سه cueفقط با رسانهٔ ساختگیِ دوثانیهای هماهنگ شدهاند؛ رسیدنِ آنها به DOM،درستیِ رونویسیِ یک ویدئوی واقعی را ثابت نمیکند. اینجا درخواستِ دارایcredentials،preflightِسفارشی،SafariیاFirefoxآزمایش نشده است. از نتیجهٔ یک مرورگر تضمینِ همهٔ مقصدها نسازید.
اجرای محلی با فایلهای همراه
فایل Python را با Python 3.9یا جدیدتر و کتابخانهٔ استاندارد اجرا کنید؛ دو نشانیِ HTTPروی127.0.0.1با پورتهای متفاوت چاپ میکند. فقط روی رایانهٔ خودتان گوش میدهد، فایلِ کاربر نمیخواند و آپلود ندارد. در مبدأ اول، صفحهٔ پایه را باز کنید و کدِ JavaScriptمتنیِ همراه را در ابزارِ توسعهٔ همان صفحه اجرا کنید؛ این کد خودکار روی سایت اصلی نصب نمیشود. برای پایانِ سرورها Ctrl+Cبزنید.
رسانهٔ نمونه، WAVتککانالهٔ۱۶بیتی با نرخ۱۶۰۰۰،دو ثانیه موجِ سینوسی۴۴۰هرتز و۶۴۰۴۴بایت است. گفتارِ کسی ضبط نشده است. آزمونِ گزارششده در۳نوامبر۲۰۲۶با Edge154.0.4258.37در محیطِ جدا و بیصدا انجام شد؛ شنیدنِ انسان، تشخیص گفتار، درخواستِ سرویس بیرونی یا تماس در کار نبود.
برای ساختارِ پایه، اتصالِ VTTبه رسانه را ببینید. اگر فایل میرسد اما خودِ رسانه قابل استفاده نیست، تفکیکِ پاسخ HTTPو خطای رسانه مرحلهٔ دیگری است. این راهنما قابلیتِ زیرنویس یا میزبانیِ اپرانگار را اعلام نمیکند.
فایل تمرین و منبع
سرورِ دو مبدأِ محلی؛ صدای ریاضی و VTT را خودش میسازد · تابعِ بارگذاریِ trackبا رویداد load/errorو شمارشِ cue
منابع در ۳ نوامبر ۲۰۲۶ خوانده شدند؛ این تاریخ، تاریخ انتشار منبع نیست. مثالها و فایلهای این راهنما آموزشی و ساختهٔ تحریریهاند.