גלישה באפליקציה באמצעות רכיב WebView מוטמע

דפדפנים בתוך האפליקציה מאפשרים למשתמשים ליהנות מחוויית השימוש במוצר באינטרנט בלי לצאת מהאפליקציה. מערכת Android מציעה שני ממשקי API עיקריים להטמעה של דפדפנים בתוך האפליקציה: Custom Tabs ו-WebViews. משתמשים בדפדפן באפליקציה כשרוצים לפתוח קישור או מודעה שמובילים לדף אינטרנט. אפשר לפתוח את הדף הזה ישירות באפליקציה, כמו שרואים באיור 1.

קישור בתוך האפליקציה בתיבה אדומה, וחץ שמצביע על מסך אחר שבו הקישור נפתח בכרטיסייה בהתאמה אישית.
איור 1. לחיצה על קישור בתוך האפליקציה (משמאל) ופתיחת דפדפן באפליקציה באמצעות כרטיסייה מותאמת (מימין).

הבחירה בין כרטיסיות מותאמות אישית לבין WebViews היא החלטה ארכיטקטונית חשובה שמשפיעה על מהירות הפיתוח, על חוויית המשתמש ועל מידת השליטה שלכם בממשק המשתמש.

השוואה מהירה

כדי לבחור את הכלי שמתאים לצרכים שלכם, אתם יכולים להיעזר בטבלה הבאה:

תכונה WebView כרטיסיות מותאמות אישית
תרחיש ראשי לדוגמה פיתוח אפליקציות היברידיות עם תוכן אינטרנט כתוכן עיקרי או כתוכן תומך, הצגת מודעות, קמפיינים באפליקציה או דפים של תנאים והגבלות. הצגת תוכן מאתרים חיצוניים (כמו מאמרי חדשות או דפי מוצרים).
UI control מלאה. זהו רכיב View שאפשר למקם בכל מקום. אתם שולטים בכל ממשק המשתמש שמסביב. מוגבלת. אתם יכולים להגדיר את הצבע של סרגל הכלים ולהוסיף כמה פעולות בהתאמה אישית.
נתונים וסשנים בארגז חול. הוא לא משתף קובצי Cookie או פרטי כניסה עם הדפדפן הראשי של המשתמש. משותף. הוא משתמש בסשן ברירת המחדל של הדפדפן של המשתמש, כולל קובצי Cookie וסיסמאות שמורות.
גשר בין אפליקציות מקוריות לאינטרנט כן. אפשר להשתמש ב-JavaScript bridge לתקשורת עמוקה ודו-כיוונית בין תוכן אינטרנט לבין קוד של אפליקציית נייטיב. מוגבלת. אפשר להשתמש בשיטה window.postMessage() להעברת מחרוזות בסיסית.
מאמץ מצד המפתחים גבוהה אתם צריכים לנהל בעצמכם את מחזור החיים, הניווט והביצועים. נמוכה. אפשר להטמיע אותו באמצעות כמה שורות קוד בלבד.

WebView

‫WebView הוא תצוגה שמאפשרת להציג דפי אינטרנט כחלק בלתי נפרד מהפריסה של האפליקציה. הוא יעיל, אבל קצת יותר מורכב לשימוש בהשוואה לכרטיסיות מותאמות אישית.

רכיב WebView יכול לטעון תוכן אינטרנט מרחוק או מקומי, להריץ JavaScript ולאפשר תקשורת דו-כיוונית בין תוכן האינטרנט לבין קוד אפליקציית הנייטיב. מידע נוסף על היכולות של WebView

אפשר גם להשתמש ב-WebView כדי להציג אפליקציית אינטרנט או דף אינטרנט אונליין כחלק מהאפליקציה. לדוגמה, הסכם עם משתמש הקצה שצריך לעדכן מדי פעם. מידע נוסף על יצירת אפליקציות אינטרנט ב-WebView

למה כדאי לבחור ב-WebView

