פיירפוקס טוען כל תמונה פעמיים

סיפורו של באג מוזר בפיירפוקס ופתרונו - או יותר נכון, איך הבנו איך לפתור אותו
פיירפוקס שמציג תמונה

ממש לא מזמן, נתקלתי בבאג משונה ששרף לי כמה שעות מהחיים ויכול להיות רלוונטי גם לכם. במוצר שאותו אני מפתח, ישנו מודול סטטיסטיקות שבודק הורדות של קבצים שונים שאותם לקוחות מורידים. חלק מהקבצים הם קבצים שניתן להריץ כמו jar או exe וחלק מהם הם קבצי rar. חלק אחר של הקבצים הם תמונות וטקסטים שהלקוח יכול להוריד אותם. בדפדפנים מודרניים, כפי שאתם יודעים (אלא אם כן אתם זקנים שמשתמשים באקספלורר), כאשר ניגשים לקובץ תמונה, טקסט או PDF, הדפדפן פותח אותם ישירות.

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

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

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

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

אני וראש הצוות שלי, לירן טל, בהינו מול התמונה הזו ביאוש:

פיירפוקס שמציג תמונה
פיירפוקס שמציג תמונה

ולפתע, לירן התחיל לקפוץ כמו משוגע ולומר 'מצאתי! מצאתי! אני גאון! אני גאון!'

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


פוסטים נוספים שכדאי לקרוא

תמונה מצוירת של רובוט שמנקה HTML
יסודות בתכנות

סניטציה – למה זה חשוב

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

צילום מסך של סוואגר
יסודות בתכנות

openAPI

שימוש בתשתית הפופולרית למיפוי ותיעוד של API וגם הסבר בסיסי על מה זה API

גלילה לראש העמוד