ทำให้การใช้งาน WebView ง่ายขึ้นด้วย Jetpack Webkit

คู่มือนี้อธิบายถึงประโยชน์ของไลบรารี Jetpack Webkit, วิธีการทำงาน และวิธีนำไปใช้ในโปรเจ็กต์

ภาพรวม

WebView เป็นส่วนสำคัญของการพัฒนา Android แต่บางครั้งก็จัดการได้ยากเนื่องจากฟีเจอร์ใน Android OS เวอร์ชันต่างๆ ไม่สอดคล้องกัน Android OS แต่ละเวอร์ชันมีชุด API ของ WebView ที่กำหนดไว้ เนื่องจาก Android มีการเผยแพร่ช้ากว่า WebView API ของ Android จึงอาจ ไม่ครอบคลุมฟีเจอร์ WebView ที่พร้อมใช้งานทั้งหมด ซึ่งจะทำให้การเปิดตัวฟีเจอร์ช้าลง และมีค่าใช้จ่ายในการทดสอบเพิ่มขึ้น

Jetpack Webkit แก้ปัญหาเหล่านี้ด้วยการทำหน้าที่เป็นเลเยอร์ความเข้ากันได้และ ใช้ประโยชน์จาก APK ของ WebView ที่อัปเดตล่าสุดในอุปกรณ์ของผู้ใช้ นอกจากนี้ยังมี API ใหม่ และทันสมัยที่พร้อมให้บริการในไลบรารีนี้เท่านั้น

เหตุผลที่ควรใช้ Jetpack Webkit

นอกจากจะมีความเข้ากันได้ข้ามเวอร์ชันแล้ว Jetpack Webkit ยังมี API ใหม่และทันสมัยที่ช่วยลดความซับซ้อนในการพัฒนาและปรับปรุงฟังก์ชันการทำงานของแอป ด้วย

  • เปิดใช้การตรวจสอบสิทธิ์แบบใหม่: WebView สามารถจัดการมาตรฐานการตรวจสอบสิทธิ์ผ่านเว็บสมัยใหม่ เช่น WebAuthn ได้อย่างราบรื่น ซึ่งช่วยให้ลงชื่อเข้าใช้ด้วยพาสคีย์ได้ ไลบรารี androidx.webkit ช่วยให้คุณควบคุมการผสานรวมนี้ได้อย่างเต็มที่ โดยใช้วิธี WebSettingsCompat.setWebAuthenticationSupport() ซึ่ง คุณสามารถใช้เพื่อกำหนดค่าระดับการสนับสนุนที่แอปต้องการได้

  • ปรับปรุงประสิทธิภาพ: ปรับแต่งประสิทธิภาพของ WebView สำหรับกรณีการใช้งานของแอปโดยใช้ API เช่น prefetchUrlAsync, prerenderUrlAsync และ setBackForwardCacheEnabled

  • เพิ่มเสถียรภาพ: กู้คืนกระบวนการแสดงผลที่หยุดชะงักหรือไม่ตอบสนอง โดยไม่ทำให้เกิดข้อขัดข้อง ดูข้อมูลเพิ่มเติมได้ที่ WebViewRenderProcess#terminate()

  • ให้การควบคุมแบบละเอียดเกี่ยวกับข้อมูลการท่องเว็บ: หากต้องการลบข้อมูลการท่องเว็บที่ WebView จัดเก็บไว้สำหรับต้นทางที่เฉพาะเจาะจง ให้ใช้คลาส WebStorageCompat

ทำความเข้าใจคอมโพเนนต์

