2012-01-02 18 views
18

Czy w witrynie socket.io istnieje tryb debugowania po stronie klienta, w którym można dosłownie zobaczyć wszystko, co serwer przesłał użytkownikowi?Debugowanie klienta Socket.io?

Teraz można osiągnąć ten sam efekt z następującego kodu:

socket.on('HELLO', function(arg1, arg2) { console.log('HELLO', arg1, arg2) ... 
socket.on('WORLD', function(arg1) { console.log('WORLD', arg1) ... 

byłoby bardzo wygodne, jeśli mogę to zrobić z łatwością, bez narażania console.log wszędzie.

Odpowiedz

7

Można go łatwo zobaczyć w przeglądarce Webkit za internetową inspektora (Chrome, Safari, chrom) Aby to zrobić

  • prawym przyciskiem myszy na stronie
  • Go do Zbadaj element
  • kliknij na karta sieciowa
  • Załaduj ponownie stronę z otwartą zakładką sieci.
  • Możesz zobaczyć wszystkie zasoby za pomocą żądania http pobierania i ich odpowiedzi są ładowane.
  • Znajdź pierwsze żądanie dla serwera socket.io.
  • Spowoduje to wyświetlenie listy dostępnych transportów wiadomości.
  • Klient Socket.io odbierze pierwszy dostępny transport. (Websockets, jeśli są obsługiwane przez przeglądarkę)
  • Teraz w drugim żądaniu zobaczysz wszystkie odpowiedzi wracające w zakładce "ramki".

Reference image for web inspector

2

Od wersji 1.0 Socket.io można ustawić "debug" własność w swoim localStorage na "*". Następnie otrzymasz wszystkie dzienniki klienta. Możesz nawet filtrować, ponieważ używa pod maską https://github.com/visionmedia/debug. To wszystko jest ładnie udokumentowane tutaj: http://socket.io/docs/logging-and-debugging/

+2

Dokumentacja nie jest taka ładna. Jeśli chcesz widzieć tylko te linie z nowymi danymi pochodzącymi z gniazda, ustaw flagę debugowania na "socket.io-client: socket". Mam nadzieję, że może to pomóc jako przykład filtrów (wspomnianych w dokumentach w/o przykład). –

14

Wklej to do konsoli kliknij wejść i odświeżyć swoją stronę:

localStorage.debug = '*'; 

Aby uzyskać tylko informacje debugowania z danych przychodzących z gniazdka, wklej to zamiast:

localStorage.debug = 'socket.io-client:socket';