تعديلات الوسائط في الإصدار 73 من Chrome

François Beaufort

سوف أناقش في هذه المقالة ميزات الوسائط الجديدة للإصدار 73 من Chrome، والتي تشمل:

• مفاتيح وسائط الأجهزة متوافقة الآن للتحكم في تشغيل الوسائط على الكمبيوتر المكتبي.
• يمكن لمطوّري الويب الاستعلام عمّا إذا كان يمكن فرض سياسة معيّنة لـ HDCP أم لا.
• سنبدأ بمراحل التجربة والتقييم في ما يتعلّق بكل من وضع "نافذة ضمن النافذة" تلقائيًا في تطبيقات الويب التقدّمية (PWA) على أجهزة الكمبيوتر المكتبي و"تخطّي الإعلان" في ميزة "نافذة ضمن النافذة".
• يتم منح تطبيقات الويب التقدّمية (PWA) لأجهزة الكمبيوتر المكتبي التشغيل التلقائي مع الصوت.

إتاحة مفاتيح وسائط الأجهزة

تتضمن العديد من لوحات المفاتيح حاليًا مفاتيح للتحكم في وظائف تشغيل الوسائط الأساسية مثل التشغيل/الإيقاف المؤقت والمسار السابق والتالي. تتوفّر هذه الميزات أيضًا في سماعات الرأس. حتى الآن، لم يكن بإمكان مستخدمي أجهزة الكمبيوتر المكتبي استخدام مفاتيح الوسائط هذه للتحكّم في تشغيل الصوت والفيديو في Chrome. ستتغير هذه التغييرات اليوم.

مفاتيح الوسائط على لوحة المفاتيح

إذا ضغط المستخدم على مفتاح الإيقاف المؤقت، سيتم إيقاف عنصر الوسائط النشط الذي يتم تشغيله في Chrome مؤقتًا وسيتلقى حدث وسائط "متوقف مؤقتًا". عند الضغط على مفتاح التشغيل، سيتم استئناف عنصر الوسائط الذي كان متوقفًا مؤقتًا سابقًا وسيظهر حدث "تشغيل" للوسائط. وتعمل هذه الميزة سواء كان Chrome يعمل في المقدّمة أو في الخلفية.

في ChromeOS، ستطلب الآن تطبيقات Android التي تستخدم التركيز على الصوت من Chrome إيقاف الصوت مؤقتًا واستئنافه لإنشاء تجربة وسائط سلسة بين المواقع الإلكترونية على Chrome وتطبيقات Chrome وتطبيقات Android. لا يتوفّر هذا الإعداد حاليًا إلا على جهاز ChromeOS الذي يعمل بنظام Android P.

باختصار، من المفيد دائمًا الاستماع إلى هذه الأحداث الإعلامية والتصرّف وفقًا لذلك.

video.addEventListener('pause', function() {
  // Video is now paused.
  // TODO: Let's update UI accordingly.
});

video.addEventListener('play', function() {
  // Video is now playing.
  // TODO: Let's update UI accordingly.
});

انتظر، فهناك المزيد. من خلال Media Session API الآن على أجهزة الكمبيوتر المكتبي (كانت متوفرة من قبل على الأجهزة الجوّالة فقط)، يمكن لمطوّري الويب معالجة الأحداث ذات الصلة بالوسائط مثل تغيير المقطع الصوتي التي تؤدي إلى تشغيل مفاتيح الوسائط. تتوفّر الحدثان previoustrack وnexttrack حاليًا.

navigator.mediaSession.setActionHandler('previoustrack', function() {
  // User hit "Previous Track" key.
});

navigator.mediaSession.setActionHandler('nexttrack', function() {
  // User hit "Next Track" key.
});

يتعامل Chrome تلقائيًا مع مفاتيح التشغيل والإيقاف المؤقت. ومع ذلك، إذا لم يناسبك السلوك الافتراضي، فما زال بإمكانك تعيين بعض معالجات الإجراءات لـ "تشغيل" و"إيقاف مؤقت" لمنع ذلك.

navigator.mediaSession.setActionHandler('play', function() {
  // User hit "Play" key.
});

