स्क्रीन वेक लॉक एपीआई की मदद से स्क्रीन चालू रखें

अगर किसी ऐप्लिकेशन का चालू रहना ज़रूरी है, तो Screen Wake Lock API की मदद से, डिवाइस की स्क्रीन की रोशनी कम या बंद होने से रोका जा सकता है.

Pete LePage
Thomas Steiner

Screen Wake Lock API क्या है?

बैटरी खत्म होने से बचाने के लिए, ज़्यादातर डिवाइसों में कुछ समय तक कोई गतिविधि न होने पर, वे तुरंत स्लीप मोड में चले जाते हैं. ज़्यादातर मामलों में, यह सेटिंग ठीक होती है. हालांकि, कुछ ऐप्लिकेशन को अपना काम पूरा करने के लिए, स्क्रीन को चालू रखना पड़ता है. उदाहरण के लिए, खाना बनाने के तरीके बताने वाले ऐप्लिकेशन, जिनमें किसी रेसिपी के चरण दिखाए जाते हैं. इसके अलावा, Ball Puzzle जैसे गेम, जो इनपुट के लिए डिवाइस मोशन एपीआई का इस्तेमाल करते हैं.

Screen Wake Lock API की मदद से, डिवाइस की स्क्रीन की रोशनी कम होने और लॉक होने से रोका जा सकता है. इस सुविधा की मदद से, अब ऐसे नए अनुभव पाए जा सकते हैं जिनके लिए अब तक प्लैटफ़ॉर्म के हिसाब से ऐप्लिकेशन की ज़रूरत होती थी.

स्क्रीन वेक लॉक एपीआई की मदद से, हैकी और संभावित रूप से ज़्यादा बैटरी खर्च करने वाले वर्कअराउंड की ज़रूरत कम हो जाती है. यह पुराने एपीआई की कमियों को दूर करता है. पुराना एपीआई, सिर्फ़ स्क्रीन को चालू रखने के लिए इस्तेमाल किया जाता था. साथ ही, इसमें सुरक्षा और निजता से जुड़ी कई समस्याएं थीं.

Screen Wake Lock API के इस्तेमाल के सुझाव

RioRun, The Guardian ने बनाया था. यह एक वेब ऐप्लिकेशन था. यह एक बेहतरीन उदाहरण था. हालांकि, यह अब उपलब्ध नहीं है. यह ऐप्लिकेशन आपको रियो का वर्चुअल ऑडियो टूर कराता है. यह टूर, 2016 के ओलंपिक मैराथन के रूट पर आधारित है. वेक लॉक के बिना, टूर के दौरान उपयोगकर्ताओं की स्क्रीन बार-बार बंद हो जाती. इस वजह से, उन्हें इसका इस्तेमाल करने में मुश्किल होती.

बेशक, इसके अलावा भी कई अन्य उदाहरण हैं:

  • रेसिपी वाला ऐसा ऐप्लिकेशन जो केक बेक करते या रात का खाना बनाते समय स्क्रीन को चालू रखता है
  • बोर्डिंग पास या टिकट वाला ऐसा ऐप्लिकेशन जो बारकोड स्कैन होने तक स्क्रीन को चालू रखता है
  • कियोस्क स्टाइल वाला ऐसा ऐप्लिकेशन जो स्क्रीन को लगातार चालू रखता है
  • वेब पर काम करने वाला एक ऐसा प्रज़ेंटेशन ऐप्लिकेशन जो प्रज़ेंटेशन के दौरान स्क्रीन को चालू रखता है

मौजूदा स्थिति

चरण स्थिति
1. एक्सप्लेनर बनाना उपलब्ध नहीं है
2. स्पेसिफ़िकेशन का शुरुआती ड्राफ़्ट बनाना पूरा हो गया
3. सुझाव/राय पाएं और डिज़ाइन को बेहतर बनाएं पूरा हो गया
4. ऑरिजिन ट्रायल पूरा हुआ
5. लॉन्च करें पूरा हो गया

Screen Wake Lock API का इस्तेमाल करना

वेक लॉक के टाइप

फ़िलहाल, Screen Wake Lock API सिर्फ़ एक तरह का वेक लॉक उपलब्ध कराता है: screen.

screen वेक लॉक

screen वेक लॉक की मदद से, डिवाइस की स्क्रीन को बंद होने से रोका जा सकता है. इससे उपयोगकर्ता को स्क्रीन पर दिखने वाली जानकारी दिखती रहती है.

स्क्रीन वेक लॉक पाना

स्क्रीन वेक लॉक का अनुरोध करने के लिए, आपको navigator.wakeLock.request() तरीके को कॉल करना होगा. यह तरीका, WakeLockSentinel ऑब्जेक्ट दिखाता है. इस तरीके में, पैरामीटर के तौर पर वेक लॉक का मनचाहा टाइप पास किया जाता है. फ़िलहाल, यह सिर्फ़ 'screen' तक सीमित है. इसलिए, यह ज़रूरी नहीं है. ब्राउज़र, कई वजहों से अनुरोध को अस्वीकार कर सकता है. उदाहरण के लिए, बैटरी का चार्ज लेवल बहुत कम होने की वजह से. इसलिए, कॉल को try…catch स्टेटमेंट में रैप करना एक अच्छा तरीका है. अगर कोई गड़बड़ी होती है, तो अपवाद के मैसेज में ज़्यादा जानकारी शामिल होगी.

स्क्रीन को जगाने वाले लॉक को रिलीज़ करना

आपको स्क्रीन वेक लॉक को रिलीज़ करने का तरीका भी चाहिए. इसके लिए, WakeLockSentinel ऑब्जेक्ट के release() तरीके को कॉल किया जाता है. अगर आपने WakeLockSentinel का रेफ़रंस सेव नहीं किया है, तो लॉक को मैन्युअल तरीके से रिलीज़ नहीं किया जा सकता. हालांकि, मौजूदा टैब के न दिखने पर इसे रिलीज़ कर दिया जाएगा.

अगर आपको कुछ समय बाद स्क्रीन वेक लॉक को अपने-आप रिलीज़ करना है, तो नीचे दिए गए उदाहरण में दिखाए गए तरीके से, window.setTimeout() को कॉल करने के लिए release() का इस्तेमाल किया जा सकता है.

// 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 ऑब्जेक्ट में released नाम की एक प्रॉपर्टी होती है. इससे पता चलता है कि कोई सेंटिनल पहले ही रिलीज़ किया जा चुका है या नहीं. शुरुआत में इसकी वैल्यू false होती है. "release" इवेंट भेजे जाने के बाद, इसकी वैल्यू true हो जाती है. इस प्रॉपर्टी से वेब डेवलपर को यह पता चलता है कि लॉक कब रिलीज़ किया गया है, ताकि उन्हें इसे मैन्युअल तरीके से ट्रैक न करना पड़े. यह Chrome 87 और उसके बाद के वर्शन में उपलब्ध है.

स्क्रीन वेक लॉक का लाइफ़साइकल

स्क्रीन वेक लॉक डेमो का इस्तेमाल करने पर, आपको पता चलेगा कि स्क्रीन वेक लॉक, पेज दिखने की स्थिति के हिसाब से काम करते हैं. इसका मतलब है कि जब किसी टैब या विंडो को छोटा किया जाता है या उस टैब या विंडो से स्विच किया जाता है जहां स्क्रीन वेक लॉक की सुविधा चालू है, तो स्क्रीन वेक लॉक अपने-आप बंद हो जाएगा.

स्क्रीन वेक लॉक को फिर से पाने के लिए, visibilitychange इवेंट को सुनें और उनके होने पर, नए स्क्रीन वेक लॉक का अनुरोध करें:

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

document.addEventListener('visibilitychange', handleVisibilityChange);

सिस्टम के संसाधनों पर कम से कम असर डालना

क्या आपको अपने ऐप्लिकेशन में स्क्रीन वेक लॉक का इस्तेमाल करना चाहिए? आपके ऐप्लिकेशन के लिए कौनसी रणनीति सही है, यह उसकी ज़रूरतों पर निर्भर करता है. हालांकि, आपको अपने ऐप्लिकेशन के लिए सबसे आसान रणनीति का इस्तेमाल करना चाहिए, ताकि सिस्टम के संसाधनों पर इसका कम से कम असर पड़े.

अपने ऐप्लिकेशन में स्क्रीन वेक लॉक जोड़ने से पहले, यह देख लें कि क्या इस्तेमाल के उदाहरणों को इन वैकल्पिक समाधानों में से किसी एक से हल किया जा सकता है:

  • अगर आपका ऐप्लिकेशन लंबे समय तक डाउनलोड करता है, तो बैकग्राउंड फ़ेच का इस्तेमाल करें.
  • अगर आपका ऐप्लिकेशन किसी बाहरी सर्वर से डेटा सिंक कर रहा है, तो बैकग्राउंड सिंक का इस्तेमाल करें.

डेमो

Screen Wake Lock का डेमो और डेमो सोर्स देखें. ध्यान दें कि टैब या ऐप्लिकेशन स्विच करने पर, स्क्रीन वेक लॉक अपने-आप हट जाता है.

ओएस के टास्क मैनेजर में स्क्रीन वेक लॉक

अपने ऑपरेटिंग सिस्टम के टास्क मैनेजर का इस्तेमाल करके, यह देखा जा सकता है कि कोई ऐप्लिकेशन आपके कंप्यूटर को स्लीप मोड में जाने से रोक रहा है या नहीं. यहां दिए गए वीडियो में, macOS के Activity Monitor में दिखाया गया है कि Chrome में स्क्रीन वेक लॉक चालू है. इससे सिस्टम चालू रहता है.

सुझाव/राय दें या शिकायत करें

वेब प्लैटफ़ॉर्म इनक्यूबेटर कम्यूनिटी ग्रुप (डब्लूआईसीजी) और Chrome टीम, Screen Wake Lock API के बारे में आपके विचार और अनुभव जानना चाहती है.

हमें एपीआई डिज़ाइन के बारे में बताएं

क्या एपीआई के बारे में कुछ ऐसा है जो आपकी उम्मीद के मुताबिक काम नहीं करता? इसके अलावा, क्या आपको अपने आइडिया को लागू करने के लिए, कुछ और तरीकों या प्रॉपर्टी की ज़रूरत है?

  • Screen Wake Lock API के GitHub डेटाबेस पर स्पेसिफ़िकेशन से जुड़ी समस्या की शिकायत करें या किसी मौजूदा समस्या के बारे में अपने विचार जोड़ें.

लागू करने से जुड़ी समस्या की शिकायत करना

क्या आपको Chrome के साथ काम करने वाले किसी एक्सटेंशन में कोई गड़बड़ी मिली? या क्या लागू करने का तरीका, खास जानकारी से अलग है?

  • https://new.crbug.com पर जाकर, गड़बड़ी की रिपोर्ट करें. ज़्यादा से ज़्यादा जानकारी शामिल करें. गड़बड़ी को दोहराने के लिए आसान निर्देश दें. साथ ही, Components को Blink>WakeLock पर सेट करें.

एपीआई के लिए सहायता दिखाना

क्या आपको Screen Wake Lock API का इस्तेमाल करना है? सार्वजनिक तौर पर आपकी मदद से, Chrome टीम को सुविधाओं को प्राथमिकता देने में मदद मिलती है. साथ ही, इससे अन्य ब्राउज़र वेंडर को यह पता चलता है कि इन सुविधाओं को सपोर्ट करना कितना ज़रूरी है.

  • WICG Discourse थ्रेड पर, एपीआई का इस्तेमाल करने की अपनी योजना के बारे में बताएं.
  • @ChromiumDev को ट्वीट करें. इसके लिए, हैशटैग #WakeLock का इस्तेमाल करें. साथ ही, हमें बताएं कि इसका इस्तेमाल कहां और कैसे किया जा रहा है.

काम के लिंक

Acknowledgements

Unsplash पर केट स्टोन मैथेसन की हीरो इमेज. टास्क मैनेजर का वीडियो, हेनरी लिम ने उपलब्ध कराया है.