Web3Modal ב-dApp: חיבור ארנקים, SSO ורשתות מותאמות אישית

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

שירותי פיתוח בלוקצ'יין

שאלות נפוצות

העבודות האחרונות

  • פיתוח אפליקציית ווב עבור FEEDME
    פיתוח אפליקציית ווב עבור FEEDME
    1375
  • פיתוח חנות מקוונת לחברת FURNORO
    פיתוח חנות מקוונת לחברת FURNORO
    1349
  • עיצוב לוגו לחברת B2B Advance
    עיצוב לוגו לחברת B2B Advance
    794
  • פיתוח אפליקציית ווב עבור Enviok
    פיתוח אפליקציית ווב עבור Enviok
    1087
  • פיתוח לוגו חברת AIDER
    פיתוח לוגו חברת AIDER
    1032
  • פיתוח CRM עבור Chasseurs
    פיתוח CRM עבור Chasseurs
    1129

אינטגרציה של Web3Modal: היכן החיבור מתנתק

חיבור הארנק ב-dApp נשבר לא על כפתור "התחבר", אלא במפגש של שלושה שכבות: הספק שבתוך הארנק, הרשת שאליה הוא משויך, ומצב הסשן בממשק. Web3Modal סוגר את שכבת התצוגה — חלון בחירת הספק והחלפת הרשת — אבל לא מבטל את חוסר הסנכרון ביניהם. אינטגרציה של Web3Modal נשברת בדיוק במקום שבו השכבות נפרדות.

הנפוץ ביותר הוא אי-התאמת רשת: הארנק מחזיר מזהה שאינו מופיע ברשימת הרשתות של האפליקציה, ובמקום הצעה לעבור רשת המשתמש מקבל שגיאת חיבור.

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

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

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

מה נותן מודול חיבור ארנקים אחוד

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

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

  • שיעור החיבורים הכושלים. הסירוב בבחירת רשת או בחתימה מטופל במפורש: המשתמש רואה את הסיבה וחוזר על הניסיון באותו חלון, בלי לרענן את הדף. קטיעות בכניסה מפסיקות להיות בלתי נראות.
  • הזמן עד לכניסה הראשונה. רשימת הארנקים והרשתות נטענת מראש, ולא ברגע הלחיצה, ולכן בין הבחירה לאישור אין השהיה של אתחול החיבור.
  • תמיכה בארנקים. ארנק חדש מתווסף כפרמטר קונפיגורציה, ולא כמסך נפרד — הרחבת הרשימה אינה דורשת שינויי ממשק וסבב בדיקות חדש.
  • רשתות מותאמות אישית. הרשת הראשית וסביבת הבדיקות מתוארות כרשימת פרמטרים, ומעבר ביניהן אינו מאפס את מצב החיבור ואינו מחייב כניסה מחדש.
  • ניסיונות חוזרים. המודול עצמו עוקב אחר החלפת חשבון ורשת בצד הארנק ומושך את המצב החדש — המשתמש לא צריך לרענן את הדף ידנית.
  • פניות לתמיכה. ה"לא מתחבר" הטיפוסי מוחלף בסטטוס חיבור ברור ובטקסט שגיאה, ולכן לתמיכה מגיעות תקלות אמיתיות ולא שאלות על איזה כפתור ללחוץ.
  • נראות תפעולית. אירועי חיבור, סירוב וניסיון חוזר נרשמים ביומן באותה צורה לכל הארנקים — רואים באיזה שלב המשתמשים הולכים לאיבוד.

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

אינטגרציה של Web3Modal: השוואה בין שלושה גישות

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

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

אפשרות מתי מתאימה מגבלות
מודול חיבור מוכן רשתות פופולריות, נדרשים כיסוי רחב של ארנקים וגישה למובייל מיד רשת לא טיפוסית וספק כניסה עצמאי מתווספים מעליו; חלק מעיצוב המסך נקבע על ידי המודול עצמו
טופס כניסה עצמאי נדרשים שליטה על התרחיש, מסך ממותג ורשימת ארנקים לא סטנדרטית תמיכה בארנקי מובייל ועדכון הרשימות — באחריותכם, ובשינוי תקנים אתם מתקנים בעצמכם
ספק כניסה חיצוני כניסה אחודה לעובדים או לשותפים לצד הארנק תלות בזמינות המתווך, סט רשתות מוגבל, ונתוני סשן מחוץ לקונטור שלכם

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

