การฝังเนื้อหาเว็บลงในแอปเป็นเนื้อหาหลักหรือเนื้อหาสนับสนุน

Android ช่วยให้คุณต่อยอดศักยภาพของเว็บภายในแอปได้ คุณจึงได้รับประโยชน์จากความยืดหยุ่นและประสิทธิภาพในการแสดงเนื้อหาบางประเภท

การฝังเนื้อหาโดยใช้ WebView

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

แอป Android ที่เปิด Google Play โดยมี WebView หลักไฮไลต์อยู่ในกรอบสีแดง แอป Android เปิดอยู่พร้อมข้อความสนับสนุนภายในกล่องสีแดง
รูปที่ 1 เนื้อหาเว็บที่ฝังอยู่ภายในแอปซึ่งมีออบเจ็กต์ `WebView` เป็นเนื้อหาหลัก (ซ้าย) และเนื้อหาสนับสนุน (ขวา)

สิ่งที่ WebView ทำได้

คุณสามารถทำสิ่งต่อไปนี้ด้วย WebView ในแอป

  • ฝังเว็บ: WebView จะผสานรวมเข้ากับอินเทอร์เฟซผู้ใช้ของแอปเป็นคอมโพเนนต์ เช่น ปุ่มหรือช่องข้อความ

  • โหลดเนื้อหา: WebView สามารถโหลดเนื้อหาเว็บจากแหล่งที่มาต่างๆ ได้ดังนี้

    • URL ระยะไกล: สามารถดึงข้อมูลและแสดงหน้าเว็บจากอินเทอร์เน็ตได้เหมือนกับเบราว์เซอร์ทั่วไป
    • ไฟล์ในเครื่อง: สามารถโหลดไฟล์ HTML, CSS และ JavaScript ที่จัดเก็บไว้ในทรัพยากรของแอปได้
    • เนื้อหาที่สร้างขึ้นแบบไดนามิก: แอปสามารถสร้างเนื้อหา HTML แบบไดนามิกและส่งไปยัง WebView ได้

  • แสดงผล: WebView ใช้เครื่องมือเบราว์เซอร์เพื่อแยกวิเคราะห์และแสดงผล HTML, CSS และ JavaScript โดยแสดงหน้าเว็บที่ได้ภายในพื้นที่ที่กำหนดใน UI ของแอป

  • เรียกใช้ JavaScript: WebView สามารถเรียกใช้โค้ด JavaScript ภายในบริบทของหน้าเว็บที่โหลดได้ ซึ่งช่วยให้เกิดการโต้ตอบและการอัปเดตแบบไดนามิกภายใน WebView

  • โต้ตอบกับแอป: WebView จะมีประสิทธิภาพมากขึ้นในส่วนนี้ ซึ่งช่วยให้เกิดการสื่อสารแบบ 2 ทางระหว่างหน้าเว็บและแอป

    • JavaScript ไปยังโค้ดแอป: โค้ด JavaScript ที่ทำงานใน WebView สามารถเรียกใช้ API โฮสต์ของแอปได้ ซึ่งจะช่วยให้เข้าถึงฟีเจอร์ของอุปกรณ์ เช่น กล้อง, GPS หรือเซ็นเซอร์

    • โค้ดแอปเป็น JavaScript: แอปยังสามารถแทรกโค้ด JavaScript ลงใน WebView, จัดการเนื้อหาของหน้าเว็บ หรือตอบสนองต่อเหตุการณ์ที่ทริกเกอร์โดยหน้าเว็บได้ด้วย

WebView แตกต่างจากเบราว์เซอร์อย่างไร

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

หากต้องการทำความเข้าใจความแตกต่างระหว่าง WebView กับเบราว์เซอร์มาตรฐาน โปรดดูคำอธิบายต่อไปนี้

UI: WebView ใช้สำหรับแสดงเนื้อหาเว็บและไม่มีส่วนหัวหรือ UI ของตัวเองเหมือนเบราว์เซอร์ทั่วไปอื่นๆ เช่น ปุ่มหน้าแรก แถบที่อยู่ หรือเมนูการตั้งค่า

ฟีเจอร์: เบราว์เซอร์จำนวนมากมีฟีเจอร์ในตัวเพื่อเพิ่มประสิทธิภาพประสบการณ์การท่องเว็บ เช่น บุ๊กมาร์ก สิทธิ์ หรือประวัติการเข้าชม

อัปเดต: เนื่องจาก Android WebView เป็นบริการของระบบใน Android ระบบจึงจะพุชและผสานรวมการอัปเดตเข้ากับแอปโดยอัตโนมัติเป็นประจำทุกเดือน เบราว์เซอร์จะอาศัยการอัปเดตแอปที่เกี่ยวข้อง จากนั้นผู้ใช้ปลายทางจะใช้การอัปเดตในอุปกรณ์ของตน

เริ่มต้นใช้งาน

ดูข้อมูลเกี่ยวกับวิธีใช้ WebView ในแอปได้ที่เอกสารสร้างเว็บแอปใน WebView

แหล่งข้อมูลเพิ่มเติม

หากต้องการพัฒนาหน้าเว็บสำหรับอุปกรณ์ที่ใช้ Android โดยใช้ออบเจ็กต์ WebView หรือแท็บที่กำหนดเอง โปรดดูเอกสารต่อไปนี้