להשתמש ב-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 Guard, היה תרחיש שימוש מושלם (למרות שהוא כבר לא זמין). האפליקציה לוקחת אתכם לסיור אודיו וירטואלי בריו, במסלול של שנת 2016. מרתון אולימפי. ללא חסימות מצב שינה, המסכים יכבו לעתים קרובות בזמן שהסיור מופעל, ולכן קשה להשתמש בה.

כמובן, יש עוד הרבה שימושים אחרים:

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

הסטטוס הנוכחי

שלב סטטוס
1. יצירת הסבר לא רלוונטי
2. יצירת טיוטה ראשונית של מפרט הושלם
3. קבלת משוב ושימוש בתכנון חוזר הושלם
4. גרסת מקור לניסיון התשובה מלאה
5. הפעלה הושלם

שימוש ב-Screen Wake Lock API

סוגים של חסימות מצב שינה

נכון לעכשיו, Screen Wake Lock API מספק רק סוג אחד של נעילת מצב שינה: screen.

screen חסימה של מצב שינה

התכונה 'נעילת מצב שינה' ב-screen מונעת ממסך המכשיר להסתובב מושבתת כדי שהמשתמש יוכל לראות את המידע שמוצג במסך.

קבלת נעילת מסך במצב שינה

כדי לבקש נעילת מסך במצב שינה, עליך להפעיל את השיטה navigator.wakeLock.request() שמחזירה אובייקט WakeLockSentinel. מעבירים לשיטה הזו את הסוג הרצוי של חסימת מצב שינה כפרמטר, שכרגע מוגבל ל-'screen' בלבד ולכן הוא אופציונלי. הדפדפן יכול לדחות את הבקשה מסיבות שונות (למשל, כי רמת הטעינה של הסוללה נמוכה מדי), ולכן כדאי לרכז את השיחה במשפט try…catch. ההודעה של החריגה תכיל פרטים נוספים במקרה של כשל.

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

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

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

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

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

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

document.addEventListener('visibilitychange', handleVisibilityChange);

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

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

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

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

הדגמה (דמו)

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

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

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

משוב

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

מתארים את עיצוב ה-API

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

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

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

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

הצגת תמיכה ב-API

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

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

אישורים

תמונה ראשית (Hero) מאת Katestone Matheson משתתף ב-Unbounce. הסרטון של מנהל המשימות באדיבות הנרי לים.