Ekran Uyandırma Kilidi API'si ile uyanık kalma

Ekran Uyandırma Kilidi API'si, bir uygulamanın çalışmaya devam etmesi gerektiğinde cihazların ekran kararmasını veya kilitlenmesini önleyen bir yöntem sağlar.

Pete LePage
Thomas Steiner

Screen Wake Lock API nedir?

Pilin boşalmasını önlemek için çoğu cihaz bırakıldığında hemen uyku moduna geçer boşta kalma. Bu çoğu zaman iyi bir uygulama olsa da bazı uygulamaların ekranın uyanık bir durumda olması gerekir. Yemek yapma uygulamaları buna örnek olarak gösterilebilir bir yemek tarifinin veya oyunun adımlarını gösteren Mesela Ball Puzzle, giriş için hareket API'leridir.

Screen Wake Lock API, cihazın kararmasını önlemenin bir yolunu sağlar ve ekranı kilitleyebilir. Bu özelliği sayesinde, şimdiye kadar platforma özgü uygulamalar gerektiren yeni deneyimler sunuluyor.

Screen Wake Lock API, saldırıya uğrama ihtimalini azaltır ve geçici çözümler bulunmaktadır. Eski bir API'nin eksikliklerini gideriyor ekranı açık tutmakla sınırlı olan bu cihazlar, güvenlik ve gizlilik sorunları.

Screen Wake Lock API için önerilen kullanım alanları

RioRun, The Guardian tarafından geliştirilmiş bir web uygulaması, (artık mevcut olmamasına rağmen) mükemmel bir kullanım alanıydı. Uygulama, sizi 2016'nın rotasını izleyerek Rio'da sanal bir sesli tura çıkarıyor. Olimpiyat maratonu. Uyanık kalma kilitleri olmadan, Tur oynatılırken ekranlar sık sık kapanıyordu. kullanımı zorlaştırır.

Elbette daha birçok kullanım alanı var:

  • Siz pasta yaparken veya yemek yaparken ekranı açık tutan bir yemek tarifi uygulaması akşam yemeği
  • Ekranı koruyan bir biniş kartı veya bilet uygulaması Barkod taranana kadar açık kalır
  • Ekranı sürekli açık tutan kiosk tarzı bir uygulama
  • Ekranı koruyan web tabanlı bir sunum uygulaması sunu sırasında açık
ziyaret edin.

Mevcut durum

Step Durum
1. Açıklayıcı oluşturun Yok
2. İlk spesifikasyon taslağını oluşturun Tamamlandı
3. Geri bildirim alma ve tasarımı yineleme Tamamlandı
4. Kaynak denemesi Tamamlandı
5. Başlat Tamamlandı

Screen Wake Lock API'yi kullanma

Uyanık kalma kilidi türleri

Screen Wake Lock API şu anda yalnızca bir tür uyanık kalma kilidi sağlar: screen.

screen uyanık kalma kilidi

screen uyanık kalma kilidi, cihazın ekranının dönmesini engeller Kullanıcının ekranda görüntülenen bilgileri görebilmesi için bu özelliği kapalı konuma getirmelidir.

Ekran uyanık kalma kilidi alınıyor

Ekran uyanık kalma kilidi istemek için navigator.wakeLock.request() yöntemini çağırmanız gerekir WakeLockSentinel nesnesini döndürür. Bu yönteme, istenen uyanık kalma kilidi türünü parametre olarak iletirsiniz. Bu özellik şu anda yalnızca 'screen' ile sınırlıdır ve bu nedenle isteğe bağlıdır. Tarayıcı isteği çeşitli nedenlerle reddedebilir (örneğin, pil şarj seviyesi çok düşük olduğu için), Bu nedenle aramayı bir try…catch ifadesinde birleştirmek iyi bir uygulamadır. İstisnanın mesajı, hata durumunda daha fazla ayrıntı içerir.

Ekran uyanık kalma kilidini açma

Ayrıca, ekran uyanık kalma kilidini açmak için bir yönteme ihtiyacınız vardır. Bunu, WakeLockSentinel nesnesinin release() yöntemi. WakeLockSentinel için bir referans depolamazsanız tuşuna basarak kilidi manuel olarak açabilirsiniz, ancak geçerli sekme görünmez olduğunda serbest bırakılır.

Ekran uyanık kalma kilidini otomatik olarak serbest bırakmak istiyorsanız belirli bir süre geçtikten sonra release() öğesini çağırmak için aşağıdaki örnekte gösterildiği gibi window.setTimeout() kullanabilirsiniz.

// The wake lock sentinel.
let wakeLock = null;

