Opis
Podglądacz HTML służy do analizy kodu po sanitizacji i porównania renderu z oczyszczonym źródłem. Przydaje się, gdy chcesz sprawdzić, co zostało zachowane, co usunięto i czy pozostały znacznik nadal ma sens wizualny oraz strukturalny. Narzędzie działa po stronie klienta i pozwala szybko przejrzeć wklejony markup. Możesz zweryfikować odnośniki, znaczniki multimediów, atrybuty w linii i komunikaty walidacyjne przed przeniesieniem treści do strony, pola CMS, szablonu wiadomości lub pliku eksportu.
Zastosowania
- Kontrola fragmentów z CMSSprawdź fragment skopiowany z pola treści przed wstawieniem go do układu strony lub szablonu.
- Analiza importowanego HTMLZobacz, które elementy pozostają po sanitizacji kodu z innego systemu lub eksportu.
- Weryfikacja wyniku edytoraSprawdź adresy linków, znaczniki obrazów i formatowanie wygenerowane przez edytor przed zapisaniem.
- Audyt zgłoszeń użytkownikówPrzeanalizuj markup z komentarzy, profili lub wpisów i zobacz, co zostało usunięte.
Jak to dziala
- 1
Wklej HTML do pola wejściowego.
- 2
Narzędzie sanitizuje kod lokalnie.
- 3
Sprawdź podgląd renderu i oczyszczone źródło.
- 4
Przeanalizuj linki, obrazy, atrybuty i uwagi walidacyjne.
- 5
Skopiuj oczyszczony HTML, jeśli spełnia wymagania.
Przyklady
Usuwanie skryptu inline
Wejscie: <p>Czytaj więcej <script>alert('x')</script><a href='https://example.com/post'>tutaj</a></p>
Wynik: <p>Czytaj więcej <a href="https://example.com/post">tutaj</a></p>
Element script jest usuwany, a bezpieczny akapit i link zostają zachowane.
Usuwanie niebezpiecznego atrybutu
Wejscie: <img src='avatar.png' onerror='alert(1)' alt='Avatar'><span>Profil</span>
Wynik: <img src="avatar.png" alt="Avatar"><span>Profil</span>
Niebezpieczne obsługi zdarzeń są usuwane z tagu obrazu.
Porządkowanie błędnie zagnieżdżonego kodu
Wejscie: <div><strong>Tytuł<p>Treść</strong></p></div>
Wynik: <div><strong>Tytuł</strong><p>Treść</p></div>
Widok pokazuje oczyszczoną strukturę, dzięki czemu łatwiej zauważyć błędne zagnieżdżenie.
FAQ
Co dzieje się z moim HTML podczas podglądu?
Narzędzie usuwa niebezpieczne lub niedozwolone fragmenty podczas sanitizacji i pokazuje wynikowy, oczyszczony markup, więc podgląd może różnić się od oryginału.
Dlaczego część atrybutów znika?
Usuwane są atrybuty, które mogą uruchamiać skrypty, zmieniać zachowanie albo psuć dozwolony wynik. Dotyczy to między innymi obsługi zdarzeń.
Czy mogę polegać na podglądzie jako wyniku końcowym?
Traktuj go jako etap weryfikacji, a nie zastępstwo walidacji po stronie aplikacji. Różne środowiska mogą dopuszczać inne znaczniki i atrybuty.
Dlaczego uszkodzony HTML wygląda inaczej po wklejeniu?
Przeglądarka i sanitizer normalizują błędny markup. Mogą przez to zmienić kolejność tagów, domknąć je automatycznie albo przenieść tekst do poprawniejszej struktury.