.
DevTools:
مجموعه ابزارهایی که به ما اجازه میده
بفهمیم مرورگر دقیقاً با صفحـه وب چه
کارهایی انجام میده✅
مرحله دوم: پیدا کردن Network
بالای DevTools چند گزینه میبینی.
معمولاً گزینههایی مثل:
Elements Console Sources Network
روی Network کلیک کن.
ممکنه صفحه تقریباً خالی باشه✋
مرحلـه ســوم: Request | درخواسـتها
رو ببین
حالا یک بار صفحه رو Refresh | رفرش
کن.
برای این کار میتونی:
Ctrl + R
یا
F5
رو بزنی.
اگر همه چیز درست انجام شده باشه،
اگهان تـعـداد زیــادی ردیف Network
ظاهر میشه.
•
•
اینها Requestهایی هستن که مرورگر
برای دریافت قسمتهای مختلف صفحه
ارسال کرده📩
چیزهایی مثل این میبینی:
document
css
js
png
svg
font
مرحله چهارم: اولین Request | درخواست
رو انتخاب کن
رو یکی از ردیفها رو کلیک کن... ✅
حالا سمت راست یا پایین صفحه اطلاعات
بیشتری نمایش داده میشه.
دنبال قسمتهایی مثل این بگرد:
Headers
Payload
Preview
Response
فعلاً فقط Headers رو باز کن.
مرحله پنجم: Request | درخواست رو بخون
داخل Headers دنبال قسمت Request URL بگرد.
این آدرس جاییه که مرورگر درخواست رو به اون ارسال کرده.
بعد دنبال Request Method بگرد.
ممکنه نوشته باشه:
GET
یعنی مرورگر از سرور چیزی درخواست کرده.
بعد Status Code رو پیدا کن.
مثلاً:
200
یعنی درخواست با موفقیت پاسخ گرفته.
ممکنه کدهای دیگهای هم ببینی:
404
یعنی چیزی که درخواست شده پیدا نشده.
403
یعنی سرور درخواست رو نپذیرفته.
500
یعنی سمت سرور مشکلی اتفاق افتاده.
اینا همون شماره هاییه که میبینی رو سایت
•
•
مرحله ششم: یک Request واقعی رو تصور کن
مثلا مرورگر این درخواست رو فرستاده:
GET /profile HTTP/1.1
سرور هم ممکنه جواب بده:
HTTP/1.1 200 OK
یعنی:
«درخواستت دریافت شد و من تونستم پاسخ بدم.»
این رفتوبرگشت ساده، یکی از پایهایترین
چیزهایی هست که باید در Web Security
یاد بگیری.
مرحله هفتم: یک چیز جالب پیدا کن
حالا داخل Network دنبال Request
هایی بگرد که وقتی روی اونها کلیک
میکنی، اطلاعات بیشتری در Headers
یا Response میبینی.
یا یک URL که داخلش یک پارامتر وجود داره:
?id=123
یا:
?page=2
امروز قرار نیست چیزی رو دستکاری کنیم☺️
امروز باید با درخواستها آشنا بشی و درک
کنی :)
•
•
کسایی که فردا کنکور دارین؛ امیدوارم
پرقدرت و بدون استرس بهترین نتیجه
رو بگیرین❤️✌️🏻
راه های زیادی برای موفقیت وجود داره
که احتمالا یکیش درسه :)
ولی مطمئن باشید بدون تلاش نه به درس
نه به هیچ موفقیت دیگهای نمیشه رسید👏
•
•
روز دوم | Request چیه و مرورگر دقیقاً
چه چیزی برای سرور میفرسته؟🧐
روز قبل فهمیدیم که وقتی یک سـایت رو باز
میکنیم، مرورگر و سرور با هــمـدیگه ارتـبـاط
برقرار میکنن و بینشون درخواسـت و جواب
رد و بدل میشود.
همچنین در تمرین روز اول یاد گرفتیم که
با DevTools وارد بخش Network بـشـیم
و Requestهای مختلفی رو که هـنـگام باز
شدن یک صفحه ارسال میشن ببینیم.🙌
امروز میخوایم یک درخواست رو باز کنیم
و ببینیم دقیقاً از چه قسمتهایی تشکیل
شده.🔥
•
•
قبلش بریم سراغ یک داستان واقعی :
سال ۲۰۱۰، یک ابزار امنیتی به نام Firesheep منتشر شد.
این ابزار توسط اریک باتلر ساخته شده بود
و یک مشکل مهم در امنیت وب را به شکل
بسیار ساده نشان میداد. »»»
در آن سالها بعضی وبسایتها هنگام
ورود کاربر از HTTPS استفاده میکردند،
اما بعد از ورود، تمام ارتباطات کاربر را به
شکل امن ادامه نمیدادند.
در نتیجه مـمـکـن بود رمز عبور مسـتـقیماً
در اختیار مهاجم قرار نگیرد، اما اطلاعات
مربوط به نشست کاربر در معرض خــطـر
باشد.
برای فهمیدن اهمیت این موضوع، باید یک
سؤال بپرسیم:⚠️
سرور از کجا میفهمد درخواست جدیدی که
از مرورگــر دریــافــت کـرده، مربـوط به همـان
کاربری است که چند لحظه قبل واردحساب
شده است؟
اینجا مفهوم Cookie و Session اهمیت پیدا میکنه 👆⭕️
•