همونطور که خاطرتون هست، در جلسه قبل در مورد تبدیل Inspector به یک ویرایشگر قدرتمند، اطلاعاتی رو در اختیارتون قرار دادیم و با مثالها و تصاویری که قرار دادیم، شما رو بصورت کامل با اون و ویژگی هاش آشنا کردیم.
در این جلسه میخوایم در مورد بلاک کردن درخواستهایی خاص صحبت کنیم و مبحث Block Request در Inspector رو بصورت کامل یاد بگیریم.
همونطور که میدونین با استفاده از تب Network میتونیم همه درخواستها و Request هایی که مرورگر از سرور میکنه و اونا رو دریافت میکنه رو با اطلاعات کامل مشاهده کنیم.
برای مثال سایت سون لرن رو میاریم و به تب Network رفته و صفحه رو رفرش میکنیم. خروجی همانند تصویر خواهد بود:
همونطور که میبینید تمامی درخواستهای مربوط به سایت سون لرن قرار گرفته است. خب حالا فرض کنیم به هر دلیلی بخوایم یک یا چند عدد از این درخواستها رو بلاک کنیم و دیگه مرورگر اونا رو از سرور درخواست نکنه.
برای اینکار ابتدا بر روی فایل یا درخواست مورد نظر کلیک راست کنید:
میبینید که دو گزینه در این زمینه وجود داره:
بر روی گزینه Block request URL کلیک کنید. با اینکار وارد تب Request Blocking میشیم و در اینجا میتونیم مدیریت کاملی بر روی درخواستهای بلاک شده داشته باشیم:
همونطور که میبینید آدرس همون فایلی که بلاک کردیم در اینجا قرار داده شده و در جلوی اون تعداد دفعاتی که این فایل درخواست شده ولی بلاک شده است رو قرار میده که در این حالت ما، چون تازه اون رو بلاک کردیم 0 هست.
اگر صفحه رو در این حالت یکبار رفرش کنیم، این عدد به 1 تبدیل میشه و در تب Network جلوی این فایل و در قسمت Status عبارت (blocked:devtools) قرار میگیره. بصورت زیر:
در تب Request Blocking گزینه ها بصورت زیر هستند:
بر روی هر الگو که هاور کنیم، دو آیکون نمایش داده میشه:
با کلیک بر روی 1 میتونین این الگو رو ویرایش کنید. با کلیک بر روی 2 میتونین این الگو رو حذف نمایید.
فرض کنید که بخوایم کاری کنیم که سایت سون لرن بدون استایل نمایش داده بشه. برای اینکار بر روی + کلیک میکنیم و الگوی زیر رو قرار میدیم و بر روی Add کلیک میکنیم:
حالا اگر صفحه رو رفرش کنیم میبینیم که سایت دیگه استایلی براش لود نشده. در این حالت اگر تبهای Console و Network رو ببینید بصورت زیر خواهند بود:
میبینید که تب Network یک علامت warning زرد قرار گرفته و در Console نیز بیان شده که فایل مورد نظر توسط DevTools بلاک شده است. امیدوارم این امکان و قابلیت بدردتون بخوره و بتونین ازش استفاده کنید.
امیدوارم از این مطلب خوشتون اومده باشه.
موفق باشید
یا علی
سون لرن • آموزش...