אלה כמה תרחישים שבהם כדאי להשתמש ב-WebView:

  • אפליקציות היברידיות: אתם מפתחים אפליקציה שבה תוכן אינטרנטי ורכיבים מקוריים (כמו סרגל ניווט או כפתור פעולה צף (FAB)) נמצאים זה לצד זה.
  • תוכן מאינטראקציה ישירה (First-Party): תוכן האינטרנט שלכם הוא חלק מרכזי ואינטראקטיבי מחוויית השימוש באפליקציה, כמו עורך מסמכים או לוח ציור.
  • שליטה מלאה ברכיב אינטראקטיבי: צריך לשנות את התוכן של דף האינטרנט עצמו או להוסיף על גביו שכבת-על של רכיבי ממשק משתמש מקוריים.
  • ניתוח מעמיק: אתם צריכים תובנות מפורטות לגבי התעניינות המשתמשים והפעילות שלהם ברכיב WebView.

הפשרות העיקריות

הנה כמה פשרות חשובות שכדאי לקחת בחשבון כשמשתמשים ב-WebView:

  • ביצועים: WebView יכול לצרוך הרבה זיכרון. אם לא מנהלים את זה בקפידה, עלולות להיווצר בעיות בביצועים או שגיאות מסוג ANR (האפליקציה לא מגיבה).
  • אבטחה ותחזוקה: אתם אחראים על חיזוק האבטחה ועל ניהול מחזור החיים. עם זאת, עדכוני WebView מופצים באופן גלובלי דרך Google Play, כך שלא צריך לדאוג שהמנוע הבסיסי יהיה מיושן.

כרטיסיות מותאמות אישית

כרטיסיות בהתאמה אישית הן בחירה מצוינת להפניית משתמשים לכתובות URL חיצוניות, כי הן מספקות חלון דפדפן מהיר, מאובטח וידידותי למשתמש שמופיע מעל האפליקציה.

למה כדאי לבחור בכרטיסיות בהתאמה אישית

הנה כמה תרחישים שבהם כדאי להשתמש בכרטיסיות בהתאמה אישית:

  • קישורים חיצוניים: כשמשתמש מקיש על קישור לאתר שאינו בבעלותכם, כרטיסיות בהתאמה אישית מאפשרות לו להישאר בהקשר של האפליקציה שלכם וליהנות מחוויית דפדפן מלאה.
  • קלות השילוב: זו הדרך הפשוטה ביותר להטמיע חוויית אינטרנט ולהפעיל אותה.
  • מצב משותף: מכיוון שהוא משתף קובצי Cookie עם דפדפן ברירת המחדל של המשתמש, המשתמשים לא צריכים להיכנס שוב לאתרים שהם כבר ביקרו בהם.
  • כניסה באמצעות צד שלישי: הם מתאימים במיוחד לתהליכי כניסה באמצעות צד שלישי (למשל, 'כניסה באמצעות חשבון Google' או 'כניסה באמצעות פייסבוק'), כי הדפדפן מטפל בפרטי הכניסה בצורה מאובטחת.

למרות שרוב הדפדפנים תומכים בכרטיסיות בהתאמה אישית, חלקם מציעים יותר אפשרויות התאמה אישית מאחרים. מידע נוסף זמין במאמר בנושא תמיכה בדפדפנים.

שימוש בתוכן מהאינטרנט ב-Jetpack פיתוח נייטיב

אתם יכולים להשתמש גם בכרטיסיות בהתאמה אישית וגם ב-WebView כשאתם בונים באמצעות Jetpack פיתוח נייטיב:

  • כרטיסיות מותאמות אישית: כרטיסיות מותאמות אישית משתמשות ב-Intent, ולכן אפשר להפעיל אותן מכל Context בפונקציות של Compose, וכך ליצור שילוב חלק.
  • ‫WebView: ל-Compose עדיין אין רכיב WebView שאפשר להוסיף, לכן צריך להשתמש ב-AndroidView כדי להטמיע WebView רגיל בפריסה.

מקורות מידע נוספים

כדי לפתח דפי אינטרנט למכשירים עם Android באמצעות ממשקי API של WebViews או Custom Tabs, אפשר לעיין במסמכים הבאים: