Veb-ilovani xaritalash bo‘yicha ma’lumot yig‘ishni URL manzildan boshlash yaxshi usul hisoblanadi. Fayl kengaytmalari, ba’zida URL ichida uchrashi mumkin bo‘lib, ilova yozilgan dasturlash tilini fosh qilishi mumkin. Masalan, .php kabi kengaytmalar aniq ko‘rinadi, lekin ba’zilari murakkabroq bo‘lib, ishlatilayotgan freymvorklarga qarab farqlanadi. Masalan, Java asosidagi veb-ilova .jsp, .do, yoki .html kengaytmalarini ishlatishi mumkin.

Biroq, hozirgi vaqtda veb-sahifalarda fayl kengaytmalaridan foydalanish tobora kamayib bormoqda, chunki ko‘plab dasturlash tillari va freymvorklar endi marshrutlar (routes) tushunchasini qo‘llab-quvvatlaydi. Bu orqali ishlab chiquvchilar URI manzillarni kodning muayyan bo‘limlariga bog‘lay olishadi. Marshrutlardan foydalanadigan ilovalar foydalanuvchiga qanday kontent qaytarilishi kerakligini aniqlovchi mantiqiy tizimga ega bo‘ladi, shuning uchun URL kengaytmalari aksar hollarda ahamiyatini yo‘qotadi.

URL'ni tahlil qilish orqali nishon veb-ilova haqida ba’zi belgilarni olish mumkin bo‘lsa-da, kontekst bo‘yicha yanada aniq ma’lumotlarni sahifaning manba kodida topish mumkin. Firefox brauzeridagi Debugger (Nosozliklarni tozalovchi) vositasi (Web Developer menyusida joylashgan) sahifaning resurslari va kontentini ko‘rsatadi — bu esa ilovaga qarab o‘zgarib turadi. Debugger vositasi JavaScript freymvorklarini, yashirin input maydonlarini, kommentariyalarni, HTML ichidagi mijoz (client) tomonli boshqaruv elementlarini, JavaScript fayllarni va boshqalarni ko‘rsatishi mumkin.

Keling, bu vositani offsecwp ilovasini ochgan holda sinab ko‘ramiz:

16-rasm: JavaScript manbalarini tahlil qilish uchun Developer Tools'dan foydalanish

Bu yerda ilova jQuery JavaScript kutubxonasining 3.6.0-versiyasini ishlatayotganini ko‘ramiz, bu juda keng tarqalgan kutubxona. Ushbu holatda ishlab chiquvchi kodni minifikatsiya qilgan, ya’ni kod hajmini kamaytirish va resurslardan tejamkor foydalanish uchun uni ixchamlashtirgan, bu esa uni o‘qishni biroz qiyinlashtiradi. Yaxshiyamki, Firefox’da kodni "chiroyli" ko‘rinishda ko‘rsatish (ya’ni formatlab berish) imkonini beruvchi Pretty print source tugmasi mavjud, bu tugma ikki qavscha ({{}}) belgisi bilan belgilanadi:

17-rasm: Pretty Print Source tugmasi

Ushbu tugmani bosganimizda, Firefox kodni o‘qish va tushunish uchun qulayroq formatda aks ettiradi:

18-rasm: Firefox'da chiroyli ko‘rinishda kodni ko‘rish

Shuningdek, sahifaning aniq elementlarini tahlil qilish uchun Inspector (Tahlilchi) vositasidan ham foydalanishimiz mumkin. Keling, WordPress bosh sahifasidagi search input (qidiruv oynasi) elementini Inspector yordamida ko‘rib chiqamiz. Buning uchun sahifada qidiruv maydonchasiga pastga aylantirib boring, ustiga o‘ng tugma bilan bosing va Inspect (Tahlil qilish) opsiyasini tanlang:

19-rasm: E-mail kirish maydonini tanlash

Bu harakat Inspector vositasini ochadi va o‘ng tugma bilan tanlagan HTML elementni belgilib beradi:

20-rasm: Inspector vositasidan foydalanish

Bu vosita ayniqsa HTML manba kodi ichidagi yashirin form maydonlarini tezda topishda juda foydali bo‘lishi mumkin.

Endi brauzerga o‘rnatilgan debugger vositasi bilan tanishganimizdan so‘ng, HTTP javob sarlavhalarini tahlil qilish uchun Network Tool va Burp Proxy vositalaridan qanday foydalanishni o‘rganamiz.