WebAPK ใน Android

เมื่อผู้ใช้เพิ่ม Progressive Web App ลงในหน้าจอหลักบน Android แล้ว Chrome จะสร้าง APK ให้คุณโดยอัตโนมัติ ซึ่งบางครั้งเราเรียกว่า WebAPK การติดตั้งผ่าน APK จะทำให้แอปของคุณปรากฏใน App Launcher, ในการตั้งค่าแอปของ Android และลงทะเบียนชุดตัวกรอง Intent ได้

Pete LePage

การติดตั้ง PWA ใน Android ไม่ได้เป็นเพียงการเพิ่ม Progressive Web App ลงในหน้าจอหลักของผู้ใช้ Chrome จะสร้างและติดตั้ง APK พิเศษของแอปโดยอัตโนมัติ บางครั้งเราเรียกสิ่งนี้ว่า WebAPK การติดตั้งผ่าน APK จะทำให้แอปของคุณปรากฏใน App Launcher, ในการตั้งค่าแอปของ Android และลงทะเบียนชุดตัวกรอง Intent ได้

Chrome จะดูไฟล์ Manifest ของเว็บแอปและข้อมูลเมตาอื่นๆ เพื่อสร้าง WebAPK เมื่อตรวจพบการอัปเดตไฟล์ Manifest แล้ว Chrome จะต้องสร้าง APK ใหม่

ตัวกรอง Intent ของ Android

เมื่อติดตั้ง Progressive Web App ใน Android ระบบจะลงทะเบียนชุดตัวกรอง Intent สำหรับ URL ทั้งหมดภายในขอบเขตของแอป เมื่อผู้ใช้คลิกลิงก์ที่อยู่ในขอบเขตของแอป แอปจะเปิดขึ้นแทนที่จะเปิดในแท็บเบราว์เซอร์

ลองพิจารณา manifest.json บางส่วนต่อไปนี้

"start_url": "/",
"display": "standalone",

เมื่อเปิดเว็บแอปที่ใช้จากตัวเปิดแอป แอปจะเปิดขึ้นhttps://example.com/เป็นแอปแบบสแตนด์อโลนโดยไม่มี Chrome ของเบราว์เซอร์

WebAPK จะมีตัวกรอง Intent ต่อไปนี้

<intent-filter>
  <action android:name="android.intent.action.VIEW" />
  <category android:name="android.intent.category.DEFAULT" />
  <category android:name="android.intent.category.BROWSABLE" />
  <data
    android:scheme="https"
    android:host="example.com"
    android:pathPrefix="/" />
</intent-filter>

หากผู้ใช้คลิกลิงก์ภายในแอปที่ติดตั้งเพื่อไปที่https://example.com/read อินเทนต์จะจับลิงก์นั้นและเปิดใน Progressive Web App

การใช้ scope เพื่อจํากัดตัวกรอง Intent

หากไม่ต้องการให้ Progressive Web App จัดการ URL ทั้งหมดภายในเว็บไซต์ ให้เพิ่มพร็อพเพอร์ตี้ scope ลงในไฟล์ Manifest ของเว็บแอป พร็อพเพอร์ตี้ scope จะบอกให้ Android เปิดเว็บแอปของคุณก็ต่อเมื่อ URL ตรงกับ origin + scope ซึ่งจะช่วยให้คุณควบคุมได้ว่าแอปจะจัดการ URL ใดและ URL ใดควรเปิดในเบราว์เซอร์ ซึ่งจะเป็นประโยชน์เมื่อคุณมีแอปและเนื้อหาอื่นๆ ที่ไม่ใช่แอปในโดเมนเดียวกัน

ลองพิจารณา manifest.json บางส่วนต่อไปนี้

"scope": "/app/",
"start_url": "/app/",
"display": "standalone",

เมื่อเปิดจากตัวเปิดแอป แอปจะเปิดhttps://example.com/app/ เป็นแอปแบบสแตนด์อโลนโดยไม่มี Chrome ของเบราว์เซอร์

เช่นเดียวกับก่อนหน้านี้ WebAPK ที่สร้างขึ้นจะรวมตัวกรอง Intent แต่มีแอตทริบิวต์ android:pathPrefix อื่นใน AndroidManifest.xml ของ APK ดังนี้

<intent-filter>
  <action android:name="android.intent.action.VIEW" />
  <category android:name="android.intent.category.DEFAULT" />
  <category android:name="android.intent.category.BROWSABLE" />
  <data
    android:scheme="https"
    android:host="example.com"
    android:pathPrefix="/app/" />
</intent-filter>

