Daha fazla sitede videoları otomatik olarak pencere içinde pencere modunda oynatma

Benjamin Keen
Benjamin Keen
François Beaufort
François Beaufort
GitHub

Yayınlanma tarihi: 18 Mart 2026

Chrome 142'den itibaren, medya oturumu işlem işleyicisi kaydeden ses veya video oynatan web uygulamaları otomatik olarak resim içinde resim moduna girebilir. Bu özellik, müzik ve video oynatıcılar için harika bir eklenti olsa da geliştiricilerin desteği açıkça uygulaması gerekir.

Chrome, sorunsuz bir medya çoklu görev deneyimi sunmak ve resim içinde resim (PiP) özelliğinin bulunabilirliğini artırmak için tarayıcı tarafından başlatılan otomatik PiP'yi kullanıma sunuyor. Bu özellik, medya oturumu işlem işleyicisi kaydetmemiş siteler için Chrome'un otomatik olarak bir video PiP penceresi açmasına olanak tanır. Bu sayede, sekmeler arasında geçiş yaptığınızda medya içeriğiniz görünür kalır.

Talimatlar

  • Masaüstünde Chrome 142 veya sonraki bir sürümü kullanın.
  • chrome://flags/#browser-initiated-automatic-picture-in-picture bölümünde "Tarayıcı tarafından başlatılan otomatik pencere içinde pencere" özelliğini etkinleştirin ve Chrome'u yeniden başlatın.
  • Bir video web sitesine gidip video oynatın (örnek).
  • Video PiP penceresini tetiklemek için başka bir Chrome sekmesine geçin.

İşleyiş şekli

Medya oynatırken başka bir sekmeye geçtiğinizde Chrome, medyayı her zaman en üstte olan bir video PIP penceresine otomatik olarak taşıyabilir. Video veya rastgele HTML içeriğini (Document Picture-in-Picture API kullanılarak) destekleyen mevcut "Medya oynatma için otomatik PIP" özelliğinin aksine, tarayıcı tarafından başlatılan istekler her zaman standart bir video PIP penceresi açar.

Chrome, yüksek kaliteli ve rahatsız edici olmayan bir kullanıcı deneyimi sağlamak için bu davranışı yalnızca belirli koşullar karşılandığında tetikler:

  • Üst çerçeve URL'si, Güvenli Tarama hizmetine göre güvenlidir.
  • Medya, üst çerçevede yer alıyor.
  • Medya son iki saniye içinde duyulabilir durumda olmalıdır.
  • Medya, ses odağına sahip ve oynatılıyor.
  • Tek bir "normal" oynatıcı vardır. Bu, oynatılmış ve MediaStream kullanmayan, sesi kapatılmamış bir medya öğesidir.
  • Medya öğesinde video parçası olmalıdır.
  • Site, kamerayı veya mikrofonu aktif olarak kullanmıyordur.
  • Kullanıcının Medya Etkileşim Endeksi eşiği aşılmış. Bu, sitenin sık kullanıldığını gösterir. Bu koşul, kullanıcı özelliği açıkça etkinleştirmediyse veya devre dışı bırakmadıysa geçerlidir.
  • Şu anda açık bir PiP penceresi yok. Başka bir PiP penceresi zaten açıksa Chrome otomatik geçişi tetiklemez.
Tarayıcı tarafından başlatılan otomatik PiP (enterpictureinpicture işlem işleyicisi olmayan site) ile medya oynatma için otomatik PiP (sitenin işleyiciyi kaydettiği yer) karşılaştırması.

Kullanıcı kontrolü ve gizliliği

Tarayıcı tarafından başlatılan otomatik PiP, site tarafından başlatılan isteklerle aynı kullanıcı izinlerine ve ayarlarına uyar. Bir site ilk kez otomatik olarak resim içinde resim moduna girdiğinde Chrome, kullanıcılara bu davranışa gelecekte izin vermek isteyip istemediklerini soran bir izin iletişim kutusu gösterir.

Kullanıcılar bu izinleri "Site Ayarları" üzerinden de istedikleri zaman yönetebilir.

Geliştirici kontrolü ve devre dışı bırakma

Bu özellik çoğu video sitesinde kullanıma hazır olacak şekilde tasarlanmış olsa da bu davranışı devre dışı bırakabilirsiniz.

Kendi işleyicinizi uygulama

Web uygulamanız enterpictureinpicture işlemi için bir medya oturumu işlem işleyicisi zaten kaydediyorsa uygulamanız öncelikli olur ve Chrome kendi otomatik geçişini başlatmaz.

Chrome'un geçişin uygun olduğunu düşündüğü durumlarda davranışı özelleştirmek istiyorsanız enterpictureinpicture işlem işleyicisi, MediaSessionActionDetails içinde reason içerir. reason değerinin contentoccluded olup olmadığını kontrol edebilir (bu, sekme gizlendiği için tarayıcının isteği başlattığı anlamına gelir) ve nasıl devam edeceğinize karar verebilirsiniz.

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).
  }
});

Medya oturumuyla ilgili en iyi uygulamalar

Tarayıcı tarafından başlatılan otomatik PiP ile medya oturumu yapılandırmanız, Chrome'un içeriğinizi anlamasına ve içerikle etkileşim kurmasına yardımcı olur. İyi yapılandırılmış bir MediaSession, küçük resim penceresinin kullanıcılara doğru kontroller ve bilgilerle yüksek kaliteli bir deneyim sunmasını sağlar.

İlerleme çubuğunu senkronize tutma

setPositionState API kullanılıyorsa ve medya oturumu konumu düzgün şekilde güncellenmiyorsa medya oynatılırken PiP pencerelerinde yanlış bir ilerleme çubuğu gösterilir. Bunu önlemek için navigator.mediaSession.setPositionState() kullanarak position state öğesini her zaman uygun şekilde güncelleyin veya ayarını kaldırın (ör. medya kaynağı değiştiğinde veya sıfırlandığında). Böylece, PiP penceresi oynatılan medyanın doğru konumunu yansıtır.

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);

Geçişleri sorunsuz şekilde yönetme

Sitenizde "Sonraki Bölüm" otomatik olarak oynatılıyorsa MediaSession işlem işleyicilerinizin ve meta verilerinizin geçiş boyunca etkin ve doğru kaldığından emin olun. "Sonraki" öğesine geçiş sırasında işlem işleyiciler kaldırılırsa veya ayarları kaldırılırsa PiP penceresi, işleyici tarafından sağlanan özellikleri kaybedebilir.

Tam denetimi etkinleştirme

Temel oynatma ve duraklatmanın yanı sıra seekto, previoustrack ve nexttrack için işleyiciler uygulayabilirsiniz. Bu sayede kullanıcılar, orijinal sekmeye dönmeden doğrudan PiP penceresinden içeriğinizde gezinebilir.

navigator.mediaSession.setActionHandler("seekto", (details) => {
  if (details.fastSeek && "fastSeek" in video) {
    video.fastSeek(details.seekTime);
    return;
  }
  video.currentTime = details.seekTime;
});

Etkileşim kurma ve geri bildirim paylaşma

Bu davranışla ilgili geri bildiriminiz varsa veya herhangi bir sorunla karşılaşırsanız bunları crbug.com adresinden paylaşın.

Kaynaklar