שלבי ההטמעה: מביקורת הכניסה ועד המסירה

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

  1. ביקורת הכניסה. אוספים את נקודות הכניסה הקיימות: תוספים, ארנקי מובייל, כניסה חברתית, דפדפנים מובנים. מתעדים היכן הסשן הולך לאיבוד וכיצד מצב החיבור נשמר כיום.
  2. תרשים הרשתות. מתארים צומת רשת ראשי ומשני, שרשראות מותאמות אישית, והתנהגות במקרה של אי-התאמת רשת מול הצפוי. התרשים מאושר לפני הקונפיגורציה, כדי לא לכתוב מחדש את לוגיקת ההחלפה.
  3. הגדרת החיבור. מגדירים את רשימת הארנקים ואת סדר הצגתם, את הסף למעבר לתרחיש מובייל, ואת הטיפול בחיבורים חוזרים ובבקשות מקבילות.
  4. בדיקת החתימות. בודקים את חתימת ההודעה: דומיין, תוקף, השוואת כתובת, ודחיית בקשה בארנק. החתימה נבדקת מחדש בהכרח בשרת — אסור לסמוך על בדיקה בצד הלקוח.
  5. בדיקת תרחישי כשל. מריצים החלפת חשבון, ניתוק רשת, צומת לא זמין, איפוס מטמון וסשן מיושן: בכל שלב המשתמש צריך לראות מוצא ברור, ולא שגיאה.
  6. מסירה לתמיכה. מוסרים קונפיגורציות, תרשים זרימות החיבור, רשימת בדיקות אבחון ותזכיר לקו הראשון — לפי אילו סימנים להבחין בין תקלת ארנק, תקלת רשת ותקלה בקוד שלנו.

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

קונפיגורציות רשת, מדיניות גישה ותיעוד

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

  • קונפיגורציית רשתות — כתובות צמתים, מזהי הרשת הראשית וסביבות הבדיקות, הגדרות רשת משתמשית עם סייר הבלוקים שלה, הסמליות ופרמטרי תשלום העמלה.
  • מרשם ארנקים — טבלה של אפשרויות הכניסה המחוברות: תוספי דפדפן, אפליקציות מובייל, כניסה דרך ספק זהויות חיצוני. לכל שורה — סטטוס, בעלים ונוהל ניתוק, כדי שהסרת ספק לא תהפוך לחפירה.
  • מדיניות גישה — מי ובאיזו עילה משנה את פרמטרי הרשת ואת רשימת הארנקים; לקונטור הפרודקשן — כלל של שני מאשרים ואיסור שינויים ישירות בממשק.
  • תרשים הרשאה — הזרימה מבחירת הארנק ועד לקישור הכתובת לפרופיל: טיפול בהחלפת חשבון, החלפת רשת, חתימה שנדחתה וכניסה חוזרת.
  • הוראות להוספת רשת — סדר פעולות שלב-אחר-שלב עבור רשת חדשה או בלוקצ'יין משלכם: כתובות חוזים, בדיקה בסביבת הבדיקות, ותנאי הקבלה לפרודקשן.
  • נוהל תמיכה — מה עושים בקריסה המונית של ספק, כיצד מחזירים קונפיגורציה לגרסה קודמת, ובאילו יומנים להסתכל קודם.
  • טקסטי שגיאות ורמזים — נוסחים מוכנים לשירות התמיכה, כדי שהתשובות לא יסתו מהתנהגות הממשק.
  • יומן שינויים — ניהול גרסאות של קובצי הקונפיגורציה לצד הקוד: כל בנייה קודמת ניתנת לשחזור, ולכן החזרה לאחור אורכת דקות.

מעבירים זאת כחבילה עם צ'ק-ליסט קבלה: המהנדסים שלכם עוברים עליו ומאשרים שכל סעיף נבדק בקונטור חי.

מקרה בוחן: צמצום שיעור החיבורים הכושלים פי שלושה

מה היה לפני מודול כניסה אחוד

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

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

מה שינינו

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

את השגיאות פירקנו למחלקות: סירוב משתמש, פסק זמן של הגשר, רשת לא נתמכת — לכל אחת הודעה משלה והשלב הבא שלה.

מה קרה בסוף

בניסיון הראשון מתחברים 89% (היה 61%), ושיעור החיבורים הכושלים הצטמצם פי שלושה. החתימות החוזרות נעלמו — הסשן משוחזר לפי אותו מפתח. הפניות לתמיכה בנושא כניסה ירדו משליש ל-9%, והניתוח כבר אינו דורש יומנים: סוג השגיאה נראה באנליטיקה.

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

מה עושים אם הארנק כבר מחובר דרך טופס משלכם?

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

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

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

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

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

ספקות טכניים: רשתות, חתימות ושחזור גישה

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

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

הארנק מתחבר לרשת לא טיפוסית שאינה ברשימה — מה עושים?

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

למה החתימה לא עוברת, אף שהארנק מחובר?

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

מה קורה לסשן ברענון דף או כשאין זמינות לכניסה אחודה?

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

הארנק התעדכן ושינה התנהגות — האינטגרציה תישבר?

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

נדבר על המשימה: היקף העבודה ותוכנית ההטמעה

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

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

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