आइडल डिटेक्शन एपीआई की मदद से, इनऐक्टिव उपयोगकर्ताओं का पता लगाएं

Thomas Steiner

पब्लिश करने की तारीख: 18 मई, 2020

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

कुछ समय से इस्तेमाल न होने का पता लगाने वाले एपीआई के इस्तेमाल के सुझाव

इस एपीआई का इस्तेमाल करने वाली साइटों के उदाहरण:

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

एपीआई का इस्तेमाल करना

यह देखने के लिए कि Idle Detection API काम करता है या नहीं, इसका इस्तेमाल करें:

if ('IdleDetector' in window) {
  // Idle Detector API supported
}

एपीआई के कॉन्सेप्ट

Idle Detection API यह मानता है कि उपयोगकर्ता, उपयोगकर्ता एजेंट (यानी कि ब्राउज़र), और इस्तेमाल किए जा रहे डिवाइस के ऑपरेटिंग सिस्टम के बीच किसी न किसी लेवल पर जुड़ाव है. इसे दो डाइमेंशन में दिखाया गया है:

• उपयोगकर्ता की निष्क्रिय स्थिति: active या idle: उपयोगकर्ता ने कुछ समय से उपयोगकर्ता एजेंट के साथ इंटरैक्ट किया है या नहीं.
• स्क्रीन की निष्क्रिय स्थिति: locked या unlocked: सिस्टम में स्क्रीन लॉक (जैसे कि स्क्रीन सेवर) चालू है. इससे उपयोगकर्ता एजेंट के साथ इंटरैक्ट नहीं किया जा सकता.

active और idle के बीच अंतर करने के लिए, अनुमान लगाने के तरीके की ज़रूरत होती है. यह तरीका, उपयोगकर्ता, उपयोगकर्ता एजेंट, और ऑपरेटिंग सिस्टम के हिसाब से अलग-अलग हो सकता है. यह थ्रेशोल्ड भी काफ़ी हद तक कम होना चाहिए (सुरक्षा और अनुमतियां देखें).

मॉडल, किसी खास कॉन्टेंट (यानी कि एपीआई का इस्तेमाल करने वाले टैब में मौजूद वेबपेज), पूरे उपयोगकर्ता एजेंट या ऑपरेटिंग सिस्टम के साथ इंटरैक्शन के बीच अंतर नहीं करता है. यह तय करने का काम उपयोगकर्ता एजेंट का होता है.

अनुमतियों का अनुरोध करना और इंस्टैंटिएट करना

Idle Detection API का इस्तेमाल करते समय, सबसे पहले यह पक्का करना ज़रूरी है कि 'idle-detection' अनुमति दी गई हो. अगर अनुमति नहीं दी जाती है, तो आपको IdleDetector.requestPermission() से अनुमति का अनुरोध करना होगा. ध्यान दें कि इस तरीके को कॉल करने के लिए, उपयोगकर्ता के ऐक्शन की ज़रूरत होती है.

// Make sure 'idle-detection' permission is granted.
const state = await IdleDetector.requestPermission();
if (state !== 'granted') {
  // Need to request permission first.
  return console.log('Idle detection permission not granted.');
}

इसके बाद, दूसरा चरण IdleDetector को इंस्टैंशिएट करना है. कम से कम threshold, 60,000 मिलीसेकंड (1 मिनट) है. आखिर में, IdleDetector के start() तरीके को कॉल करके, उपयोगकर्ता की गतिविधि का पता लगाने की सुविधा शुरू की जा सकती है. यह पैरामीटर के तौर पर, मिलीसेकंड में threshold के साथ एक ऑब्जेक्ट लेता है. साथ ही, AbortSignal के साथ एक वैकल्पिक signal लेता है, ताकि आइडल का पता लगाने की प्रोसेस को रोका जा सके.

try {
  const controller = new AbortController();
  const signal = controller.signal;

  const idleDetector = new IdleDetector();
  idleDetector.addEventListener('change', () => {
    const userState = idleDetector.userState;
    const screenState = idleDetector.screenState;
    console.log(`Idle change: ${userState}, ${screenState}.`);
  });

  await idleDetector.start({
    threshold: 60000,
    signal,
  });
  console.log('IdleDetector is active.');
} catch (err) {
  // Deal with initialization errors like permission denied,
  // running outside of top-level frame, etc.
  console.error(err.name, err.message);
}

डिवाइस के इस्तेमाल न होने की स्थिति का पता लगाने की सुविधा बंद करना

AbortController के abort() तरीके को कॉल करके, उपयोगकर्ता की गतिविधि का पता लगाने की सुविधा को बंद किया जा सकता है.

controller.abort();
console.log('IdleDetector is stopped.');

DevTools की सहायता टीम

आपके पास DevTools में आइडल इवेंट का सिम्युलेशन करने का विकल्प होता है. इसके लिए, आपको कुछ भी नहीं करना होता. DevTools में, Sensors टैब खोलें और Emulate Idle Detector state को ढूंढें. वीडियो में अलग-अलग विकल्प देखे जा सकते हैं.

