Narzędzia programisty

Zestaw narzędzi w przeglądarce do małych zadań przerywających prawdziwą pracę

Większość problemów z kodem jest duża i ciekawa. Te, które naprawdę spowalniają, takie nie są. Masz przed sobą zminifikowaną odpowiedź API, JWT, którego nie możesz odczytać, URL psujący swój ciąg zapytania i wyrażenie regularne, które prawie działa. Żadne z tych nie zasługuje na dependency, instalację CLI ani kartę pełną reklam. Zasługują na trzydzieści sekund i czyste pole tekstowe.

To jest cała idea za tym zestawem: jedna strona z darmowymi narzędziami dla programistów, które ładują się błyskawicznie, działają w całości w twojej przeglądarce i nigdy nie proszą o rejestrację. Formatowanie JSON, Base64, kodowanie URL, dekodowanie JWT, konwersja kolorów, testowanie wyrażeń regularnych, przeliczanie czasu i tabela kodów HTTP — wszystko w jednym miejscu. Przestajesz wklejać dane do czegokolwiek, co Google podsuwa jako pierwsze, i przestajesz się zastanawiać, czy ta losowa strona je loguje.

Co robi każde narzędzie

Formater JSON bierze ścianę zminifikowanego JSON-a w jednej linii i zamienia ją w coś, co człowiek jest w stanie przejrzeć. Powiedzmy, że webhook odpala i twoje logi przechwytują surowe ciało jako jeden gigantyczny ciąg. Wklej, wybierz wcięcie dwu- lub czterospacyjne i dostajesz czytelne drzewo z dokładnie wskazanym błędem składni, jeśli takowy jest. Narzędzie waliduje podczas formatowania, więc zbłąkany przecinek na końcu lub klucz bez cudzysłowów zostają wychwycone, zamiast cicho psuć aplikację trzy warstwy głębiej.

Kodowanie/dekodowanie Base64 to workhorse, po który sięgasz bez przerwy, nie zawsze zdając sobie z tego sprawę. Identyfikatory URI danych, nagłówki Basic Auth, binarne bloby upchane w plikach konfiguracyjnych, segmenty tokenu — wszędzie Base64. Zdekoduj wartość nagłówka, żeby sprawdzić, czy poświadczenia są wysyłane tak, jak oczekujesz, albo zakoduj mały obraz, żeby go osadzić inline. Poprawnie obsługuje UTF-8, co ma znaczenie, gdy dane wejściowe to nie samo ASCII.

Narzędzie do kodowania/dekodowania URL naprawia klasyczny błąd, gdy parametr zapytania zawiera spację, ampersand lub znak plus i po cichu psuje żądanie. Jeśli budujesz link ręcznie, a wartość to name=Jan & Co, potrzebujesz, żeby ampersand był zakodowany jako %26, inaczej serwer odczyta go jako separator parametrów. Wklej, zakoduj, skopiuj. Dekodowanie działa w drugą stronę, gdy patrzysz na zalogowany URL pełen kodów procentowych i próbujesz zrozumieć, co naprawdę było żądane.

Narzędzie do tokenów i ważne zastrzeżenie

Dekoder JWT dzieli token na trzy oddzielone kropkami części i pokazuje nagłówek oraz ładunek jako zwykły JSON. Gdy debugujesz uwierzytelnianie, to jest złoto: sprawdź, który algorytm podpisał token, odczytaj sub, potwierdź, że roszczenie exp nie minęło, i dokładnie sprawdź, jakie zakresy lub role twoja brama przekazuje klientowi.

Jest jednak coś, o czym ludzie zapominają. Dekodowanie JWT to nie weryfikacja. Ładunek to tylko Base64url — każdy, kto trzyma token, może odczytać każde roszczenie w nim zawarte, i właśnie to robi to narzędzie, nic więcej. Nie sprawdza podpisu, więc zdekodowany token mówi ci, co token twierdzi, a nie czy jest autentyczny. Nigdy nie ufaj roszczeniom z dekodera przy podejmowaniu decyzji o autoryzacji; to zadanie twojego serwera, z kluczem podpisującym. Używaj dekodera do zrozumienia i debugowania, nigdy do walidacji.

Tester wyrażeń regularnych domyka pętelkę na temat najbardziej frustrującego narzędzia ze wszystkich. Napisz wzorzec, wrzuć przykładowy tekst i obserwuj, jak dopasowania podświetlają się na żywo podczas pisania. Grupy przechwytywania są wylistowane, więc możesz sprawdzić, czy grupa druga naprawdę pobiera rok, a nie całą datę. To bije cykl edytuj-zapisz-uruchom testowania wzorca bezpośrednio w kodzie, i to szybki sposób na zrozumienie, dlaczego zachłanny kwantyfikator pożera więcej, niż zamierzałeś.

Na deser: konwerter HEX↔RGB zamienia #1a2b3c na rgb(26, 43, 60) i z powrotem, gdy tokeny projektowe i CSS się nie zgadzają. Konwerter znaczników czasu Unix zamienia 1718900000 w prawdziwą datę i godzinę, co jest niezbędne za każdym razem, gdy baza danych przechowuje sekundy epoki, a twoje oczy ich nie rozkodują. A tabela kodów statusu HTTP ratuje przed zgadywaniem, czy 422 czy 409 to właściwa odpowiedź, gdy wywołanie API idzie bokiem.

Przetwarzanie lokalne, więc możesz wkleić wrażliwe dane

To najważniejsza część dla każdego pracującego z danymi produkcyjnymi. Każde narzędzie działa po stronie klienta w JavaScript. Twoje dane wejściowe nigdy nie opuszczają przeglądarki — żadnego przesyłania, żadnej podróży do serwera, nic do zalogowania. Oznacza to, że możesz wkleić prawdziwy token dostępu, żeby sprawdzić jego roszczenia, zdekodować nagłówek Base64 zawierający poświadczenie lub sformatować odpowiedź API pełną danych klientów, bez transmisji przez sieć. Chcesz dowodu? Otwórz narzędzia deweloperskie, obserwuj kartę sieciową i wklejaj. Nie zobaczysz żadnego ruchu wychodzącego. Dla wrażliwych danych lokalne narzędzie to nie miły dodatek, to jedyna odpowiedzialna opcja.

Najczęściej zadawane pytania