ايه هي ال API headers؟
هقول مثال عشان يسهل الفكرة في الأول، تعالوا نفترض إني عايز أبعت رسالة في ظرف لواحد بالبريد، دلوقتي أنا كتبت الرسالة وحطيتها جوه الظرف. فاللي ناقص إني أضيف شوية معلومات زي مثلًا (اسم الشخص اللي هيستلم الظرف، وعنوانه، وهكذا) ممكن أكتبها علي الظرف من برة.
1
هقول مثال عشان يسهل الفكرة في الأول، تعالوا نفترض إني عايز أبعت رسالة في ظرف لواحد بالبريد، دلوقتي أنا كتبت الرسالة وحطيتها جوه الظرف. فاللي ناقص إني أضيف شوية معلومات زي مثلًا (اسم الشخص اللي هيستلم الظرف، وعنوانه، وهكذا) ممكن أكتبها علي الظرف من برة.
1
بالنسبة لل APIs بقي هنلاقي إن الرسالة اللي جوة الظرف دي بتمثل ال data اللي بتتبعت من خلال ال API اللي هي ال request body، أما المعلومات اللي كنا كتبناها علي الظرف من برة دي بتمثل ال headers.
فال headers هي عبارة عن ال metadata أو المعلومات الإضافية عن ال request وال response
2
فال headers هي عبارة عن ال metadata أو المعلومات الإضافية عن ال request وال response
2
عشان يحصل التواصل بين ال client وال server.
ال headers بتكون في شكل key و value، ولو عايز تشوف ال headers لموقع ما ممكن تفتح ال dev tools بتاعه chrome وتفتح ال Network tab وت refresh ال page. الصورة اللي تحت دي لما جربت أفتح بروفايل leetcode بتاعي من incognito
3
ال headers بتكون في شكل key و value، ولو عايز تشوف ال headers لموقع ما ممكن تفتح ال dev tools بتاعه chrome وتفتح ال Network tab وت refresh ال page. الصورة اللي تحت دي لما جربت أفتح بروفايل leetcode بتاعي من incognito
3
الصورة بتوضح ال request headers ودعونا نشرح بعض ال headers المذكورة في الصورة عشان كده ركز فيها شوية.
ال authority : ودي بتمثل ال domain name بتاع السيرفر اللي ال request رايحله واللي في حالتنا هو leetcode
ال method : ودي ال HTTP method المُستخدمة هنا واللي هي GET في حالتنا
4
ال authority : ودي بتمثل ال domain name بتاع السيرفر اللي ال request رايحله واللي في حالتنا هو leetcode
ال method : ودي ال HTTP method المُستخدمة هنا واللي هي GET في حالتنا
4
ال schema : ودي البروتوكول المُستخدم عشان ال request يتم هنا وهو HTTPS
ال accept : ودي فيها أنواع ال content اللي ال client يقدر يفهمها ويستخدمها وبتكون في format بالشكل ده type/subtype زي في حالتنا هنا هم text/html و application/xml وغيرهم. بعد كده السيرفر بيختار واحدة
5
ال accept : ودي فيها أنواع ال content اللي ال client يقدر يفهمها ويستخدمها وبتكون في format بالشكل ده type/subtype زي في حالتنا هنا هم text/html و application/xml وغيرهم. بعد كده السيرفر بيختار واحدة
5
من ال formats دي وبتكون هي اللي بترجع في ال response body وال response header بيكون فيه content type وقيمته ال format اللي اختاره.
ال accept-language : وهنا ال header بيقول للسيرفر عن اللغة المفضلة لل client، وفي حالتنا هنا هي en أو English
6
ال accept-language : وهنا ال header بيقول للسيرفر عن اللغة المفضلة لل client، وفي حالتنا هنا هي en أو English
6
ال accept-encoding : ودي لما الداتا بتتنقل ما بين ال client والسيرفر فبيتم إستخدام compression technique معين عشان نحسن السرعة وال bandwidth usage، فالقيمة اللي بتكون هنا بتحدد أنواع ال compression اللي ال client يقدر يفهمها، في حالتنا هنا زي ال gzip أو deflate أو br
7
7
ال cache-control : ده اللي بيتحكم في ال Caching behavior اللي ممكن يتم، ولكن في حالتنا هنا no-cache عشان أنا قافلها فبالتالي ال browser مش هيعمل cache لل response اللي راجع
ال cookie : هنجيلها تاني بس افتكر ان مفيش cookie موجودة عشان ده أول connection حصل بيني وبين السيرفر .
8
ال cookie : هنجيلها تاني بس افتكر ان مفيش cookie موجودة عشان ده أول connection حصل بيني وبين السيرفر .
8
دي كانت نبذة عن ال request headers ولو ركزنا هنلاقي فيه headers تانية بتعرّف السيرفر معلومات عن ال client زي مثلًا ايه ال browser اللي بيستخدمه وايه ال version بتاعته، أو لو هل اليوزر داخل من الموبايل ولا من ال windows، ومن هنا السيرفر بيعرف يديك response content يناسبك أكتر.
9
9
في الصورة اللي تحت دي بقي ال response headers اللي جايه من السيرفر ورايحة لل client، هنا كان ال response هو بروفايل leetcode بتاعي.
هنلاحظ بقي هنا إن السيرفر قرر حاجات زي ال content-encoding واختار إنه ي encode ال response body ب br اللي هو Brotli algorithm
10
هنلاحظ بقي هنا إن السيرفر قرر حاجات زي ال content-encoding واختار إنه ي encode ال response body ب br اللي هو Brotli algorithm
10
هنلاحظ برضو إن ال content-type بتاع ال response هو text/html
فيه date ودي بيحدد الوقت والتاريخ اللي السيرفر عمل فيهم ال response
فيه server وهو Cloudflare وبكده احنا عرفنا إن leetcode بيستخدم CDN وهو Cloudflare بمعني إن ال response اللي رجعلي كان من سيرفر تبع ال CDN ده
11
فيه date ودي بيحدد الوقت والتاريخ اللي السيرفر عمل فيهم ال response
فيه server وهو Cloudflare وبكده احنا عرفنا إن leetcode بيستخدم CDN وهو Cloudflare بمعني إن ال response اللي رجعلي كان من سيرفر تبع ال CDN ده
11
نرجع بقي لآخر نقطة معانا وهي ال cookies. ال cookies هي عبارة عن bits of information بتتبعت من السيرفر لل customer ثم بتتبعت من ال customer للسيرفر. في أول connection بيحصل - السيرفر بيبعت cookie من خلال set-cookie اللي موجودة في ال response header
12
12
ال cookie دي بتتخزن في ال browser بتاع ال client، لو بعد كده أنا جربت أدخل علي الموقع تاني - السيرفر هيفتكرني من ال cookie االي هبعتهاله في ال request header. ال cookies بتكون شايلة معلومات زي sign-in وال search history وغيرها.
وبس كده دي كانت نبذة عن ال API headers وأنواعها.
13
وبس كده دي كانت نبذة عن ال API headers وأنواعها.
13
جاري تحميل الاقتراحات...