Atkļūdošanas rīki ir būtiski, lai analizētu kodu un identificētu kļūdas. Chrome izstrādātāja rīki piedāvā dažādas funkcijas, kas palīdzēs sekot un saprast tīkla pieprasījumus un izprast, kā tava lietotne sazinās ar serveri. Šajā norādījumā mēs koncentrēsimies uz Fetch-Breakpoints, ar kuriem tu vari apturēt kodu, kad tīkla pieprasījums tiek veikts. Tas ļauj iegūt dziļākus iedziļināšanos par tava lietotnes darbību un ātri atrisināt jebkādas problēmas.
Svarīgākie secinājumi
- Fetch-Breakpoints ļauj apturēt kodu katru reizi, kad tiek veikts tīkla pieprasījums.
- Tu vari norādīt konkrētas URL, lai kontrolētu uzvedību mērķtiecīgi.
- Izstrādātāja rīku tīklā tu vari pārvaldīt, kuras pieprasījumi tika veikti un kas tos veica.
Pamācība soļu pa soļim
1. Piekļuve izstrādātāja rīkiem
Lai strādātu ar Fetch-Breakpoints, vispirms jāatver Chrome izstrādātāja rīki. To vari paveikt, noklikšķinot uz trīs punktiņiem labajā augšējā stūrī Chrome, tad dodoties uz "Papildu rīki" un gala rezultātā nospiežot "Izstrādātāja rīki". Alternatīvi vari izmantot taustiņkombināciju Ctrl + Shift + I Windows vai Cmd + Option + I Mac.
2. Navigācija uz avotiem
Izstrādātāja rīkos tu atradīsi cilnes "Elementi", "Konsole", "Avoti", "Tīkls" un daudzas citas. Tagad jānoklikšķina uz cilnes "Avoti", lai piekļūtu sava projekta avotam. Šeit vari apskatīt savu JavaScript kodu un izveidot break pointus.
3. Fetch-Breakpoint iestatīšana
"Avotu" cilnē ir sadaļa "XHR" vai "Fetch-Breakpoints". Lai iestatītu Fetch-Breakpoint, jānoklikšķina uz attiecīgā pogas, lai pievienotu jaunu break pointu. Tev tiks lūgts ievadīt URL vai daļu no URL, lai pielāgotu break pointu. Tomēr, ja neievadīsi neko, break point tiks aktivizēts visiem veiktajiem Fetch pieprasījumiem.
4. Breakpoint aktivizēšana
Lai pārbaudītu, vai Fetch-Breakpoint ir pareizi iestatīts, veic kādu darbību, kas izsauc Fetch pieprasījumu – piemēram, klikšķinot uz pogas, kas veic datu pieprasījumu. Ja break point strādā pareizi, kods apstāsies šajā punktā un parādīs tevi pašreizējo koda stāvokli.
5. Tīkla pieprasījuma pārbaude
Kad kods tiek apstādināts, tev ir iespēja pārbaudīt mainīgo pašreizējo stāvokli un analizēt tīkla pieprasījumu. Šeit vari pārliecināties, ka tiek iegūti gaidītie dati. Piemēram, ja tavā kodolā seko mainīgais, kas veic Fetch pieprasījumu, vari pārliecināties, vai tiek pieprasīts pareizais galapunkts.
6. Konfigurē specifiskus break pointus
Ja esi ieinteresēts tikai konkrētos Fetch pieprasījumos, vari pievienot jaunu break pointu un norādīt specifisku URL. Piemēram, vari iestatīt URL uz "main.js". Kad izpildi Fetch pieprasījumu šai URL, break point būtu jāaktivizē. Ja neievadi URL, break points attieksies uz visiem tīkla pieprasījumiem, kas būs noderīgi, lai pārbaudītu vispārējas problēmas.
7. Izsaukuma pārbaude
Lai uzzinātu vairāk par iemeslu, kāpēc tika izsaukts Fetch pieprasījums, vari pārslēgties uz "Tīkla" cilni izstrādātāja rīkos. Tur redzēsi sarakstu ar visiem veiktajiem Fetch pieprasījumiem. Kolonnā "Initiators" redzēsi, kura daļa no tava koda izraisīja pieprasījumu. Ja uz vienu no šiem ierakstiem noklikšķini, nonāksi atbilstošajā rindiņā "Avotu" cilnē.
8. Pēdējā pārbaude
Gatavojot grozījumus savā kodā, piemēram, mainot URL, pārliecinies, ka atjaunot izstrādātāja rīkus, lai izmaiņas tiktu pieņemtas. To vari darīt viegli, atjaunojot lapu. Pārbaudi, vai Fetch pieprasījums atkal veiksmīgi darbojas un vai break point tiek aktivizēts tā, kā vēlējies.
Kopsavilkums
Šajā pamācībā esi iemācījies, kā izmantot Fetch-pārtraukumus Chrome Developer Tools, lai apturētu kodu tīmekļa pieprasījumu veikšanas laikā. Tu esi uzzinājis, kā izveidot konkrētus pārtraukumus, lai apturētu kodu tikai noteiktos vietās, kādas informācijas vari iegūt no attīstītāja rīkiem un kā pārbaudīt, kas ir izsūtījis Fetch pieprasījumu.
Bieži uzdotie jautājumi
Kas ir Fetch-pārtraukumi?Fetch-pārtraukumi ļauj apturēt kodu noteiktā vietā, kad tiek nosūtīts Fetch pieprasījums serverim.
Kā iestatīt Fetch-pārtraukumu?Tu vari iestatīt Fetch-pārtraukumu Chrome Developer Tools sadaļā "Avoti", ievadot URL adresi vai vispārēju iestatījumu visiem Fetch pieprasījumiem.
Kā pārbaudīt, vai mans Fetch-pārtraukums darbojas?To vari izmēģināt, veicot darbību, kas izraisa Fetch pieprasījumu. Ja pārtraukums ir aktīvs, atkļūdotājam vajadzētu apturēties.
Ko darīt, ja pārtraucēji netiek izraisīti?Pārliecinies, ka URL ir pareizi ievadīta un ka kods, kas veic Fetch pieprasījumu, tiešām tiek sasniegts. Lapas pārlāde var palīdzēt.
Kā redzēt Fetch pieprasījuma sākotāju?Tu vari redzēt sākotāju Chrome Developer Tools sadaļā "Tīkls". Tur būs redzams, kurš kods ir izpildījis pieprasījumu.
