להשתמש ב-Screen Wake Lock API כדי להישאר במצב ער

ממשק Screen Wake Lock API מספק דרך למנוע ממכשירים לעמעם או לנעול את המסך כשיש צורך שאפליקציה תמשיך לפעול.

Pete LePage
Thomas Steiner

מה זה Screen Wake Lock API?

כדי למנוע שחיקה של הסוללה, רוב המכשירים עוברים למצב שינה במהירות כשהם לא בשימוש. ברוב המקרים זה בסדר, אבל אפליקציות מסוימות צריכות להשאיר את המסך במצב פעיל כדי להשלים את הפעולה. דוגמאות לכך הן אפליקציות בישול שמציגות את השלבים של מתכון, או משחקים כמו Ball Puzzle שמשתמשים בממשקי ה-API של תנועת המכשיר לצורך קלט.

Screen Wake Lock API מספק דרך למנוע מהמכשיר לעמעם את המסך ולנעול אותו. היכולת הזו מאפשרת לכם ליהנות מחוויית שימוש חדשה, שלפני כן נדרשה לה אפליקציה ספציפית לפלטפורמה.

ה-Screen Wake Lock API מפחית את הצורך בדרכים חלופיות לא יעילות שעלולות לצרוך הרבה חשמל. הוא פותר את הבעיות של ממשק 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. הודעת החריגה תכלול פרטים נוספים במקרה של כשל.

שחרור של נעילה מצב שינה במסך

נדרשת גם דרך לשחרור הנעילה של המסך במצב שינה, שניתנת באמצעות קריאה ל-method release() של האובייקט WakeLockSentinel. אם לא שומרים הפניה ל-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 בהתחלה, והוא משתנה ל-true אחרי שאירוע "release" נשלח. הנכס הזה עוזר למפתחי אתרים לדעת מתי נעילת ה-lock נפתחה, כדי שלא יצטרכו לעקוב אחרי זה באופן ידני. התכונה זמינה החל מגרסה 87 של Chrome.

מחזור החיים של חסימת מצב שינה במסך

כשמשתמשים בהדגמה של נעילת מסך, אפשר לראות שנעילות מסך רגישות למידת החשיפה של הדף. כלומר, נעילה של מסך במצב שינה תבוטל באופן אוטומטי כשמזערים כרטיסייה או חלון, או עוברים מכרטיסייה או מחלון שבהם נעילה של מסך במצב שינה פעילה.

כדי לקבל מחדש את נעילת מצב השינה במסך, צריך להאזין לאירוע visibilitychange ולבקש נעילת מצב שינה במסך חדשה כשהאירוע מתרחש:

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

document.addEventListener('visibilitychange', handleVisibilityChange);

צמצום ההשפעה על משאבי המערכת

האם כדאי להשתמש באפליקציה שלכם בנעילת מסך להפעלה? הגישה שלכם תלויה בצרכים של האפליקציה. עם זאת, מומלץ להשתמש בגישה הקלה ביותר האפשרית לאפליקציה כדי למזער את ההשפעה שלה על משאבי המערכת.

לפני שמוסיפים לאפליקציה נעילה של מצב שינה במסך, כדאי לבדוק אם אפשר לפתור את הבעיה בתרחישים לדוגמה באמצעות אחד מהפתרונות החלופיים הבאים:

  • אם האפליקציה מבצעת הורדות ממושכות, כדאי להשתמש באחזור ברקע.
  • אם האפליקציה מסנכרנת נתונים משרת חיצוני, כדאי להשתמש בסנכרון ברקע.

הדגמה (דמו)

צפייה בהדגמה של נעילת המסך במצב שינה ובמקור ההדגמה. שימו לב שהנעילה של המסך לטלטלה משוחררת באופן אוטומטי כשעוברים בין כרטיסיות או אפליקציות.

חסימות מצב שינה במסך במנהל המשימות של מערכת ההפעלה

תוכלו להשתמש במנהל המשימות של מערכת ההפעלה כדי לבדוק אם אפליקציה מונעת מהמחשב לעבור למצב שינה. בסרטון הבא מוצג Activity Monitor ב-macOS, שמציין של-Chrome יש נעילה פעילה של מסך ההתעוררות ששומרת על פעילות המערכת.

משוב

קבוצת הקהילה של Web Platform Incubator (WICG) וצוות Chrome רוצים לשמוע את המחשבות והחוויות שלכם לגבי Screen Wake Lock API.

תיאור של עיצוב ה-API

האם יש משהו ב-API שלא פועל כצפוי? או שאולי חסרות שיטות או מאפיינים שדרושים לכם כדי להטמיע את הרעיון?

דיווח על בעיה בהטמעה

מצאתם באג בהטמעה של Chrome? או שההטמעה שונה מהמפרט?

  • שולחים דיווח על באג בכתובת https://new.crbug.com. חשוב לכלול כמה שיותר פרטים, לספק הוראות פשוטות לשחזור הבאג ולהגדיר את Components לערך Blink>WakeLock. Glitch הוא כלי מצוין לשיתוף שחזור מהיר וקל של באגים.

תמיכה ב-API

אתם מתכננים להשתמש ב-Screen Wake Lock API? התמיכה הציבורית שלכם עוזרת לצוות Chrome לתת עדיפות לתכונות, ומראה לספקי דפדפנים אחרים כמה חשוב לתמוך בהם.

  • תוכלו לשתף את האופן שבו אתם מתכננים להשתמש ב-API בשרשור השיחה של WICG.
  • אתם יכולים לשלוח ציוץ אל @ChromiumDev בעזרת ה-hashtag #WakeLock ולספר לנו איפה אתם משתמשים בו ואיך אתם משתמשים בו.

קישורים שימושיים

תודות

תמונה ראשית (Hero) מאת Katestone Matheson בתוכנית Un קבלת השראה. סרטון של מנהל המשימות באדיבות הנרי לים.