// Function that attempts to request a screen wake lock.
const requestWakeLock = async () => {
  try {
    wakeLock = await navigator.wakeLock.request();
    wakeLock.addEventListener('release', () => {
      console.log('Screen Wake Lock released:', wakeLock.released);
    });
    console.log('Screen Wake Lock released:', wakeLock.released);
  } catch (err) {
    console.error(`${err.name}, ${err.message}`);
  }
};

// Request a screen wake lock…
await requestWakeLock();
// …and release it again after 5s.
window.setTimeout(() => {
  wakeLock.release();
  wakeLock = null;
}, 5000);

WakeLockSentinel nesnesi, released adlı bir özelliğe sahip. bir koruyucunun zaten serbest bırakılıp bırakılmadığını belirtir. Değeri başlangıçta false olur ve "release" olduğunda true olarak değişir gönderilir. Bu mülk, web geliştiricilerinin bu kaydı manuel olarak takip etmeleri gerekmemesi için yayınlandı. Chrome 87'den itibaren kullanılabilir.

Ekran uyanık kalma kilidi yaşam döngüsü

Ekran uyanık kalma kilidi demosu ile oynarken ekran uyanık kalma kilitlerinin olduğunu sayfa görünürlüğü konusunda hassastır. Bu, ekran uyanık kalma kilidinin simge durumuna küçülttüğünüzde otomatik olarak ya da ekran uyanık kalma kilidinin etkin olduğu bir sekmeden veya pencereden geçiş yapın.

Ekran uyanık kalma kilidini yeniden almak için visibilitychange etkinliğini dinle ve şu durumlarda yeni bir ekran uyanık kalma kilidi iste:

const handleVisibilityChange = async () => {
  if (wakeLock !== null && document.visibilityState === 'visible') {
    await requestWakeLock();
  }
};

document.addEventListener('visibilitychange', handleVisibilityChange);

Sistem kaynakları üzerindeki etkinizi en aza indirin

Uygulamanızda ekran uyanık kalma kilidi kullanmalı mısınız? Uygulayacağınız yaklaşım, uygulamanızın ihtiyaçlarına bağlıdır. Her ne olursa olsun, en hafif yaklaşımı kullanarak uygulamanızın en düşük sistem kaynakları üzerindeki etkisi hakkında bilgi edindiniz.

Uygulamanıza ekran uyanık kalma kilidi eklemeden önce kullanım alanlarınızın aşağıdaki alternatif çözümlerden biriyle çözülebilir:

  • Uygulamanız uzun süreli indirme işlemleri gerçekleştiriyorsa arka planda getirme gibi özelliklerdir.
  • Uygulamanız harici bir sunucudaki verileri senkronize ediyorsa şunu kullanmayı düşünün: arka plan senkronizasyonu.
ziyaret edin.

Demo

Ekran Uyandırma Kilidi demosuna ve demo kaynağına göz atın. Sekmeler arasında geçiş yaptığınızda ekran uyanık kalma kilidinin otomatik olarak serbest bırakıldığına dikkat edin uygulamalar.

İşletim sistemi görev yöneticisindeki Ekran Uyandırma Kilitleri

Bir uygulamanın bu soruna neden olup olmadığını görmek için işletim sisteminizin görev yöneticisini uyku moduna geçmesini engeller. Aşağıdaki videoda macOS gösterilmektedir Etkinlik İzleyici Bu simge, Chrome'un sistemi uyanık tutan etkin bir ekran uyanık kalma kilidine sahip olduğunu gösterir.

Geri bildirim

Web Platform Incubator Community Group (WICG) ve Chrome ekibi de düşünce ve deneyimlerinize kulak veriyoruz.

Bize API tasarımı hakkında bilgi verin

API'de beklendiği gibi çalışmayan bir şey mi var? Alternatif olarak: Fikrinizi uygulamak için ihtiyacınız olan eksik yöntemler veya özellikler var mı?

Uygulamayla ilgili bir sorunu bildirin

Chrome'un uygulanmasıyla ilgili bir hata buldunuz mu? Yoksa ve spesifikasyondan farklı mı?

  • https://new.crbug.com adresinden hata bildiriminde bulunun. Olabildiğince çok sayıda ve hatayı yeniden oluşturmak için basit talimatlar sağlayın ve Bileşenler'i Blink>WakeLock olarak ayarlayın. Glitch çok iyi sonuç veriyor hızlı ve kolay yenidenler paylaşmak için.

API'ye desteğinizi gösterin

Screen Wake Lock API'yi kullanmayı planlıyor musunuz? Herkese açık desteğiniz, Chrome ekibi özelliklerin önceliğini belirler ve diğer tarayıcı tedarikçilerine onu desteklemek çok önemli.

Faydalı bağlantılar

Teşekkür

Hero resim: Unsplash'te Kate Stone Matheson. Görev yöneticisi videosu: Henry Lim