หากต้องการใช้ Jetpack Webkit อย่างมีประสิทธิภาพ คุณต้องเข้าใจความสัมพันธ์ระหว่างคอมโพเนนต์ต่อไปนี้

  • Android System WebView: นี่คือเครื่องมือการแสดงผลที่อิงตาม Chromium ซึ่ง Google อัปเดตเป็นประจำผ่าน Google Play Store ในช่วงเวลาเดียวกันกับ Chrome ซึ่งมีฟีเจอร์ล่าสุดและมีโค้ดการใช้งานพื้นฐานสำหรับ WebView API ทั้งหมด

  • Framework APIs (android.webkit): API เหล่านี้เป็น API ที่แก้ไขใน Android OS เวอร์ชันหนึ่งๆ ตัวอย่างเช่น แอปใน Android 10 จะเข้าถึงได้เฉพาะ API ที่พร้อมใช้งานเมื่อเปิดตัวเวอร์ชันนั้น จึงไม่สามารถใช้ ฟีเจอร์ใหม่ที่เพิ่มลงใน APK ของ WebView ในการอัปเดตล่าสุดได้ เช่น หากต้องการ รับแฮนเดิลของโปรแกรมแสดงผลที่ไม่ตอบสนองด้วย WebView#getWebViewRenderProcess() คุณจะเรียกใช้ได้เฉพาะใน Android 10 ขึ้นไป

  • ไลบรารี Jetpack Webkit (androidx.webkit): นี่คือไลบรารีขนาดเล็ก ที่รวมอยู่ในแอปพลิเคชันของคุณ ไลบรารีนี้ทำหน้าที่เป็นสะพานที่เรียกใช้ APK ของ WebView แทนที่จะเรียกใช้ API ที่กำหนดไว้ในแพลตฟอร์ม Android ซึ่งมีเวอร์ชันของระบบปฏิบัติการที่แน่นอน ด้วยวิธีนี้ แม้ว่าจะมีการติดตั้งแอปพลิเคชันในอุปกรณ์ที่ใช้ระบบปฏิบัติการเวอร์ชันเก่ากว่า เช่น Android 10 แต่แอปพลิเคชันก็ยังใช้ฟีเจอร์ WebView ล่าสุดได้ เช่น WebViewCompat.getWebViewRenderProcess() ทำงานคล้ายกับ Framework API แต่สามารถเรียกใช้ในระบบปฏิบัติการทุกเวอร์ชันก่อน Android 10 ได้ด้วย

หาก API พร้อมใช้งานทั้งในเฟรมเวิร์กและ Jetpack Webkit เราขอแนะนำ ให้คุณเลือกเวอร์ชัน Jetpack Webkit ซึ่งจะช่วยให้มั่นใจได้ว่า ลักษณะการทำงานและความเข้ากันได้จะสอดคล้องกันในอุปกรณ์ที่หลากหลายที่สุด

การโต้ตอบระหว่าง Jetpack Webkit กับ APK

API ใน Jetpack Webkit มีการติดตั้งใช้งาน 2 ส่วน ดังนี้

  • Jetpack Webkit แบบคงที่: ไลบรารี Jetpack Webkit แบบคงที่ประกอบด้วย โค้ดส่วนน้อยที่รับผิดชอบในการติดตั้งใช้งาน API

  • APK ของ WebView: APK ของ WebView มีโค้ดส่วนใหญ่

แอปของคุณเรียกใช้ Jetpack Webkit API ซึ่งจะเรียกใช้ WebView APK

แม้ว่าคุณจะควบคุมเวอร์ชัน Jetpack Webkit ในแอปได้ แต่ก็ไม่สามารถควบคุมการอัปเดต APK ของ WebView ในอุปกรณ์ของผู้ใช้ได้ โดยทั่วไป ผู้ใช้ส่วนใหญ่จะใช้ APK ของ WebView เวอร์ชันล่าสุด แต่แอปของคุณยังคงต้องระมัดระวังไม่เรียกใช้ API ที่ APK ของ WebView เวอร์ชันนั้นไม่รองรับ

นอกจากนี้ Jetpack Webkit ยังช่วยลดความจำเป็นในการตรวจสอบเวอร์ชัน WebView ด้วยตนเอง หากต้องการดูว่าฟีเจอร์พร้อมใช้งานหรือไม่ ให้ตรวจสอบค่าคงที่ของฟีเจอร์ เช่น WebViewFeature.WEB_AUTHENTICATION

วิธีการทำงานร่วมกัน

