הגנה על המשתמשים עם 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. אם אתם משתמשים בוורדפרס, אתם מגינים על המשתמשים שלכם. לא משתמשים בוורדפרס? וודאו שהוספת התגיות האלו מתקיימת במערכת שלכם.

<a href="https://hebdevbook.com" target="_blank" rel=

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

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

אהבתם? לא אהבתם? דרגו!


פורסם בקטגוריה: רשת האינטרנט

אל תשארו מאחור! יש עוד מה ללמוד!

4 comments on “הגנה על המשתמשים עם noopener ו-noreferrer
  1. משתמש אנונימי (לא מזוהה) הגיב:

    noreferrer לא עובד בדף הדגמה

  2. פרטיותן הגיב:

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

  3. לירן הגיב:

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

כתיבת תגובה

האימייל לא יוצג באתר.

רישום