navigator.mediaSession.setActionHandler('pause', function() {
  // User hit "Pause" key.
});

تتوفّر إمكانية استخدام مفاتيح وسائط الأجهزة على أنظمة التشغيل ChromeOS وmacOS وWindows. سيأتي نظام Linux في وقت لاحق.

ملاحظة: يمكن إعداد بعض البيانات الوصفية لجلسات الوسائط، مثل العنوان والفنان واسم الألبوم والعمل الفني باستخدام واجهة برمجة تطبيقات جلسات الوسائط، ولكن لا يتم ربطه بإشعارات سطح المكتب بعد. وسيتوفّر على منصات متوافقة لاحقًا.

يمكنك الاطّلاع على مستندات المطوّرين الحالية وتجربة نماذج جلسات الوسائط الرسمية.

Chromestatus Tracker | خطأ Chromium

الوسائط المشفّرة: التحقُّق من سياسة HDCP

بفضل HDCP Policy Check API، أصبح بإمكان مطوّري البرامج على الويب الاستعلام عمّا إذا كان يمكن فرض سياسة معيّنة، مثل متطلبات HDCP، قبل طلب تراخيص Widevine وتحميل الوسائط.

const status = await video.mediaKeys.getStatusForPolicy({ minHdcpVersion: '2.2' });

if (status == 'usable')
  console.log('HDCP 2.2 can be enforced.');

تتوفّر واجهة برمجة التطبيقات على جميع الأنظمة الأساسية. ومع ذلك، قد لا تكون عمليات التحقّق الفعلية من السياسات متاحة على بعض المنصات. على سبيل المثال، سيتم رفض وعد التحقّق من الالتزام بسياسة HDCP مع NotSupportedError على نظامَي Android وAndroid WebView.

يمكنك مراجعة مستندات المطوّرين السابقة وتجربة النموذج الرسمي للاطّلاع على جميع إصدارات HDCP المتوافقة.

هدف الشحن | أداة تتبّع حالة Chrome | خطأ Chromium

مرحلة التجربة الأصلية لاستخدام ميزة "نافذة ضمن النافذة" تلقائيًا لتطبيقات الويب التقدّمية (PWA) المثبَّتة

قد تحتاج بعض الصفحات إلى الدخول في وضع نافذة ضمن النافذة والخروج منه تلقائيًا ضمن أحد عناصر الفيديو. على سبيل المثال، قد تستفيد تطبيقات الويب لعقد اجتماعات الفيديو من بعض السلوك التلقائي لميزة "نافذة ضمن النافذة" عندما يتنقل المستخدم ذهابًا وإيابًا بين تطبيق الويب والتطبيقات أو علامات التبويب الأخرى. للأسف، لا يمكن إجراء ذلك مع متطلبات إيماءة المستخدم. وهنا يأتي دور ميزة "نافذة ضمن النافذة" تلقائيًا!

لإتاحة عمليتَي التبديل بين علامات التبويب والتطبيقات، تمت إضافة سمة autopictureinpicture جديدة إلى العنصر <video>.

<video autopictureinpicture></video>

إليك كيفية عملها تقريبًا:

• عندما يتم إخفاء المستند، يدخل عنصر الفيديو الذي تم ضبط السمة autopictureinpicture فيه مؤخرًا إلى نافذة ضمن النافذة تلقائيًا، إذا تم السماح بذلك.
• عندما يصبح المستند مرئيًا، يغادره عنصر الفيديو في نافذة ضمن النافذة تلقائيًا.

وهكذا انتهى كل شيء! يُرجى العلم أنّ ميزة "نافذة ضمن النافذة" التلقائية لا تنطبق إلا على تطبيقات الويب التقدّمية التي ثبّتها المستخدمون على أجهزة الكمبيوتر المكتبي.

يمكنك الاطّلاع على spec لمزيد من التفاصيل وتجربة استخدام نموذج PWA الرسمي.

