หน้าออฟไลน์พื้นฐานสำหรับเว็บแอปใน Chrome Android

คุณสามารถเปิดใช้แอปแพลตฟอร์มที่ติดตั้งไว้ได้แม้จะออฟไลน์อยู่ก็ตาม ในกรณีนี้ มักจะมีหน้าเว็บที่แจ้งให้ผู้ใช้ทราบว่าไม่สามารถเข้าถึงอินเทอร์เน็ตได้ นักพัฒนาแอปบางรายยังสร้างชุดฟีเจอร์แบบเต็มที่ใช้ได้ขณะออฟไลน์ด้วย

สำหรับเว็บแอป ความสามารถในการทำงานแบบออฟไลน์เป็นฟีเจอร์ที่เพิ่งเปิดตัวเมื่อไม่นานมานี้ โดยเป็นไปได้ด้วยการเปิดตัว Service Worker API นอกจากนี้ เมื่อเว็บไซต์สามารถติดตั้งได้ PWA ได้เพิ่มข้อกำหนดในการลงทะเบียน Service Worker และใช้เมธอด fetch() เพื่อให้ติดตั้งเว็บแอปได้ แนวคิดนี้มีขึ้นเพื่อกระตุ้นให้นักพัฒนาแอปแจ้งให้ผู้ใช้ทราบอย่างน้อยว่าขณะนี้แอปไม่สามารถใช้งานได้

ตอนนี้ผู้พัฒนาไม่จำเป็นต้องดำเนินการใดๆ เพื่อรับหน้าออฟไลน์เริ่มต้น ตั้งแต่ Chrome 109 ใน Android เป็นต้นไป เบราว์เซอร์จะสร้างหน้าเว็บโดยอัตโนมัติเพื่อให้ผู้ใช้ทราบเมื่อออฟไลน์

หากแอปไม่ได้ใช้ประสบการณ์การใช้งานออฟไลน์ที่กำหนดเอง เมื่อผู้ใช้ออฟไลน์ หน้าออฟไลน์เริ่มต้นจะใช้ไอคอนของแอปและข้อความ คุณออฟไลน์อยู่ อย่างง่าย เช่น ตัวอย่างด้านล่าง

หน้าออฟไลน์เริ่มต้นสำหรับเว็บแอปตัวอย่าง ซึ่งมีโลโก้เป็นวงกลมสีชมพูและเครื่องหมายบวก 2 อัน และมีข้อความ "คุณออฟไลน์อยู่"

ตัวเลือกในการสร้างหน้าออฟไลน์ที่กำหนดเองยังคงใช้งานได้ วิดีโอต่อไปนี้แสดงวิธีแสดงหน้าเว็บที่กำหนดเองโดยใช้ Workbox ด้วยโค้ดบรรทัดเดียว

ฟีเจอร์นี้พร้อมให้บริการในสภาพแวดล้อม Android (Chrome 109) และเดสก์ท็อป (Chrome 110) หากต้องการแสดงความคิดเห็น โปรดส่งผ่านแบบฟอร์มนี้

รูปภาพโดย Sten Ritterfeld บน Unsplash