Jetpack Webkit ช่วยลดช่องว่างระหว่าง Framework API แบบคงที่กับ WebView APK ที่อัปเดตบ่อย เมื่อใช้ Jetpack Webkit API กับรูปแบบการตรวจหาฟีเจอร์ ไลบรารีจะตรวจสอบว่า APK ของ WebView ที่ติดตั้งในอุปกรณ์ของผู้ใช้รองรับฟีเจอร์ดังกล่าวหรือไม่ ซึ่งจะช่วยให้คุณ ไม่ต้องตรวจสอบเวอร์ชันของระบบปฏิบัติการ (เฟรมเวิร์ก) Android

หาก APK ของ WebView เป็นเวอร์ชันล่าสุด ไลบรารีจะเรียกใช้ฟีเจอร์ หากไม่เป็นเช่นนั้น ระบบจะรายงานว่าฟีเจอร์นี้ไม่พร้อมใช้งาน ซึ่งจะป้องกันไม่ให้แอปของคุณ ขัดข้องและช่วยให้คุณรับมือกับสถานการณ์ได้อย่างราบรื่น

เปรียบเทียบ Jetpack Webkit กับ Framework API

ส่วนนี้จะเปรียบเทียบวิธีการติดตั้งใช้งานที่มีและไม่มีไลบรารี Jetpack Webkit

เปิดใช้การตรวจสอบสิทธิ์แบบใหม่ (WebAuthn)

ไม่มี Jetpack Webkit

ทำผ่าน API ของเฟรมเวิร์กไม่ได้

ด้วย Jetpack Webkit

ใช้ WebViewFeature.WEB_AUTHENTICATION เพื่อตรวจสอบความเข้ากันได้

if (WebViewFeature.isFeatureSupported(WebViewFeature.WEB_AUTHENTICATION)) {
  WebSettingsCompat.setWebAuthenticationSupport(
      webView.settings,
      WebSettingsCompat.WEB_AUTHENTICATION_SUPPORT_FOR_APP
  )
}

ลบข้อมูลสำหรับต้นทาง (พื้นที่เก็บข้อมูลเฉพาะเว็บไซต์)

หากไม่มี Jetpack WebKit

ไม่มี API โดยตรงในการล้างข้อมูลต้นทางที่เฉพาะเจาะจง มักจะต้องล้างข้อมูลทั้งหมด

ด้วย Jetpack WebKit

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

WebStorageCompat.getInstance().deleteBrowsingData()

หรือ

WebStorageCompat.getInstance().deleteBrowsingDataForSite()

ดูเวอร์ชัน WebView

หากไม่มี Jetpack WebKit

ใช้คลาสเฟรมเวิร์กมาตรฐาน

val webViewPackage = WebView.getCurrentWebViewPackage()

ด้วย Jetpack WebKit

ใช้เลเยอร์ความเข้ากันได้เพื่อการดึงข้อมูลที่ปลอดภัยยิ่งขึ้น

val webViewPackage = WebViewCompat.getCurrentWebViewPackage()

จัดการโปรแกรมแสดงผลที่ไม่ตอบสนอง (ไคลเอ็นต์โปรแกรมแสดงผล)

หากไม่มี Jetpack WebKit

ใช้วิธีเฟรมเวิร์กมาตรฐาน

webView.setWebViewRenderProcessClient(myClient)

ด้วย Jetpack WebKit

ใช้ WebViewCompat และการตรวจสอบฟีเจอร์เพื่อตั้งค่าไคลเอ็นต์

if (WebViewFeature.isFeatureSupported(WebViewFeature.WEB_VIEW_RENDERER_CLIENT_BASIC_USAGE)) {
  WebViewCompat.setWebViewRenderProcessClient(webView, myClient)
}

ดูข้อมูลเพิ่มเติมได้ที่androidx.webkitเอกสารอ้างอิง

ผสานรวม Jetpack Webkit เข้ากับโค้ด

การใช้ Jetpack Webkit จะเพิ่มความสามารถของคลาส WebView มาตรฐาน แต่ไม่ได้แทนที่คลาส WebView เดิมทั้งหมด

