הסבר על Interceptors בריאקט

תמלול ההרצאה: הסבר על Interceptors בריאקט

הטקסט המלא של הדקות הראשונות בהרצאה «הסבר על Interceptors בריאקט» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.

1. 00:02

   אינטרספטור זה מנגנון שמסוגל כביכול ליירט ה-request או את ה-response. כאשר אנחנו מבצעים גלישה לאנשהו, אנחנו גולשים כרגע ל-products, וגם עכשיו אנחנו גולשים ל-products, ועכשיו אנחנו גולשים ל-employees, בכל אדג'קס request כזה אנחנו יכולים לבנות מנגנון שפשוט משלב קוד ב-request ו/או ב-response.

2. 00:35

   המנגנון הזה נקרא אינטרספטור, כאילו הוא מיירט את ה-request ועושה שם משהו ומיירט את ה-response ועושה שם משהו נוסף, קטע קוד.

3. 00:45

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

4. 01:02

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

5. 01:22

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

6. 02:00

   אנחנו יכולים להגיע למוצרים ולעובדים ואנחנו רואים שקיבלנו אותם אבל דרך המופע החדש הזה אנחנו יכולים להוסיף Interceptors יש לו שני אובייקטים Request ו-Response אם אנחנו משתמשים ב-Request Interceptor אנחנו מוסיפים קטע קוד שהתבצע כל פעם שעושים ריקווסט אם אנחנו משתמשים ב-Response Interceptor אנחנו מוסיפים קטע קוד

7. 02:32

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

8. 02:49

   אז אנחנו נכנסים ל-my-access.interceptors.request.use ואנחנו שולחים לה callback. ה-callback מקבלת אובייקט ה-request, זאת אומרת ש-use קוראת ל-callback שלנו ונותנת לנו את אובייקט ה-request ואנחנו כותבים פה איזשהו קוד.

9. 03:10

   בואו ניכנס לתוך הקוד ונדפיס console.log תארט ריקווסט ונציג את אובייקט הריקווסט על המסך, על הקונסול.

10. 03:28

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

11. 03:46

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

12. 04:05

    כרגע רק הצגנו אותו על הקונסול. בואו נבצע את אותו הדבר עבור ה-Response myAxios.interceptors.Response.Use.Response in אובייקט הרספונס שלנו אנחנו רוצים toConsol.Log.

13. 04:26

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