WebAPK ใน Android

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

Pete LePage

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

ในการ สร้าง WebAPK Chrome จะดูที่ไฟล์ Manifest ของเว็บแอปและข้อมูลเมตาอื่นๆ เมื่อตรวจพบการอัปเดตไฟล์ 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 ระบบจะตรวจจับลิงก์นั้นโดย Intent และเปิดใน Progressive Web App

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

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

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

ควรทำ

https://example.com/app/ - ภายใน /app/

ควรทำ

https://example.com/app/read/book - ภายใน /app/

ไม่ควรทำ

https://example.com/help/ - ไม่อยู่ใน /app/

ไม่ควรทำ

https://example.com/about/ - ไม่อยู่ใน /app/

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

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

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

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

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

การอัปเดต 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 และเราจะมีรายละเอียดเพิ่มเติมในเร็วๆ นี้