שמירת טוקן ב-Session Storage
sessionStorage.setItem("token", newState.token). שומרים רק את הטוקן ולא את אובייקט המשתמש, כי הוא כבר בתוך הטוקן.sessionStorage.removeItem("token").constructor שקורא sessionStorage.getItem("token"), ואם יש טוקן, מציבים אותו ב-State וגם מחלצים את המשתמש.jwtDecode שכבר הופיע, ומציבים את payload.user ב-this.user.פרקי ההרצאה: שמירת טוקן ב-Session Storage
תמלול ההרצאה: שמירת טוקן ב-Session Storage
הטקסט המלא של הדקות הראשונות בהרצאה «שמירת טוקן ב-Session Storage» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.
בואו נטפל בבעיה מעניינת שנתקלנו בה אחד הסרטונים הקודמים. כאשר אנחנו מבצעים לוגאין, אז אנחנו יכולים להיכנס לכל מקום שדורש לוגאין, אבל כאשר היוזר מרפרש את האתר, אז הוא עף החוצה, כביכול.
בואו נבין למה זה וקודם כל נדגים את זה. אני כרגע עשיתי רפרש, אני לא לוגדין. אני מנסה להיכנס לאמפלואיז, הוא לא נותן לי, הוא אומר לי יוענות לוגדין, הכל בסדר, בואו נירשם.
הנה יש לנו את היוזר, 1, 2, 3, 4, לוג אין, הצלחת, בסדר, בואו ניכנס לאמפלואיז, הכל בסדר, הנה הום, אמפלואיז, ספורט, אמפלואיז, אין בעיה.
חזרתי להום, עשיתי ריפרש, ריפרש פשוט לגמרי. יכול להיות שהיוזר מרפרש את הדף, יכול להיות שהוא מרפרש ככה, יכול להיות שהוא לוחץ על F5, יכול להיות שהוא לוחץ על קונטרול F5, ויכול להיות שהוא בא לפה ולוחץ אנדר.
כל הדרכים האלה מרפרשות את האתר. מה קורה כשאתם מפרשים את האתר? כל הזיכרון של משתנים, אובייקטים, מערכים שהגדרתם בכל הקוד שלכם נעלם, נוצר מחדש.
כי בעצם הדפדפן הלך ל-Backend וכאילו קיבל מחדש את כל האתר והחליף את האתר הקודם עם כל המשתנים שלו. מה שלא שמרתם בסטורג' נעלם, Local Storage או Session Storage.
אז אם עכשיו עשינו רפרש באיזושהי דרך ואנחנו הולכים לאמפלואיז, הוא אומר לי עוד פעם אתה לא לוג דין ומפנה אותי לדף לוגין. זה משהו שאף פעם אסור שיקרה.
אם היוזר עשה לוגין שיעשה מאה פעם רפרש הוא עדיין אמור להישאר לוג דין. אנחנו צריכים לטפל בזה. טיפול הוא מאוד פשוט Redux Outstate.
כל מה שאנחנו צריכים לעשות זה כאשר היוזר ביצע או רג'יסטר או לוג דין ולקחנו את כל הטוקן ואת היוזר שלו ושמנו את זה בזיכרון של Redux את זה דרך אגב כבר אפשר למחוק.
בנוסף לזה אנחנו רוצים ספציפית את הטוקן לשמור גם ב-Local Storage או Session Storage. מה ההבדל ביניהם? Local Storage נשאר גם אם היוזר סוגר את הדפדפן, Session Storage נשאר רק למשך הגלישה הנוכחית, אבל כולל רפרשים.
אם אנחנו עושים רפרש, סשן סטורג' לא נמחק, זה בסדר, זה מה שאמור להיות. הנה ה-local storage, כרגע אין לי בו כלום, הנה ה-session storage, כרגע אין לי בו כלום, בסדר.
אז השיקול שלכם הוא כזה, יוזר עשה לוקדין פעם אחת, לא ביצע לוקד אאוט, האם אתם רוצים שבפעם הבאה שהוא ייכנס לאתר בעוד שבוע, הוא אוטומטית כבר נמצא בתוך האתר כ-user לוקדין, או שהוא לא לוקדין?
אם אתם אומרים, תשמע, אני כן רוצה שבעוד שבוע אתה מנסה להיכנס לאתר, אני רוצה לזכור שהיית פעם לוקדין, אתם צריכים לשמור אותו ב-local storage, זה פחות secured, שימו לב, זה פחות secured.
אם אתם אומרים, תשמע, אתה כרגע לוקדין רק לגלישה הנוכחית, אפילו שלא עשית לוקדין, סגרת את הדפדפן, פעם הבאה שאתה נכנס, אני לא רוצה שתהיה לוקדין, אני רוצה להעיף אותך, אני לא רוצה לזכור אותך, תעשה עוד פעם לוקדין אם אתה רוצה, זה session storage.
עדיף לכם סשן סטורג' בשביל more security אבל שוב תלוי כל אתר מה נכון לו אז בואו נראה איך זה מתבצע מה שאנחנו רוצים לעשות זה לחזור לפה ובנוסף לזה ששמרנו אותו מקומית ברידאקס אנחנו רוצים לפנות לסשן סטורג' נעשה את זה בסשן סטורג' סט אייטם אני אמציא פה סתם איזשהו שם לדוגמה
טוקן כי אני בעצם שומר את הטוקן אני לא שומר את היוזר אני שומר כמה שדברים יותר סקיורד ויותר מעורבלים או מוצפנים או מקודדים אני רוצה לשמור. ופה אנחנו רוצים ללכת לניו סטייט נקודת טוקן.