הגנה על המשתמשים עם noopener ו-noreferrer

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

noopener

כשאנחנו יוצרים קישור חיצוני לאתר שלנו, הרבה פעמים אנו יוצרים קישור עם target שהערך שלו הוא blank_ – משהו בסגנון הזה:

<a href="https://example.com" target="_blank">קישור רגיל</a>

לחיצה על הקישור הזה פותחת למשתמש טאב חדש. אבל יש משהו טריקי בטאב החדש הזה – יש לו גישה לאובייקט גלובלי בג'אווהסקריפט שנקרא window.opener. האובייקט הזה מאפשר לנו לשנות את כתובת ה-url של מי שמפנה לנו. כן! ממש ככה.

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

בדיוק בשביל זה יש לנו "rel="nopener – מה שהוא עושה זה פשוט מאוד – לא נותן לדף שנמצא בצד השני של הקישור גישה לאובייקט opener.

<a rel="noopener" href="https://example.com" target="_blank">קישור מוגן</a>

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

noreferrer

בעיה נוספת שיש לנו עם קישורים יוצאים היא שאנו מסגירים את ה-referrer שלנו. זה עלול להיות בעייתי אם אנו מקשרים ממערכות רגישות. נכון, אבטחה באמצעות הסתרה היא לא הרעיון הכי טוב – אבל מצד שני – זה לא אומר שאני צריך להפוך את החיים של כל תוקף לחיים קלים. חוץ מזה, אם בצד השני יש סקריפט של פייסבוק, חביבת המדור, אז אני לא רוצה לתת להם בחינם גישה למידע של מאיפה המשתמשים שלי הגיעו. אם אני מציב "rel="noreferrer אז אני מונע מאתר היעד גישה ל-referrer. כל מה שצריך זה:

<a rel="noreferrer" href="https://example.com" target="_blank">קישור מוגן</a>

גם פה הכנתי דף הדגמה פשוט וקל.

בוורדפרס זה קל

בוורדפרס, החל מגרסה 4.7, בכל קישור יוצא מוורדפרס שיש בו "target="_blank יש באופן אוטומטי גם norefferer וגם noopener. קחו למשל את הקישור הזה למשל – בידקו אותו בכלי המפתחים ותראו שיש בו אוטומטית noopener ו-noreffere. אם אתם משתמשים בוורדפרס, אתם מגינים על המשתמשים שלכם. לא משתמשים בוורדפרס? וודאו שהוספת התגיות האלו מתקיימת במערכת שלכם.

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