Title: قابلیت Cast را بدون از کار افتادن پلیر خود اضافه کنید

پخش ویدیو (Casting) از مرورگر به تلویزیون ساده به نظر می‌رسد، اما اکثر پلیرهای سفارشی HTML5 به محض امتحان کردن آن از کار می‌افتند. یک راهنمای توسعه‌دهنده اخیر، چهار نقطه شکست پنهان — انقضای توکن، مسدودسازی‌های CORS، میزبان‌های غیرقابل دسترس و تله MSE-blob — را فهرست کرده و دقیقاً نشان می‌دهد که چگونه می‌توان از هر کدام عبور کرد.

چرا قابلیت Cast باعث بروز مشکل در پلیرهای سفارشی می‌شود

وقتی روی Cast کلیک می‌کنید، تلویزیون پلیر JavaScript شما را اجرا نمی‌کند. بلکه URL استریم را که به آن داده‌اید دریافت کرده و رسانه را با فریم‌ور (firmware) خود پخش می‌کند. لایه‌ها (Overlays)، ارسال داده‌های تحلیلی (analytics pings) و منطق نرخ بیت تطبیقی (adaptive-bitrate) در مرورگر باقی می‌مانند. اگر تلویزیون نتواند همان URL را تحت همان شرایط دریافت کند، پخش متوقف می‌شود، که اغلب بدون هیچ خطای مشخصی در کنسول اتفاق می‌افتد.

چهار عامل اصلی رایج

  • انقضای توکن (Token expiry) – یک توکن امنیتی با عمر کوتاه در مرورگر کار می‌کند، اما تلویزیون ممکن است آن استریم را تا نود دقیقه نگه دارد. وقتی توکن منقضی شود، ویدیو متوقف می‌شود. برای جلسات Cast، توکن‌هایی با عمر طولانی‌تر صادر کنید.
  • خطاهای CORS – پروتکل CORS تعیین می‌کند که کدام دامنه‌ها مجاز به درخواست یک منبع هستند. تلویزیون به عنوان یک مبدأ (origin) مجزا در نظر گرفته می‌شود؛ بنابراین اگر سرور ویدیوی شما فقط دامنه صفحه را در لیست سفید (whitelist) خود داشته باشد، درخواست تلویزیون مسدود می‌شود، حتی اگر همان URL در مرورگر کار کند.
  • میزبان‌های غیرقابل دسترس (Unreachable hosts) – محیط‌های توسعه اغلب از localhost ،نام‌های میزبان داخلی یا محدوده‌های IP خصوصی استفاده می‌کنند. تلویزیون در بخش متفاوتی از شبکه قرار دارد و نمی‌تواند این آدرس‌ها را شناسایی یا به آن‌ها مسیریابی کند، که منجر به شکست‌های بی‌صدا (silent failures) می‌شود.
  • تله MSE – افزونه‌های منبع رسانه (MSE) به مرورگرها اجازه می‌دهند تکه‌های ویدیو را در لحظه به هم متصل کنند که اغلب ویدیو را به صورت یک URL از نوع blob: نمایش می‌دهد. کتابخانه‌هایی مانند hls.js چنین blobهایی را برای استریم تطبیقی تولید می‌کنند. تلویزیون‌ها نمی‌توانند یک blob را دریافت کنند؛ آن‌ها به URL واقعی فایل manifest (مانند .m3u8 یا .mpd) نیاز دارند. قبل از فراخوانی دیالوگ Cast، منبع را به manifest واقعی تغییر دهید.

چک‌لیست مرحله‌به‌مرحله

  1. تشخیص پشتیبانی از Cast – از Remote Playback API برای Chrome یا رویدادهای WebKit برای Safari استفاده کنید. این کار به شما می‌گوید که آیا مرورگر اصلاً می‌تواند پخش را واگذار کند یا خیر.
  2. مانیتور کردن وضعیت اتصال – فرض نکنید که کلیک روی دکمه، یک لینک پایدار را تضمین می‌کند. در رویدادهای connecting ،connected و disconnect از شیء Remote Playback مشترک شوید. تلویزیون را به عنوان منبع اصلی حقیقت (source of truth) در نظر بگیرید؛ رابط کاربری (UI) را تنها پس از دریافت رویداد connected به‌روزرسانی کنید.
  3. تغییر به یک URL مستقیم و با عمر طولانی – قبل از فراخوانی remotePlayback.prompt()، ویژگی src عنصر ویدیو را با URL مربوط به manifest که تلویزیون می‌تواند دریافت کند، جایگزین کنید. منبع اصلی مبتنی بر blob را برای پخش محلی نگه دارید، اما فقط برای جلسه Cast آن را تغییر دهید.
  4. اعتبارسنجی با یک تست ساده – یک صفحه HTML ساده با تنها یک تگ <video> که به URL مربوط به manifest اشاره می‌کند و بدون هیچ جاوااسکریپتی بسازید و اجازه دهید یک ساعت اجرا شود. اگر ویدیو متوقف شد، استریم زیربنایی در تلویزیون نیز با شکست مواجه خواهد شد. قبل از اضافه کردن دکمه Cast، مدت‌زمان توکن‌ها، هدرهای CORS یا قابلیت دسترسی به میزبان را اصلاح کنید.

آنچه توسعه‌دهندگان به دست می‌آورند

یک دکمه Cast قابل اعتماد اضافه کنید بدون اینکه بقیه بخش‌های پلیر از کار بیفتند.

نتیجه‌گیری

قابلیت Cast یک ویژگی "آماده استفاده" (plug-and-play) برای پلیرهای ویدیویی سفارشی نیست؛ بلکه پخش را به یک محیط کاملاً متفاوت واگذار می‌کند. با فراهم کردن یک URL با عمر طولانی و تایید شده توسط CORS، اجتناب از ارجاعات blob و گوش دادن به رویدادهای اتصال تلویزیون، می‌توانید دکمه Cast ای اضافه کنید که به جای از کار انداختن کل پلیر، به شکلی قابل اعتماد عمل کند.