تاريخ النشر: 18 مارس 2026
بدءًا من الإصدار 142 من Chrome، يمكن لتطبيقات الويب التي تشغّل الصوت أو الفيديو الدخول تلقائيًا إلى وضع "نافذة ضمن النافذة" إذا سجّلت معالج إجراء لجلسة وسائط. وقد أثبتت هذه الميزة فعاليتها في مشغّلات الموسيقى والفيديو، ولكنّها تتطلّب من المطوّرين توفير إمكانية استخدامها بشكل صريح.
لتقديم تجربة سلسة لتعدُّد المهام باستخدام الوسائط وتحسين إمكانية العثور على ميزة "نافذة ضمن النافذة" (PiP)، يقدّم Chrome ميزة "نافذة ضمن النافذة" التلقائية التي يبدأها المتصفّح. تتيح هذه الميزة لمتصفّح Chrome فتح نافذة "صورة داخل صورة" تلقائيًا للمواقع الإلكترونية التي لم تسجّل معالج إجراءات جلسة الوسائط. يضمن ذلك بقاء محتوى الوسائط مرئيًا عند التبديل بين علامات التبويب.
التعليمات
- استخدام الإصدار 142 من Chrome أو إصدار أحدث على الكمبيوتر المكتبي
- فعِّل خيار "فتح النوافذ في وضع "نافذة ضمن النافذة" تلقائيًا من المتصفّح" في
chrome://flags/#browser-initiated-automatic-picture-in-pictureوأعِد تشغيل Chrome. - انتقِل إلى موقع إلكتروني يعرض فيديوهات وشغِّل فيديو (مثال).
- انتقِل إلى علامة تبويب أخرى في Chrome لتفعيل نافذة فيديو ضمن النافذة.
آلية العمل
عند تشغيل وسائط والتبديل إلى علامة تبويب أخرى، يمكن لمتصفّح Chrome نقل الوسائط تلقائيًا إلى نافذة فيديو "نافذة ضمن النافذة" تبقى دائمًا في المقدّمة. على عكس ميزة "نافذة تلقائية ضمن النافذة لتشغيل الوسائط" الحالية التي تتيح عرض الفيديو أو محتوى HTML عشوائي (باستخدام Document Picture-in-Picture API)، تفتح الطلبات التي يبدأها المتصفّح دائمًا نافذة عادية لعرض الفيديو في وضع "نافذة ضمن النافذة".
لضمان تقديم تجربة عالية الجودة وغير متداخلة للمستخدمين، لا يفعّل Chrome هذا السلوك إلا عند استيفاء مجموعة صارمة من الشروط:
- عنوان URL للإطار العلوي آمن وفقًا لخدمة "التصفّح الآمن".
- تظهر الوسائط في الإطار العلوي.
- كانت الوسائط مسموعة خلال آخر ثانيتَين.
- الوسائط لديها أولوية الصوت ويتم تشغيلها.
- يتوفّر لاعب "عادي" واحد، أي عنصر وسائط غير مكتوم تم تشغيله ولا يستخدم
MediaStream. - يجب أن يحتوي عنصر الوسائط على مسار فيديو.
- لا يستخدم الموقع الإلكتروني الكاميرا أو الميكروفون بشكل نشط.
- تم تجاوز الحدّ لمؤشر التفاعل مع الوسائط الخاص بالمستخدم، ما يشير إلى الاستخدام المتكرّر للموقع الإلكتروني. ينطبق هذا الشرط إذا لم يسمح المستخدم صراحةً بالميزة أو يرفضها.
- ما مِن نافذة "صورة داخل صورة" مفتوحة حاليًا. إذا كانت نافذة أخرى في وضع "نافذة ضمن النافذة" مفتوحة، لن ينفّذ Chrome عملية انتقال تلقائية.
enterpictureinpicture) وميزة "التشغيل التلقائي في وضع "نافذة ضمن النافذة" (Auto PiP)" لتشغيل الوسائط (حيث سجّل الموقع الإلكتروني المعالج).تحكّم المستخدم والخصوصية
تلتزم ميزة "تشغيل الفيديو تلقائيًا في وضع "نافذة ضمن النافذة"" التي يبدأها المتصفّح بأذونات المستخدم وإعداداته نفسها التي تلتزم بها الطلبات التي يبدأها الموقع الإلكتروني. في أول مرة يدخل فيها موقع إلكتروني إلى وضع "نافذة ضمن النافذة" تلقائيًا، يعرض Chrome للمستخدمين مربّع حوار يطلب منهم الإذن بالسماح بهذا السلوك للموقع الإلكتروني في المستقبل.
يمكن للمستخدمين أيضًا إدارة هذه الأذونات في أي وقت من خلال إعدادات الموقع الإلكتروني.
عناصر التحكّم المتاحة للمطوّرين وإيقاف الميزة
على الرغم من أنّ هذه الميزة مصمّمة للعمل تلقائيًا على معظم مواقع الفيديو، يمكنك إيقاف هذا السلوك.
تنفيذ معالجك الخاص
إذا كان تطبيق الويب يسجّل حاليًا معالج إجراءات لجلسة وسائط للإجراء enterpictureinpicture، ستكون الأولوية للتنفيذ، ولن يبدأ Chrome عملية الانتقال التلقائي الخاصة به.
إذا أردت تخصيص السلوك عندما يرى Chrome أنّ الانتقال مناسب، يتضمّن معالج الإجراء enterpictureinpicture الرمز reason في MediaSessionActionDetails. يمكنك التحقّق مما إذا كان reason هو contentoccluded (ما يعني أنّ المتصفّح بدأ الطلب لأنّ علامة التبويب كانت مخفية) وتحديد كيفية المتابعة.
navigator.mediaSession.setActionHandler("enterpictureinpicture", (details) => {
if (details.reason === "contentoccluded") {
// The browser suggests entering Picture-in-Picture.
// You can choose to open a standard video PiP or a Document PiP window, or do
// nothing (effectively blocking browser-initiated Auto Picture-in-Picture).
}
});
أفضل الممارسات لجلسة الوسائط
باستخدام ميزة "نافذة ضمن النافذة (PIP) التلقائية" التي يبدأها المتصفّح، يساعد إعداد جلسة الوسائط Chrome في فهم المحتوى والتفاعل معه. يضمن MediaSession الذي تم إعداده بشكل جيد أن توفّر نافذة "وضع ملء الشاشة" تجربة عالية الجودة مع عناصر تحكّم ومعلومات دقيقة للمستخدمين.
الحفاظ على مزامنة شريط التقدّم
في حال استخدام واجهة برمجة التطبيقات setPositionState وعدم تعديل موضع جلسة الوسائط بشكل صحيح، ستعرض نوافذ "نافذة ضمن النافذة" شريط تقدم غير دقيق أثناء تشغيل الوسائط. لمنع حدوث ذلك، عليك دائمًا تعديل قيمة position state أو إلغاء ضبطها باستخدام navigator.mediaSession.setPositionState() حسب الاقتضاء (على سبيل المثال، عند تغيير مصدر الوسائط أو إعادة ضبطه)، وذلك لكي تعكس نافذة "وضع ملء الشاشة" الموضع الصحيح للوسائط قيد التشغيل.
const video = document.querySelector('video');
function updatePositionState() {
if ('setPositionState' in navigator.mediaSession) {
navigator.mediaSession.setPositionState({
duration: video.duration,
playbackRate: video.playbackRate,
position: video.currentTime,
});
}
}
// Update when metadata is loaded or when seeking happens.
video.addEventListener("loadedmetadata", updatePositionState);
video.addEventListener("seeked", updatePositionState);
التعامل مع عمليات الانتقال بسلاسة
إذا كان موقعك الإلكتروني يشغّل تلقائيًا حلقة "الحلقة التالية"، تأكَّد من أنّ MediaSession معالجات الإجراءات والبيانات الوصفية تظل نشطة ودقيقة طوال عملية الانتقال. إذا تمت إزالة معالِجات الإجراءات أو إلغاء ضبطها أثناء الانتقال إلى عنصر "التالي"، قد تفقد نافذة "نافذة ضمن النافذة" الإمكانات التي توفّرها المعالِج.
تفعيل ميزة "التحكّم الكامل"
بالإضافة إلى التشغيل والإيقاف المؤقت الأساسيين، ننصحك بتنفيذ معالجات seekto وprevioustrack وnexttrack. يتيح ذلك للمستخدمين التنقّل في المحتوى مباشرةً من نافذة "الصورة داخل الصورة" بدون الرجوع إلى علامة التبويب الأصلية.
navigator.mediaSession.setActionHandler("seekto", (details) => {
if (details.fastSeek && "fastSeek" in video) {
video.fastSeek(details.seekTime);
return;
}
video.currentTime = details.seekTime;
});
التفاعل ومشاركة الملاحظات
إذا كانت لديك ملاحظات أو واجهت أي مشاكل في هذا السلوك، يمكنك مشاركتها على crbug.com.