ملاحظة: للحصول على ملاحظات من المطوِّرين على الويب، تتوفّر ميزة Auto Picture-in-Picture كإصدار تجريبي من Chrome 73 لأجهزة الكمبيوتر المكتبي (ChromeOS وLinux وMac وWindows). يجب [طلب رمز مميّز] ليتم تفعيل الميزة تلقائيًا في المصدر لفترة زمنية محدودة. لن تحتاج إلى تفعيل علامة "ميزات النظام الأساسي للويب".

هدف إلى إجراء تجربة | Chromestatus Tracker | خطأ Chromium

مرحلة التجربة والتقييم لتخطّي الإعلان في نافذة ميزة "نافذة ضمن النافذة"

عادةً ما يتألف نموذج إعلانات الفيديو من إعلانات ما قبل التشغيل. في أغلب الأحيان، يتيح موفرو المحتوى إمكانية تخطي الإعلان بعد بضع ثوانٍ. للأسف، بما أنّ نافذة ميزة "نافذة ضمن النافذة" غير تفاعلية، لا يمكن للمستخدمين الذين يشاهدون فيديو في وضع "نافذة ضمن النافذة" إجراء ذلك اليوم.

في ظل توفّر Media Session API الآن على أجهزة الكمبيوتر المكتبي (كانت متوافقة مع الأجهزة الجوّالة فقط من قبل)، يمكن استخدام إجراء جلسة وسائط skipad جديد لتوفير هذا الخيار في نافذة ضمن النافذة.

زر "تخطّي الإعلان" في نافذة ميزة "نافذة ضمن النافذة"

لتوفير هذه الميزة، عليك تمرير دالة من خلال skipad عند استدعاء setActionHandler(). لإخفائها، يجب تمرير null. كما يمكنك قراءة أدناه، إن الأمر واضح ومباشر.

try {
  navigator.mediaSession.setActionHandler('skipad', null);
  showSkipAdButton();
} catch(error) {
    // The "Skip Ad" media session action is not supported.
}

function showSkipAdButton() {
  // The Picture-in-Picture window will show a "Skip Ad" button.
  navigator.mediaSession.setActionHandler('skipad', onSkipAdButtonClick);
}

function onSkipAdButtonClick() {
  // User clicked "Skip Ad" button, let's hide it now.
  navigator.mediaSession.setActionHandler('skipad', null);

  // TODO: Stop ad and play video.
}

تنبيه: ستستمر معالِجات إجراءات جلسات الوسائط. أقترح دائمًا إعادة ضبط هذه الإعدادات عند بدء تشغيل الوسائط وانتهائها حتى لا يظهر زر "تخطّي الإعلان" غير المتوقّع.

يمكنك تجربة النموذج الرسمي "تخطّي الإعلان" وإعلامنا بكيفية تحسين هذه الميزة.

ملاحظة: للحصول على ملاحظات من مطوّري البرامج على الويب، تتوفّر ميزة "تخطّي الإعلان في نافذة ضمن النافذة" كنسخة تجريبية من الإصدار 73 من متصفِّح Chrome لأجهزة الكمبيوتر المكتبي (ChromeOS وLinux وMac وWindows). يجب [طلب رمز مميّز] لكي يتم تفعيل الميزة تلقائيًا في المصدر لفترة زمنية محدودة. سيؤدي ذلك إلى إلغاء الحاجة إلى تفعيل العلامة "ميزات منصة الويب".

هدف إلى إجراء تجربة | Chromestatus Tracker | خطأ Chromium

منح التشغيل التلقائي لتطبيقات الويب التقدّمية (PWA) على أجهزة الكمبيوتر المكتبي

الآن وبعد أن أصبحت تطبيقات الويب التقدّمية متوفرة على جميع الأنظمة الأساسية لأجهزة الكمبيوتر المكتبي، نعمل على توسيع القاعدة التي استخدمناها على الأجهزة الجوّالة إلى أجهزة الكمبيوتر المكتبي وهي: يُسمح الآن باستخدام التشغيل التلقائي مع الصوت لتطبيقات الويب التقدّمية المثبّتة. يُرجى العِلم أنّه لا ينطبق إلا على الصفحات المدرَجة في نطاق بيان تطبيق الويب.

خطأ Chromium