تاريخ النشر: 5 شباط (فبراير) 2025
اعتبارًا من الإصدار 120 من Chrome، يمكن لتطبيقات الويب التي تتيح إجراء مؤتمرات الفيديو فتح نافذة "صورة داخل صورة" تلقائيًا عندما ينقل المستخدم التركيز من علامة التبويب الحالية. يكون ذلك مفيدًا للمقدّمين الذين يريدون رؤية المشاركين والتفاعل معهم في الوقت الفعلي أثناء عرض مستند أو استخدام علامات تبويب أو نوافذ أخرى. اطّلِع على فتح النوافذ في وضع "نافذة ضمن النافذة" تلقائيًا لتطبيقات الويب التي تتيح عقد اجتماعات الفيديو للاطّلاع على التفاصيل.
اعتبارًا من الإصدار 134 من Chrome، يمكن لتطبيقات الويب التي تشغّل الصوت أو الفيديو الدخول تلقائيًا إلى وضع "نافذة ضمن النافذة". وهذا يعني أنّ مشغّلات الموسيقى والفيديوهات على الويب يمكنها الآن التبديل بسلاسة إلى نافذة مشغّل مصغّرة عندما يبدّل المستخدم علامات التبويب، ما يغني عن التفعيل اليدوي.
لدعم حالات استخدام تشغيل الوسائط هذه، يمكن لتطبيقات الويب المتوافقة مع أجهزة الكمبيوتر المكتبي التي تعمل بالإصدار 134 من Chrome الانتقال تلقائيًا إلى وضع "نافذة ضمن النافذة"، مع فرض بعض القيود لضمان تجربة إيجابية للمستخدم. لا يكون تطبيق الويب مؤهلاً للاستفادة من ميزة "النافذة ضمن النافذة" التلقائية لتشغيل الوسائط إلا إذا كان يستوفي جميع الشروط التالية:
عنوان URL للإطار العلوي آمن وفقًا لخدمة "التصفّح الآمن".
تظهر الوسائط في الإطار العلوي.
كان الصوت مسموعًا في آخر ثانيتَين.
تتضمّن الوسائط تركيزًا على الصوت.
يتم تشغيل الوسائط.
تم تسجيل معالِج إجراء جلسة وسائط للإجراء
"enterpictureinpicture".تم تجاوز الحدّ الأدنى لمؤشر التفاعل مع الوسائط الخاص بالمستخدم، ما يشير إلى أنّ المستخدم يستخدِم الوسائط في تطبيق الويب هذا بشكل متكرّر. وينطبق ذلك إذا كان إعداد متصفّح المستخدم هو "يمكن طلب استخدام وضع "صورة في صورة "". لا ينطبق هذا الشرط إذا سمح المستخدم صراحةً لتطبيق الويب بفتح نافذة في وضع "نافذة ضمن النافذة".
يتتبّع الخطأ 386193409 تنفيذ شروط العرض لتسهيل تصحيح الأخطاء والتنفيذ.
يُرجى العِلم أنّه إذا كانت نافذة "نافذة ضمن نافذة" أخرى مفتوحة، لن يشغِّل Chrome وضع "نافذة ضمن نافذة" تلقائيًا. لا تسري هذه القاعدة إذا تم فتح نافذة "نافذة ضمن النافذة" الحالية تلقائيًا وكانت على وشك الإغلاق.
عندما يستوفي تطبيق الويب المتطلبات، يؤدي تبديل التركيز إلى علامة تبويب أخرى إلى تنشيط وظيفة ردّ الاتصال لمعالج إجراءات جلسة الوسائط للإجراء "enterpictureinpicture". يتيح ذلك لتطبيق الويب فتح نافذة "صورة في صورة" بدون استخدام إيماءة المستخدم. قد يظهر للمستخدم بعد ذلك مربّع حوار يطلب منه السماح للموقع الإلكتروني بفتح الفيديو في وضع "نافذة ضمن نافذة" تلقائيًا في كل مرة أو هذه المرة فقط أو عدم السماح بذلك مطلقًا.
يمكنك استخدام Picture-in-Picture API for <video> لفتح نافذة "صورة في صورة" من عنصر <video> في HTML، أو استخدام Document Picture-in-Picture API لفتح نافذة دائمًا في المقدّمة لتعبئتها بمحتوى HTML عشوائي. لا يتم التركيز على نافذة "صورة في صورة" عند فتحها ويتم إغلاقها تلقائيًا عندما تصبح الصفحة مرئية مرة أخرى.
يوضّح لك المثال التالي كيفية تشغيل عنصر <video> في HTML عندما ينقر المستخدم على زر. بعد ذلك، سجِّل بأمان معالِجًا لإجراءات جلسة الوسائط للإجراء "enterpictureinpicture" باستخدام دالة طلب معاودة اتصال تفتح نافذة "نافذة ضمن النافذة". تحتوي هذه النافذة على الفيديو الذي يتضمّن واجهة برمجة التطبيقات Picture-in-Picture API لعنصر <video>.
const video = document.querySelector("video");
async function onPlayButtonClick() {
// Play video.
await video.play();
}
try {
// Request video to automatically enter picture-in-picture when eligible.
navigator.mediaSession.setActionHandler("enterpictureinpicture", async () => {
await video.requestPictureInPicture();
});
} catch (error) {
console.log("The enterpictureinpicture action is not yet supported.");
}
جرِّب العرض التجريبي لمشغّل VideoJS الذي يعرض واجهة برمجة التطبيقات Document Picture-in-Picture API أو استخدِم عيّنات Video Media Session وAudio Media Session.
التفاعل مع الملاحظات ومشاركتها
إذا كانت لديك ملاحظات أو واجهت أي مشاكل، يمكنك مشاركتها على crbug.com.
الموارد
خدمات الإقرار
نشكر "بنجامين كين" و"فرانك ليبيراتو" على مراجعتهما.