istovarite i prije nego što pokrenete događaje i kako ih jednostavno otkloniti!

tl; dr. - ako ste ovdje samo za trik o tome kako postaviti točku prekida i zapravo ispraviti uklanjanje pogrešaka i prije ponovnog učitavanja slušatelja događaja, idite ravno na odjeljak „Trik za uspješno uklanjanje pogrešaka / prethodno pokretanje liste slušatelja događaja“ ispod.

Kao što to često radim, tražio sam potencijalne ranjivosti na dobro poznatim web mjestima i web aplikacijama. Postoji određeni za koji imam razloga vjerovati da bi mogao biti ranjiv na ozbiljno iskorištavanje XSS-a.

U nekom sam trenutku postupka shvatio da dio koji bi mogao biti ranjiv na XSS izvršava slušatelj praznjenja događaja koji je registriran nekim JavaScript kodom na web mjestu. Ovdje sam morao otkloniti pogrešku kako bih mogao reći da li sam ovdje pronašao nešto zanimljivo ili ne.

Tako sam postavio prijelomnu točku na kojoj je kôd koji bi trebao biti aktiviran događajem uklanjanja i ponovno učitao stranicu kako bi se moj preglednik Google Chrome zaustavio na toj mojoj prijelomnoj udaljenosti, dopuštajući mi da to ispravim.

Za one od vas koji imate dovoljno iskustva s JavaScript-om, sljedeće vas neće nimalo šokirati: preglednik je u potpunosti zanemario moju prijelomnu točku i normalno učitao stranicu.

To je vrsta neugodno Mislim, bilo koji JavaScript kod koji se namjerava izvršiti u ovom događaju izvrsno je izveden - bilo da je to console.log (), localStorage.setItem () ili bilo koja druga standardna radnja. Pa što nije u redu s mojom prijelomnom točkom? ili postavljanje ispravljača pogrešaka; naredba? Zašto to ne rade?

Da bismo razumjeli ovo ponašanje, ima smisla prvo razumjeti te događaje. Svrha ovih događaja je omogućiti web mjestu da izvrši unaprijed konfigurirane akcije neposredno prije njega, istovara i kada se istovara.
 Ili, da budemo precizniji, kako je spomenuto u MDN-u: "Događaj prije pokretanja pokreće se kad se otvori prozor, dokument i njegovi resursi" i "Dostupni događaj se pokreće prilikom istovara dokumenta ili podređenog izvora. ”. (što znači da se ne odnosi na web mjesto već u prozoru koji živi unutar web lokacije, bilo da je to gornji okvir ili iframe)

Zato pokušajmo navesti različita svojstva ova dva događaja i usporediti ih:

Redoslijed: prije pokretanja uvijek će se aktivirati prije istovara događaja (ima smisla, zar ne?)

Svrha: događaj prije učitavanja pokreće se neposredno prije nego što je istovario prozor. istovar bi se pokrenuo tijekom istovara prozora.

Moguće otkazivanje: događaj prije učitavanja može se otkazati interakcijom korisnika:

Gornji primjer pokrenut će skočni prozor koji će pitati korisnika je li siguran da želi napustiti web mjesto ili ne, a u slučaju da odluči da ne odlazi, događaj prije učitavanja bit će otkazan, događaj istovara nikad se neće pokrenuti, a stranica neće se ponovno učitati. S druge strane, to se ne bi dogodilo za događaj istovara - jednom kad se aktivira, ne postoji način da se spriječi istovar prozora.

Podržani objekti: I prije i istovar događaja se mogu registrirati i slušati putem prozora, HTMLElementBody i HTMLFrameSetElement

Vrijedno je spomenuti da svojstva istovara sva tri (prozor, tijelo i okvir okvira) upućuju na isto mjesto (isto vrijedi i za prije učitavanje):

Oh, a za one koji se pitate "što je na svijetu okvir?" - ne brinite se. To je ovaj super stari i zastareli element koji se uopće više ne koristi. Zapravo je trenutno definiran kao zastario, što znači da bi u bilo kojoj novoj verziji bilo kojeg većeg preglednika mogao biti u bilo kojem trenutku!

Prototip: Budući da je istovar uobičajen događaj koji nasljeđuje od događaja, prije nego što preuzme ima vlastiti prototip, PreUnloadEvent. Ovo je način da se implementira jedinstvena imovina returnValue događaja prije učitavanja, koja registriranom slušatelju događaja omogućuje prikaz dijaloškog okvira "Jeste li sigurni da želite napustiti ovu web lokaciju?"

Pa kako može jedan program za uklanjanje pogrešaka prije pokretanja / iskrcaj slušatelja događaja?

A sada na cool dio! Kao što sam rekao na početku, uklanjanje pogrešaka u tim događajima poprilično je škakljivo jer, kad razmislite, to ne biste mogli. Svrha događaja uklanjanja i prije ponovnog učitavanja vrlo je jasna: izvršite skup unaprijed konfiguriranih radnji prije i kad se stranica istovara. Zajamčeno je da se u potpunosti izvršavaju sinkronizirane radnje, ali kada je riječ o asinhronim radnjama koje pokreću sinkronizirane radnje unutar slušatelja događaja, preglednik je više kao "Dat ću sve od sebe da izvršim sve vaše radnje, ali kad događaj istovara" ne mogu vam ništa obećati ".

