PracticU

הסבר על WebAPI

בלי כתוביותעם כתוביות
PracticU › קורס אנגולר 4 עם Angular - WebAPI › הסבר על WebAPI
מילון מושגים:
API - ממשק תכנותי שמגדיר כיצד תוכנה אחת פונה לאחרת ומחליפה איתה נתונים ופעולות.
Angular - מסגרת פיתוח של גוגל לבניית יישומי אינטרנט מתקדמים בצד הלקוח, מבוססת TypeScript ורכיבים.
Entity Framework - ספריית מיקרוסופט שממפה בין אובייקטים בקוד לבין טבלאות במסד נתונים, ומאפשרת לעבוד עם הנתונים בלי לכתוב SQL ישיר.
פריימוורק - מסגרת תוכנה שמספקת מבנה וכלים מוכנים לפיתוח יישומים, כדי לחסוך כתיבת קוד חוזר.
GET - שיטת HTTP לבקשת מידע מהשרת בלי לשנות אותו. הפרמטרים מועברים בדרך כלל בכתובת.
PUT - שיטת HTTP לשליחת נתונים לשרת כדי ליצור או להחליף משאב קיים במלואו.
POST - שיטת HTTP לשליחת נתונים לשרת כדי ליצור או לעדכן משאב, למשל שליחת טופס.
XML - שפת סימון לייצוג נתונים מובְנים בעזרת תגיות, המשמשת להחלפת מידע בין מערכות ולקובצי הגדרות.

הסבר על WebAPI
ההרצאה מציגה את Web API, שבו השרת מחזיר נתונים גולמיים בלבד ללא HTML, ולכן כל לקוח, כמו Angular או אפליקציה לנייד, יכול לעבוד איתם. בהמשך נסקרים סוגי הקונטרולרים השונים.
סוגי הקונטרולרים
1. קונטרולר עם Entity Framework: נוצר אוטומטית מטבלה. הוא כולל פונקציות GET, GET לפי מזהה, PUT לעדכון ו-POST להוספה. בדפדפן התוצאה נראית כ-XML.
2. קונטרולר ריק: פונקציה שנכתבת ידנית, בלי חיבור לבסיס נתונים, וניתן לגלוש אליה ישירות.
3. קונטרולר עם פונקציות ריקות: שלד של פונקציות מוכנות בלי קוד, שהמתכנת משלים בעצמו.
4. OData: מנגנון מוכן שמבצע סינון, מיון והגבלת תוצאות בצד השרת, לפי פרמטרים בכתובת.
דוגמאות OData
1. מיון: מיון הרשימה לפי מחיר, מהנמוך לגבוה, ואפשר לבקש גם סדר יורד.
2. סינון: החזרת מוצרים שיש מהם יחידות במלאי, או מוצרים שאין מהם.
3. הגבלה: הצגת המוצר הראשון בלבד, או השלושה הראשונים, אחרי מיון.
לפי ההרצאה הסינון והמיון נעשים אצל השרת ולא אצל הלקוח, וזה מהיר יותר כשיש הרבה נתונים.
סיכום
בסוף ההרצאה נשאר בפרויקט קונטרולר המוצרים עם החיבור ל-Entity Framework. ה-Views נמחקים, כי הצגת הדפים תטופל על ידי פרויקט Angular. בדיקה אחרונה מראה שהשרת מחזיר את הנתונים בפורמט XML.
השיעור הבא בקורס: WebAPI Routing

פרקי ההרצאה: הסבר על WebAPI

  1. 00:00

    מה ההבדל בין MVC ל-Web API

  2. 00:43

    יצירת קונטרולר Web API מחובר ל-EF

  3. 01:21

    נתונים גולמיים במקום HTML

  4. 02:08

    הפרדה בין השרת לבין הלקוחות

  5. 02:45

    פעולות GET, PUT ו-POST בקונטרולר

  6. 03:54

    בניית קונטרולר ריק ובדיקתו

  7. 04:59

    קונטרולר עם פונקציות מוכנות ריקות

  8. 05:55

    קונטרולר OData

תמלול ההרצאה: הסבר על WebAPI

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

  1. 00:04

    שלום לכולם בהרצאה הקודמת ראינו קונטרולרים של mvc וviews של mvc ובהרצאה הזאת אנחנו נדבר על Web API מה זה הקונטרולרים של Web API ומה הם שונים מ-Odata ומה זה Odata ומה זה Web API אני רק רוצה להזכיר לכם לפני שנתחיל שבקונטרולר של mvc הוא גם החזיר לנו את ה-view זאת אומרת שהשרט היה מחזיר לנו HTML. ב-Web

  2. 00:37

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

  3. 00:53

    אנחנו נראה את כל סוגי הקונטרולרים וגם נראה את ה-Odata בהמשך. אז אנחנו רואים את הקונטרולר שמחובר ל-Entity Framework של Web API.

  4. 01:02

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

  5. 01:34

    מוצר מספר 1 זה xml נקרא מוצר מספר 1 וכל הנתונים שלו מספר מספר 2 והנתונים שלו product ID אתם רואים product ID 1 product ID 2 וכולי product ID 3 למעשה השרת נותן לי נתונים גולמיים והקליינט שזה במקרה שלי אנגולר שיעשה איתם מה שהוא רוצה למה הגישה הזאת יותר טובה כי אז אני לא תלוי בסוג הקליינט זה יכול להיות קליינט של אפליקציה לפלאפון לאייפון לאנדרואיד

  6. 02:14

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

  7. 02:41

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

  8. 03:09

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

  9. 03:25

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

  10. 03:39

    זה מה שהם עשו לי ב-Web API קונטרולר המוכן של אנטיטי פריימורק. בואו נראה קונטרולר אחר. יש לנו קונטרולר ריק, Web API ריק.

  11. 03:58

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

  12. 04:14

    רק הקונטרולר שלי נקרא טסט API אחד ואז פה אני צריך לכתוב טסט API אחד ונעשה סטארט ונראה איך זה עובד. אני אעשה פה pause רק כדי לראות שזה באמת עובד והנה נכנסנו לצד שרת ופה אנחנו מקבלים רשימת מוצרים ואם אני עושה פה go אני מקבל רשימת מוצרים ואם תעשו view page source אתם ממש רואים פשוט xml עם כל המוצרים בפנים אין פה

  13. 04:43

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

  14. 05:17

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

  15. 05:38

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

  16. 05:53

    אם אני אגלוש עליו, אני אקבל את מה שכתוב פה ברטורן. יפה מאוד. עכשיו בואו נראה מה זה O-Data. אני עושה קונטרולר חדש, ומשתמש ב-Odata מחוברת עם framework, הבנתם?

  17. 06:06

    זה פונקציות Record Read Write Actions וזה כבר עם נתונים, בואו נראה עם קצת נתונים שיהיה לנו מעניין ונבין מה זה OData. הוא שואל אותי שוב לאיזה טבלה

לקורס המלא: קורס אנגולר 4 אונליין עם WebAPI

ההרצאה הקודמת: הסבר על MVC

ההרצאה הבאה: WebAPI Routing

קורסים נוספים במסלול

  • קורס יסודות HTML - בניית אתר אינטרנט פשוט
  • קורס CSS 3 - בדגש על Flex & Grid
  • קורס Javascript כולל JQuery
  • קורס ג'אווה סקריפט מעשי - JavaScript
  • קורס TypeScript
  • קורס ריאקט - React