कठपुतली बनाने वाले लोगों के लिए सहायता

Puppeteer के वर्शन 5.3.1 से, अलग-अलग आइडल स्टेट का इस्तेमाल किया जा सकता है. इससे प्रोग्राम के हिसाब से यह जांच की जा सकती है कि आपके वेब ऐप्लिकेशन का व्यवहार कैसे बदलता है.

डेमो

Ephemeral Canvas के डेमो में, Idle Detection API को काम करते हुए देखा जा सकता है. यह 60 सेकंड तक कोई गतिविधि न होने पर, अपने कॉन्टेंट को मिटा देता है. मान लें कि इसे किसी डिपार्टमेंटल स्टोर में बच्चों के लिए उपलब्ध कराया गया है, ताकि वे इस पर डूडल बना सकें.

पॉलीफ़िल

Idle Detection API के कुछ पहलुओं को पॉलीफ़िल किया जा सकता है. साथ ही, idle.ts जैसी आइडल डिटेक्शन लाइब्रेरी मौजूद हैं. हालांकि, ये तरीके वेब ऐप्लिकेशन के कॉन्टेंट एरिया तक ही सीमित हैं: वेब ऐप्लिकेशन के कॉन्टेक्स्ट में चलने वाली लाइब्रेरी को इनपुट इवेंट के लिए बार-बार पोल करना पड़ता है या विज़िबिलिटी में होने वाले बदलावों को सुनना पड़ता है. हालांकि, लाइब्रेरी यह नहीं बता सकती कि उपयोगकर्ता कब कॉन्टेंट एरिया से बाहर जाता है. जैसे, जब कोई उपयोगकर्ता किसी दूसरे टैब पर होता है या अपने कंप्यूटर से लॉग आउट हो जाता है.

सुरक्षा और अनुमतियां

Chrome टीम ने Idle Detection API को डिज़ाइन और लागू किया है. इसके लिए, वेब प्लैटफ़ॉर्म की बेहतर सुविधाओं का ऐक्सेस कंट्रोल करना में बताए गए मुख्य सिद्धांतों का इस्तेमाल किया गया है. इनमें उपयोगकर्ता का कंट्रोल, पारदर्शिता, और एर्गोनॉमिक्स शामिल हैं. इस एपीआई का इस्तेमाल करने की सुविधा को 'idle-detection' अनुमति से कंट्रोल किया जाता है. एपीआई का इस्तेमाल करने के लिए, ऐप्लिकेशन को टॉप-लेवल के सुरक्षित कॉन्टेक्स्ट में भी चलना चाहिए.

उपयोगकर्ता के कंट्रोल और निजता से जुड़ी सेटिंग

हम हमेशा नुकसान पहुंचाने वाले लोगों या इकाइयों को नए एपीआई का गलत इस्तेमाल करने से रोकना चाहते हैं. ऐसा हो सकता है कि दिखने में अलग-अलग वेबसाइटें, एक ही इकाई के कंट्रोल में हों. ऐसी वेबसाइटें, उपयोगकर्ता की निष्क्रियता की जानकारी इकट्ठा कर सकती हैं. साथ ही, अलग-अलग ऑरिजिन के यूनीक उपयोगकर्ताओं की पहचान करने के लिए, डेटा को आपस में जोड़ सकती हैं. इस तरह के हमलों को कम करने के लिए, Idle Detection API, रिपोर्ट किए गए निष्क्रिय इवेंट की जानकारी को सीमित करता है.

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

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

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

क्या आपको Chrome के साथ काम करने में कोई गड़बड़ी मिली? या क्या लागू करने का तरीका, स्पेसिफ़िकेशन से अलग है? new.crbug.com पर जाकर, गड़बड़ी की शिकायत करें. इसमें ज़्यादा से ज़्यादा जानकारी शामिल करें. साथ ही, गड़बड़ी को दोहराने के लिए आसान निर्देश दें. इसके अलावा, कॉम्पोनेंट बॉक्स में Blink>Input डालें.

एपीआई के लिए अपना सपोर्ट दिखाना

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

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

काम के लिंक

• लोगों को जानकारी देने की सुविधा
• ड्राफ़्ट स्पेसिफ़िकेशन
• Idle Detection API का डेमो | Idle Detection API के डेमो का सोर्स
• ट्रैकिंग बग
• ChromeStatus.com एंट्री
• Blink कॉम्पोनेंट: Blink>Input

Acknowledgements

कुछ समय से इस्तेमाल न होने का पता लगाने वाले एपीआई को सैम गोटो ने लागू किया था. DevTools के साथ काम करने की सुविधा को मैक्सिम सैडिम ने जोड़ा था. समीक्षा करने के लिए जो मेडली, केसी बास्क, और रेली ग्रांट का धन्यवाद.