[번역] Socket.IO - 로깅과 디버깅

1.0 이전에 기본적으로 Socket.IO 서버는 모든 것을 콘솔에 기록했다. 이는 사용자들에게 성가신 결과를 가져왔다. (다른 사람들에겐 아주 유용했어도), 그래서 이제 우린 기본적으로 완전 조용해졌다.

기반 아이디어는 Socket.IO 에 의해 사용되는 각 모듈이 내부에 대한 통찰력을 제공하는 다른 디버깅 스코프를 제공하는 것이다. 모든 출력은 기본적으로 억제되며, 환경 변수(Node.js)에 DEBUG 혹은 localStorage.debug 프로퍼티 (브라우저)를 제공해 메시지를 표시할 수 있다.

우리 홈페이지에서 확인할 수 있다.

https://i.cloudup.com/transcoded/IL9alTr0eO.mp4

사용할 수 있는 디버깅 스코프

무슨 정보가 이용가능한지 보는 최고의 방법은 *를 사용하는 것:

DEBUG=* node yourfile.js

혹은 브라우저에서:

localStorage.debug = '*';

그리고 관심있는 스코프로 필터링한다. * 앞에 스코프를 붙일 수 있고, 두 개 이상이라면 콤마를 붙여 구분한다. 예를 들어 Node.js 에서 디버그 진술만 보려면:

DEBUG=socket.io:client* node yourfile.js

engine과 socket.io로부터 모든 디버그 메시지 보기:

DEBUG=engine,socket.io* node yourfile.js

브라우저 번들에서 디버그 제거

개발중엔 유용하나 디버그 패키지는 최종 번들에 추가 용량이 필요하다. (축소 및 gzipped 해서 약 4KB) 그래서 슬림 번들에선 제외되었다. (여러 브라우저 번들에 대해 더 자세한 정보는 여기서 찾을 수 있다.)

webpack 을 사용한다면, webpack-remove-debug를 사용해 제거할 수 있다.

{
  module: {
    rules: [
      {
        test: /\.js$/,
        loader: 'webpack-remove-debug'
      }
    ]
  }
}

브라우저 콘솔에서의 에러

다음과 같은 에러 로그들은 Socket.IO 라이브러리에 의해 방출되는 것이 아니고 브라우저 자체에서 방출된다. 그러므로 통제 밖의 에러이다.

• net::ERR_INTERNET_DISCONNECTED
• net::ERR_CONNECTION_REFUSED
• WebSocket is already in CLOSING or CLOSED state
• Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at xxx. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
• The connection to xxx was interrupted while the page was loading