คุณจะยังใช้ชั้นเรียน android.webkit.WebView ได้ คุณเพิ่ม ลงในเลย์เอาต์ XML และรับการอ้างอิงไปยังอินสแตนซ์ในโค้ดได้ หากต้องการเข้าถึงฟีเจอร์ของเฟรมเวิร์กมาตรฐาน คุณยังคงเรียกใช้เมธอดโดยตรงในอินสแตนซ์ WebView หรือออบเจ็กต์การตั้งค่าได้

หากต้องการเข้าถึงฟีเจอร์ที่ทันสมัย คุณต้องใช้วิธีการช่วยเหลือแบบคงที่ที่ Jetpack Webkit มีให้ เช่น WebViewCompat และ WebSettingsCompat คุณ ส่งอินสแตนซ์ WebView ที่มีอยู่ไปยังเมธอดเหล่านี้

Kotlin

import android.webkit.WebView
import androidx.webkit.WebSettingsCompat
import androidx.webkit.WebViewFeature

// You still get your WebView instance the standard way.
val webView: WebView = findViewById(R.id.my_webview)

// To enable a modern feature, you pass that instance to a Jetpack Webkit helper.
if (WebViewFeature.isFeatureSupported(WebViewFeature.FORCE_DARK)) {
    WebSettingsCompat.setForceDark(webView.settings, WebSettingsCompat.FORCE_DARK_ON)
}

Java

import android.webkit.WebView;
import androidx.webkit.WebSettingsCompat;
import androidx.webkit.WebViewFeature;

// You still get your WebView instance the standard way.
WebView webView = findViewById(R.id.my_webview);

// To enable a modern feature, you pass that instance to a Jetpack Webkit helper.
if (WebViewFeature.isFeatureSupported(WebViewFeature.FORCE_DARK)) {
    WebSettingsCompat.setForceDark(webView.settings, WebSettingsCompat.FORCE_DARK_ON);
}

ใช้ Jetpack Webkit

หากต้องการใช้ Jetpack Webkit ให้ทำตามขั้นตอนต่อไปนี้

ขั้นตอนที่ 1: เพิ่มการอ้างอิง

ในไฟล์ build.gradle.kts หรือ build.gradle ของโมดูล ให้รวมทรัพยากร Dependency ต่อไปนี้เพื่อเพิ่ม Jetpack Webkit

ดึงดูด

dependencies {
    implementation "androidx.webkit:webkit:1.14.0"
}

Kotlin

dependencies {
    implementation("androidx.webkit:webkit:1.14.0")
}

Jetpack Webkit มี Wrapper แบบบาง จึงส่งผลต่อขนาดของแอปพลิเคชันน้อยมาก

ขั้นตอนที่ 2: ใช้รูปแบบการตรวจหาฟีเจอร์

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

เราขอแนะนำรูปแบบต่อไปนี้สำหรับการใช้ WebView API ที่ทันสมัย

import android.webkit.WebView
import androidx.webkit.WebSettingsCompat
import androidx.webkit.WebViewFeature

// In your Kotlin code where you configure your WebView
val webView: WebView = findViewById(R.id.my_webview)

// Before you use a modern API, first check if it is supported.
if (WebViewFeature.isFeatureSupported(WebViewFeature.FORCE_DARK)) {
    // If the check passes, it is safe to call the API.
    WebSettingsCompat.setForceDark(webView.settings, WebSettingsCompat.FORCE_DARK_ON)
} else {
    // Optionally, provide a fallback for older WebView versions.
}

รูปแบบนี้ช่วยให้มั่นใจได้ว่าแอปพลิเคชันมีความแข็งแกร่ง เนื่องจากระบบจะตรวจสอบฟีเจอร์ก่อน แอปพลิเคชันจึงไม่ขัดข้องหากฟีเจอร์ไม่พร้อมใช้งาน WebViewFeature#isFeatureSupported() มีค่าใช้จ่ายด้านประสิทธิภาพที่WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()WebViewFeature#isFeatureSupported()