มาดูตัวอย่างกันสักเล็กน้อย

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

การจัดการสิทธิ์

สิทธิ์จะทำงานในลักษณะเดียวกับเว็บแอปอื่นๆ และไม่สามารถขอสิทธิ์ได้เมื่อติดตั้ง แต่ต้องขอเมื่อรันไทม์ โดยควรขอเฉพาะเมื่อคุณจําเป็นต้องใช้เท่านั้น เช่น อย่าขอสิทธิ์กล้องเมื่อโหลดครั้งแรก แต่ให้รอจนกว่าผู้ใช้จะพยายามถ่ายรูป

การจัดการพื้นที่เก็บข้อมูลและสถานะแอป

แม้ว่า Progressive Web App จะติดตั้งผ่าน APK แต่ Chrome จะใช้โปรไฟล์ปัจจุบันในการเก็บข้อมูลทั้งหมดและจะไม่มีการแยกออก ซึ่งช่วยให้เบราว์เซอร์และแอปที่ติดตั้งไว้แชร์ประสบการณ์การใช้งานร่วมกันได้ คุกกี้จะแชร์และใช้งานได้ เข้าถึงพื้นที่เก็บข้อมูลฝั่งไคลเอ็นต์ได้ และติดตั้ง Service Worker ไว้พร้อมใช้งาน

การอัปเดต WebAPK

ข้อมูลเกี่ยวกับวิธีอัปเดต WebAPK ได้ย้ายไปที่หัวข้อวิธีที่ Chrome จัดการการอัปเดตไฟล์ Manifest ของเว็บแอป

คำถามที่พบบ่อย

มีการใช้ไอคอนใดในการสร้างหน้าจอแนะนำ :

เราขอแนะนำให้คุณใส่ไอคอนอย่างน้อย 2 ไอคอน ได้แก่ 192px และ 512px สำหรับหน้าจอแนะนำ เราทราบมาว่าไอคอนในหน้าจอแนะนำมีขนาดเล็กเกินไป WebAPK ที่สร้างขึ้นใน Chrome 71 ขึ้นไปจะแสดงไอคอนขนาดใหญ่ขึ้นในหน้าจอแนะนำ คุณไม่ต้องดำเนินการใดๆ ตราบใดที่มีไอคอนที่แนะนำ

จะเกิดอะไรขึ้นหากผู้ใช้ติดตั้งแอปเนทีฟสําหรับเว็บไซต์ไว้แล้ว

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

ระบบจะล้างพื้นที่เก็บข้อมูลของเว็บไซต์ที่ติดตั้งไว้ไหมหากผู้ใช้ล้างแคชของ Chrome

ได้

ระบบจะติดตั้งแอปของฉันอีกครั้งไหมเมื่อฉันได้อุปกรณ์ใหม่

ยังทำไม่ได้ในตอนนี้ แต่เราคิดว่านี่เป็นพื้นที่สำคัญและกำลังหาวิธีทำให้ใช้งานได้

ระบบจัดการสิทธิ์อย่างไร จะเห็นข้อความแจ้งของ Chrome หรือของ Android ไหม

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

ฟีเจอร์นี้ใช้ได้กับ Android เวอร์ชันใดบ้าง

Progressive Web App ติดตั้งได้ใน Android ทุกเวอร์ชันที่ใช้ Chrome สำหรับ Android โดยเฉพาะ Jelly Bean ขึ้นไป

มีการใช้ WebView หรือไม่

ไม่ เว็บไซต์จะเปิดใน Chrome เวอร์ชันที่ผู้ใช้เพิ่มเว็บไซต์

เราอัปโหลด APK ที่สร้างขึ้นไปยัง Play Store ได้ไหม

ไม่ได้ หากต้องการอัปโหลด APK ของคุณเอง โปรดดูกิจกรรมบนเว็บที่เชื่อถือได้

รายการเหล่านี้แสดงใน Play Store ไหม

ไม่ได้ หากต้องการอัปโหลด APK ของคุณเองเพื่อแสดงใน Play Store โปรดดูกิจกรรมบนเว็บที่เชื่อถือได้

ฉันเป็นนักพัฒนาเบราว์เซอร์อื่นบน Android ฉันสามารถดำเนินการติดตั้งที่ราบรื่นนี้ได้ไหม :

เรากำลังดำเนินการอยู่ เรามุ่งมั่นที่จะทำให้ฟีเจอร์นี้พร้อมให้บริการแก่เบราว์เซอร์ทั้งหมดใน Android และจะมีรายละเอียดเพิ่มเติมในเร็วๆ นี้