Ali slaže li se preglednik da izvrši bilo koju vrstu radnje? Odgovor je ne. Postoje neke vrste radnji koje se po specifikaciji ne smiju izvoditi unutar slušatelja događaja prije pokretanja / učitavanja. alar () je jedan primjer, ali najrelevantniji je ispravljanje pogrešaka; (niti je postavljanje prijelomne točke pomoću programa za razvoj).

Dakle, postavljanje točke prekida u slušaocu, postavljanje ispravljača pogrešaka; Izjava ili bilo što drugo stvarno - preglednik bi sve zanemario, što onemogućava ispravljanje pogrešaka događaja istovara / prije preuzimanja.

Trik za uspješno uklanjanje pogrešaka iskrcaj / prethodno pokrenite Slušatelje događaja

Dakle, natrag na svoju priču ... Nakon nekoliko sati pokušaja uspješnog uklanjanja pogrešaka slušatelja sumnjivog istovara, odustao sam od noći jer je bilo vrlo kasno. Dok sam pritisnuo mali x gumb kako bih zatvorio karticu, očekujući da se ona isključi, zadivljena sam da napokon vidim svoj rad prekida!

Očito postoji jedan tok iskrcavanja u kojem preglednik poštuje prijelomne točke i ispravljanje pogrešaka; Izjave - ne uobičajeno ponovno učitavanje stranice, već stvarni pokušaj da se njena kartica u potpunosti zatvori!

I dalje sam nakon toga spavao jer je stvarno bilo kasno - ali od tada mogu lako ukloniti ispravljanje programa za iskrcavanje / prije punjenja slušatelja događaja!

Savjeti za istraživače
  1. Držite dodatnu karticu otvorenu u prozoru preglednika Chrome - nakon što pomoću trika za uklanjanje pogrešaka slušatelja, iako ćete ih moći ispraviti, nećete moći spriječiti da se kartica isključi. To je lakše opetovano raditi tijekom istog prozora, što bi bilo moguće samo ako jezičak za zatvaranje nije jedini jezičak u prozoru.
  2. Google Chrome preglednik - nisam provjeravao djeluje li ovaj trik na druge preglednike osim Chroma, uglavnom zato što ne vidim razlog za uklanjanje pogrešaka JavaScripta u bilo kojem drugom pregledniku (da, rekao sam to).
     Možda će funkcionirati i na drugim preglednicima - opet, nikada nije čak ni provjereno.
  3. Prvo shvatite svoj slučaj - ako je kôd koji pokušavate ukloniti pogreškom, iz nekog razloga, sesija, zatvaranje sesije (pomoću trika iznad i zatvaranja kartice) svaki put mogao stvoriti drugačiji tok od onoga što zapravo pokušavate istražiti - uzmite to u obzir prilikom uklanjanja pogrešaka!
Savjeti za programere
  1. Nema dugih radnji unutar ovih slušatelja - iako praktički možete sinkronizirano raditi što god želite u slušaocima, to je loša praksa! Izbjegavajte duge radnje kako biste bili sigurni da nećete spriječiti korisnika da nesmetano istovari vašu web lokaciju.
  2. Upotrijebite sendBeacon () u slučaju da morate poslati podatke prije istovara - ponekad ima smisla da web stranica želi poslati neke POST podatke kada se stranica sprema učitati. Da bi se to uspješno učinilo, izumljen je sendBeacon (). (kao što je, ozbiljno, doslovno izmišljeno za ovaj slučaj), pa se obavezno poslužite ako želite znati sigurno da se vaši podaci šalju bez očekivanja odgovora.
Da sumiram

Nadam se da je ovo imalo smisla i da će vam pomoći da razumijete ova dva jedinstvena događaja, njihovu svrhu i njihove razlike. Također, nadam se da će vam ovaj trik za uklanjanje pogrešaka biti koristan - siguran sam!

Ako sam propustio bilo što ili nisam u pravu s bilo čime od onoga što sam rekao u ovom članku, volio bih to čuti kako bih se mogao ispraviti i održati ovaj post što točnijim i što korisnijim!

Oh, i oprosti što nema demonstranata jsfiddle .. iz nekog razloga prije nego što su učitali i ispraznili događaji, nisu s njom baš lako.
 Preporučujem vam da samo kopirate i zalijepite gornje isječke u Chromeovu konzolu za razvoj na bilo kojoj web stranici i uvjerite se sami.

Edit: Ugrađen način uklanjanja pogrešaka bilo kojeg prijavljenog slušatelja događaja u kromiranim devtoolsima upozorio mi se kao još jedan način uklanjanja pogrešaka prije nego što se učitaju slušatelji događaja. Doista je to izvrstan način, ali:

  1. Može se koristiti samo za uklanjanje pogrešaka prije nego što se dogodi prije učitavanja, dok trik koji ovdje predstavljam omogućava vam uklanjanje pogrešaka i događaj uklanjanja.
  2. Omogućuje vam uklanjanje pogrešaka svih registriranih slušatelja, što je vrlo neugodno i nepotrebno na složenim web lokacijama gdje ima puno registriranih slušatelja događaja i želite samo ispraviti pogrešku određenog.

Napisao Gal Weizman.