מבנה בקשה בפרוטוקול HTTP
/index.html, בלי שם הדומיין.פרקי ההרצאה: מבנה בקשה בפרוטוקול HTTP
תמלול ההרצאה: מבנה בקשה בפרוטוקול HTTP
הטקסט המלא של הדקות הראשונות בהרצאה «מבנה בקשה בפרוטוקול HTTP» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.
אנחנו מגיעים לנושא חדש לגמרי שהוא בסיס מאוד חשוב לסדרה של נושאים וקטע מאוד מאוד שימושי ב-Node.js. ומה שאנחנו הולכים להיכנס אליו זה כל הנושא של תקשורת HTTP, איך אנחנו בעצם מתחילים להבין מה זה HTTP בכדי להרים סרבר להעביר ולתת מענה כסרבר ללקוח.
אז הדבר הראשון והכי חשוב זה כמובן הדברים הבסיסיים בכל נושא, והדבר הבסיסי בכל הנושא של תקשורת באינטרנט זה להבין את פרוטוקול התקשורת של האינטרנט HTTP. אז בואו בהדגמה הזאת ניכנס ונבין מונחים חשובים בעולם ה-HTTP.
דבר ראשון, מה זה HTTP? מה הראשי תיבות? ראשי תיבות של ה-HTTP זה Hypertext Transfer Protocol. Hypertext זה טקסט כישורי, זאת אומרת טקסט שמכיל לינקים, וכל הנושא זה בעצם איך אנחנו מעבירים דפי אינטרנט, או מקבלים, מבקשים ומקבלים דפי אינטרנט, כי דפי אינטרנט בנויים בעצם מלינקים שיוצרים
ביחד את רשת האינטרנט. זאת הסיבה שיש פה את המילה Hypertext. This is the internet protocol for requesting and receiving web pages. זה בעצם הפרוטוקול תקשורת של רשת האינטרנט.
עכשיו, HTTP זה לא שיטת תקשורת. שיטת תקשורת כפרוטוקול תקשורת אמיתי זה TCP או TCP IP. זה בעצם קיצור של Transmission Control Protocol.
זה בעצם פרוטוקול התקשורת שמעביר את המידע מנקודה א' לנקודה ב', כלומר מי לדוגמה הלקוח לשרת, הלקוח מבקש דף. בסופו של דבר התקשורת שמקשרת בין הלקוח לשרת זה תקשורת של פרוטוקול שנקראת TCP/IP.
HTTP רוכב על גבי תקשורת ה-TCP/IP ו-HTTP זה סך הכל מסמכים, שני מסמכים של בקשה וקבלה של דף, בקשת דף וקבלה של דף, איך בנויים המסמכים האלה ובעצם פרוטוקול ה-HTTP.
אז ה-HTTP זה רק המסמך, הדוקיומנט עצמו, התקשורת עצמה שמעבירה אותו היא תקשורת בסיסית יותר שנקראת TCP. אבל כרגע, לענייננו, חשוב להבין מה הם המסמכים האלה. זה מה שהמתכנת חייב לשלוט בהם.
פחות הוא צריך לשלוט ב-TCP, למרות שזה לא רע להבין מה בעצם מתרחש עוד יותר עמוק מאחורי הקלעים בנוגע ל-TCPIP, זה לא משהו שהוא כרגע נדרש לענייננו. אנחנו חייבים להבין את HTTP וזה בעצם המסמכים האלה.
עכשיו, מה שקורה בפועל זה שהדפדפן יוצר מסמך HTTP שנקרא HTTP Request. זה מסמך שבסופו של דבר המטרה שלו זה להישלח מהדפדפן לשרת בשביל להגיד לשרת: תשמע, אני רוצה איזשהו דף מסוים.
השרת מקבל את הבקשה הזאת ומייצר מסמך אחר שנקרא htp-response והדף מוכל בתוך המסמך של ה-htp-response. אז יש לנו כאן סכמה מאוד פשוטה, הנה יש לנו מספר דפדפנים, אנחנו כמובן גולשים דפדפן אחד במחשב של הקליינט ויש לנו את המחשב של הסרבר, את השרת עצמו, ראינו כבר בסרטון קודם את התמונה הזאת ואז הלקוח מבקש ריקווסט, הריקווסט מגיע לשרת והשרת מחזיר לו ריספונס,
הריספונס מכיל את הדף, ומה שהדפדפן עושה זה פשוט שולף את הדף מתוך המסמך של הריספונס ומציג אותו. אז אנחנו צריכים להבין מה הם שני המסמכים האלה, מה הדפדפן בעצם מייצר ושולח לשרת, ומה השרת מייצר ושולח ללקוח.
אנחנו צריכים להבין את זה בשביל לדעת איך בעצם ב-Node.js אנחנו מרימים סרבר לאוויר, כי אנחנו צריכים להתמצא בשני המסמכים האלה, כי זה בעצם מה שאנחנו הולכים לקבל מהלקוח וזה מה שאנחנו הולכים לשלוח ללקוח.
אז יש לנו את המסמך עצמו, למסמך יש מספר חלקים ואנחנו מדברים כרגע על HTTP request, על הבקשה שהדפדפן מייצר ושולח לסרבר. אז הכחול הזה זה כל המסמך ולמסמך יש את החלקים הבאים.
החלק הראשון נקרא verb, פועל, זה בעצם ייעוד הבקשה. HTTP עצמו קיימות שתי מילים שמתארות ייעוד, אחת נקראת גט ואחת נקראת פוסט. הייעוד של הגט זה אומר שהריקווסט מיועד בשביל לקבל דף, לקבל מידע מהשרת, לקבל איזשהו מסמך שמכיל דף של בוא נניח כל המסעדות בארץ.
והמילה השנייה שיכולה להיות זה פוסט. ב-HTTP פוסט מציין שעכשיו הלקוח שמבצע את הרקווסט רוצה לשלוח מידע לשרת בכדי שהשרת יעשה משהו את המידע.
לדוגמה, דף רג'יסטריישן, הרשמה. הלקוח בעצם ממלא פרטים של הרשמה ושולח לשרת בשביל שהשרת עכשיו ייצור יוזר חדש. אם הלקוח רוצה לשלוח מידע לסרבר, אז ה-verb שלנו, הייעוד שלנו, הפועל, מה אנחנו בעצם רוצים לעשות, יהיה פוסט ולא גט אז שתי המילים האלה קיימות בפרוטוקול ה-HTTP וזה נמצא באזור הראשון שאנחנו רואים כרגע במסמך זאת אומרת שאם אתם פותחים או מסתכלים על מסמך ריקווייסט ה-HTTP
ריקוויסט אמיתי המילה הראשונה תהיה או גט או פוסט ב-HTTP סטנדרטי האזור הבא זה הדף שאנחנו רוצים כאן חשוב להבין שהאזור הזה וזה מה שאני מראה כרגע זה בדיוק הסדר המדויק שבו יושבים החלקים האלה במסמך ה-HTTP, זה לא הגיוני שהפייג' יהיה בדיוק למטה, כי אז אנחנו לא עובדים לפי פרוטוקול HTTP.
הדבר הראשון זה הוורב, מיד אחר כך מופיע איזה דף אנחנו רוצים, כי אנחנו כרגע שולחים ריקווסט להשערה.
שימו לב שכתוב פה פייג' ולא נתיב מלא. זאת אומרת, מה שיהיה כתוב בחלק הזה זה לא http://www.mysite.com/index.html זה לא מה שיהיה כתוב.
אם אני גולש לדף index.html כל מה שיהיה כתוב פה באזור הזה זה בעצם /index.html ה-slash אומר שאנחנו בנתיב הראשי של האתר. אנחנו כבר הולכים לראות דוגמאות יותר קונקרטיות למסמכים האלה.
אז זה בעצם האזור של הדף שאנחנו רוצים. האזור השלישי שנמצא בשורה הזאת זה הגרסה של ה-HTTP, יש מספר גרסאות, לא הרבה, וכאן אנחנו מציינים איזה גרסה אנחנו בעצם משתמשים בה לצורך ה-request עצמו.
כאן אנחנו מגיעים לאזור שנקרא HTTP Request Headers. זה בעצם מידע נלווה לגבי הבקשה שאנחנו מייצרים. כל מה שקשור למידע נלווה כמו מה התאריך עכשיו, מי אני, לאן אני רוצה לגלוש, כל מיני דברים נלווים, כאשר כל פרט אינפורמציה תופס שורה נפרדת.
לאחר מכן מגיעה שורה ריקה, זה משהו שתמיד קיים והוא חלק מהפרוטוקול, בכדי להבדיל בין שני החלקים, בין כל ההדרים לבין מה שמגיע עכשיו, ומה שמגיע עכשיו זה ה-HTTP Request Body.
זה בעצם המידע המרכזי שאני שולח לשרת, עוד מעט אנחנו נראה דוגמאות מה זה אומר מידע מרכזי, אם אני מבקש דף אינדקס html, איזה מידע מרכזי יש לי, עוד מעט אנחנו נראה דוגמאות לזה.
אז כל מה שאנחנו רואים כרגע זה הפורמט האמיתי של פרוטוקול HTTP עבור ה-request בלבד, ותמיד זה מה שקורה בעולם האינטרנט כאשר הדפדפן שלכם מבקש בקשה מהשרת.
מה קורה כאשר השרת שולח לו בחזרה תשובה? אז אנחנו עוברים לפורמט של HTTP ריספונס. השרת עכשיו רוצה לשלוח תשובה לבקשה שהוא קיבל. הנה המסמך עצמו.
חלק ראשון זאת הגרסה. שימו לב שהגרסה מופיעה בחלק הראשון של המסמך. לאחר מכן מופיע משהו שנקרא HTTP סטטוס קוד. זה מספר שמציין מה בעצם התוצאה הסופית של הריספונס.
יש מספר תוצאות, אנחנו עוד מעט נעבור עליהם ונראה איזה בעצם מספרים אלה, מה כל אחד מייצג. ואחר כך צמוד אל המספר הזה, זה HTTP סטטוס טקסט.
הטקסט סך הכל זה טקסט מאוד מאוד קצר, הוא יכול להיות מילה אחת, הוא יכול להיות שלוש או ארבע מילים, ממש טקסט ממש ממש קצר שמתאר את הסטטוס קוד. אז בדרך כלל הטקסט יתאים לסטטוס קוד, זאת אומרת אותם סטטוס קודים יגיעו עם אותם סטטוס טקסטים.
דוגמה, אם הכל בסדר, אז הסטטוס קוד יהיה 200 והסטטוס טקסט יהיה אוקיי. כלומר, אין שום בעיה, בבקשה, קיבלת את הדף שלך בהצלחה.
האזור הבא נמצא כאן והאזור הזה נקרא HTTP ריספונס הדרס. שוב פעם, זהו מידע נלווה בנוגע למסמך הריספונס שמוחזר ללקוח.
דוגמה יכולה להיות מה השעה כרגע, באיזה זמן אני מחזיר לך את ה-Response, תאריך ושעה. דוגמה יכולה להיות מי אני, מי אני מחזיר לך בעצם, אני שרת של בלה בלה בלה ואני מחזיר לך כרגע את התשובה.
כל מיני נתונים נלווים על התשובה עצמה שחוזרת לקליינט, לדפדפן. הדבר הבא שיש לנו זה שורה ריקה, שוב פעם גם כאן, והאזור האחרון זה ה-HTTP Response Body.
זה המידע המרכזי של הרספונס. אם לדוגמה שרת רוצה להחזיר דף אינטרנט שהלקוח ביקש, כל הדף עצמו יוכל רק באזור הזה, ואז הדפדפן מקבל את כל המסמך, ושולף רק מהאזור הזה את הדף ומציג את הדף.
הדפדפן יודע מה הגרסה, מה הסטטוס קוד, מה הסטטוס טקסט, הוא יודע הדרים וכדומה, אבל רק את זה הוא מציג ליוזר, אם לדוגמא אתם רואים שאתם נניח גולשים באינטרנט ומקבלים דף, לא קיבלתם רק את הדף בחזרה, אלא קיבלתם מסמך ריספונס מלא, וכל הדף, יכול להיות שהוא דף עצום בגודלו, הוא לא נמצא רק באזור הזה של ה-HTTP ריספונס באדי,
כי זה המידע המרכזי שהשר"ט מחזיר לקליינט. אז אנחנו יכולים עכשיו לראות דוגמאות אמיתיות. נניח אני כרגע מייצר דוגמה ל-request מספר 1. הנה המסמך, אני רוצה לקבל איזשהו דף, אז אני כרגע כמובן הדפדפן, אז אני מייצר בקשת get request.
ואני גולש לאיזשהו אתר, רגע, מה בדיוק האתר? מה הכתובת האמיתית של האתר? תכף נראה. האזור הזה שאנחנו נמצאים כאן, האזור השני בשורה הראשונה של ה-request, לא מכיל את כל הכתובת, אלא רק את הנתיב היחסי לדף מהכתובת של האתר פנימה.
אז בוא נניח שהדף נמצא באיזושהי תיקייה שנקראת News באתר הזה שאני גולש אליו, ובתוך News יש Sports ובתוך Sports יש דף שנקרא Football.HTML דף HTML רגיל.
אז אנחנו מציינים, או שהדף לדפן מציין, שזה בעצם הדף שאליו אנחנו גולשים אותו אנחנו רוצים. גרסה מאוד סטנדרטית וידועה זה HTTP/1.1 יש גם גרסת HTTP/2 יש גם גרסת HTTP/1.0 נניח שאנחנו ב-HTTP/1.1 אז הנה הדפדפן מציין את הגרסה שכרגע הוא משתמש בה בשביל ה-HTTP
ריקווסט לאחר מכן מגיעים סדרה של הדרים מידע נלווה ושימו לב מה אנחנו רואים בשורה הראשונה אנחנו רואים הוסט הוסט זה לאן אנחנו גולשים אנחנו גולשים www.sports.com הנה בעצם האתר אינטרנט שאנחנו גולשים אליו, האתר מצוין כהדר אחד ויחיד בסדרת ההדרים.
אגב, אין משמעות לסדר של ההדרים, הדר יכול להיות בכל מקום אחר, זה לא קשור למיקום שלו. הנה הדר נוסף שמתאר מה ה-IP אדרס, הכתובת של היוזר.
כך, דרך אגב, אתרים יכולים לדעת איזה יוזר גלש אליהם. יכול להיות שהיוזר הזה הוא יוזר זדוני שרוצה לעשות בלאגן, אנחנו יכולים לקבל את ה-IP אדרס שלו.
אם כמובן הוא גולש מה-IP אדרס המקורי שלו ולא מזייף אותו בכל מיני כלים, אנחנו יכולים לדעת מי זה ולחסום אותו לדוגמה או להכניס אותו לרשימה שחורה או סתם לעשות מעקב אחרי ה-IP אדרס של היוזרים שלנו. אם היוזר הוא לא האקר הוא כמובן לא ישנה או לא יודע איך לשנות את הכתובת המקורית שהדפדפן, שהוא גולש ממנה בעצם.
אז הנה לדוגמה הדר שאומר מהי הכתובת המקורית של הדפדפן, של היוזר, ה-IP אדרס שלו. User agent, עוד בעצם משהו שהוא מאוד נפוץ, זה בעצם מכרוזת שמתארת את הסוג של הדפדפן, הנה אנחנו רואים סוג אופרה לדוגמה, דפדפן מסוג אופרה, ומהי מערכת ההפעלה.
מיני נתונים לגבי המערכת של המחשב הדפדפן וההפעלה שלו וכדומה ויכולים להיות פה עוד הרבה הדרים אחרים אז הנה דוגמה ל-request שמכיל מספר הדרים מאוד מאוד סטנדרטיים לאחר מכן מגיעה השורה הריקה ואם אתם מבקשים דף html או כל get request אחר אין לכם שום מידע נוסף שאתם רוצים מהשרת אני רוצה את הדף html אז את הדף html football.html אז אנחנו מתארים כאן מאיזה
אתר זה נמצא וכאן איזה דף בדיוק זה נמצא. מעבר לזה אין לי יותר מידע שאני צריך לבקש לכן אנחנו בעצם לא שולחים שום דבר בבאדי למעשה לפי המוסכמה הבינלאומית בגט ריקווסט הבאדי צריך להיות ריק לגמרי.
אוקיי אז הנה ריקווסט ראשון. הסרבר יחזיר כדוגמא ל-request הזה. אז הנה יש לנו באותה דוגמא, ריספונס אקזמפל 1, מה בעצם הסרבר מחזיר כ-HTTP ריספונס ליוזר.
הנה מספר הגרסה שאנחנו עובדים איתה, ה-HTTP. לאחר מכן הסרבר מצא את הדף והוא רוצה להחזיר את הדף והכל בסדר ולא היה שום בעיה, אז הוא מחזיר קוד 200. 200 זה קוד שאומר אוקיי הכל בסדר הטקסט יהיה אוקיי.
לאחר מכן הסרבר ממלא את האזור של ההדר בכל מיני נתונים נלווים שמתארים את התשובה עכשיו שמוחזרת. לדוגמה, סרבר, מי אני? אז יש כל מיני סוגי סרברים, יש סרבר שנקרא IIF של מייקרוסופט, יש סרבר שנקרא אפאצ'י, ג'אווה לדוגמה משתמשת הרבה באפאצ'י, PHP משתמשת באפאצ'י.
הנה לדוגמה סרבר אפאצ'י עם מספר גרסה, וזה הסרבר מודיע לקליינט מי הוא, מי הסרבר. תאריך, באיזה תאריך ושעה מדויקים התבצעה התשובה לקליינט?
Content type, מה התוכן שהסרבר כרגע מחזיר לקליינט? טקסט / html אומר שהסרבר מחזיר לקליינט מסמך html טקסטואלי סטנדרטי. וכמובן יכולים להיות כאן עוד כל מיני הדרים שהסרבר מתאר ומחזיר לקליינט.
הדבר הבא ושורה ריקה ולאחר מכן הנה מסמך ה html שמוחזר אנחנו רואים שיש פה html ואת האזור של הhead של ה html כמובן שהוא מלא בכל מיני נתונים והאזור של הbody של ה html מה היוזר רואה פיזית בדפדפן והנה אנחנו רואים כותרת היוזר ביקש אני מזכיר לכם דף של חדשות לגבי כדורגל אז הנה הוא רואה football news מעולה הכל בסדר והסייקל של ה-request
ריספונס נגמר פה הדפדפן שולף את הדף הזה מציג אותו היוזר שמח כל התהליך הזה נקרא ראונד טריפ זאת אומרת יוזר ביקש דף שרת קיבל את הבקשה החזיר לו דף יוזר מקבל דף מציג אותו בואו נראה דוגמה נוספת ריקווסט מספר 2 שהיוזר מבקש שדפדפן מייצר הפעם זה פוסט יוזר רוצה לשלוח מידע
אז בוא נניח שהוא גולש לדף אינטרנט עבור פורום של חדשות ספורט. אז הדף נניח נמצא ב-slash news slash sport slash forum.html. אם אני עכשיו ממלא דף פורום ושולח את הבקשה לפורום, אז כמובן אני רוצה לשלוח דאטה לסרבר וזה לכן יהיה פוסט.
גרסת ה-HTML אותו הדבר, בוא נניח שההדר עם אותו הדבר, הנה אותו אתר, הנה ה-IP אדרס שלי, הנה אני גולש מאופרה, הנה השורה הריקה שיש אחרי זה.
האם עכשיו יהיה מידע בבאדי? בהחלט. אנחנו יכולים למלא את הדף הזה, ללחוץ send ובוא נניח שהוא גולש לעצמו בשביל להוסיף את המידע, אז המידע מגיע בזוגות זוגות של נתונים.
לדוגמה, כותרת של ההודעה שווה "COOL GAME". אמפרסנט אומר מה ההודעה, או סליחה, מה הפרמטר הבא שאנחנו שולחים.