fiddler 소개

fiddler는 웹 요청을 캡처하여 요청에 대해 파악하고 디버깅을 할 수 있는 debugging proxy tool이다.

웹 브라우저에서 개발자 도구를 사용해도 요청을 확인할 수 있고 디버깅이 가능하지만 페이지가 전환되는 경우 이전 페이지에서의 요청은 확인하기 어렵다.

이런 경우 fiddler를 사용하면 요청을 확인하기 편하다.

fiddler의 경우 현재 유료 버전을 제공하면서 Fiddler Everywhere, Fiddler Jam 같은 도구들을 제공하고 있는데 무료로 사용할 수 있는 Fiddler Classic을 다운로드하여 사용하면 된다.

웹 요청 외 network protocol을 분석하고 싶은 경우엔 wireshark를 사용하면 된다.

fiddler 사용하기

fiddler를 설치하고 실행하면 기본적으로 웹 트래픽을 캡처하는 상태가 된다.

왼쪽은 캡처되는 트래픽이 시간에 따라 지속적으로 표시되는 화면이고 왼쪽에서 캡처된 항목 중 하나를 선택하면 해당 캡처에 대해 오른쪽에서 탭을 선택하여 관련 내용을 확인할 수 있다.

만약 캡처를 중단하고 싶으면 F12를 누르거나 File -> Capture Traffic을 선택하여 비활성화하면 된다.

그냥 Capture를 시작하면 온갖 요청을 다 캡처하기 때문에 내가 원하는 요청에 대해서만 파악하기 어렵다.

따라서 내가 원하는 웹 요청에 대해서만 캡처하려면 Filter를 설정하면 된다.

Fiddler 화면 오른쪽 항목에서 Filter 탭을 선택 -> Use Filters를 체크하여 활성화한 후 내가 원하는 조건을 설정하면 된다.

예를 들어 tistory.com 도메인만 캡처하고 싶은 경우 Request Headers를 다음과 같이 설정하면 된다.

Filter를 하는 다양한 조건들을 설정할 수 있기 때문에 알면 알수록 사용이 편해진다.

http 요청은 별다른 설정을 하지 않더라도 바로 캡처 확인이 가능하다.

하지만 요즘 대부분의 웹 사이트들이 https로 운영된다.

Https 요청의 경우 캡처는 되지만 회색으로 표시되며 캡처된 내용을 확인할 수 없다.

암호화된 Https 프로토콜의 내용을 복호화하려면 Https traffic에 대해 복호화 설정을 해야 한다.

상단 메뉴의 Tools -> Options -> Https 탭을 선택하고 Decrypt Https traffic을 활성화한다.

활성화 시 Https traffic을 intercept 하기 위한 인증서 생성을 신뢰할 것인지 물어본다.

인증서를 설치하고 확인을 하여 Options 창을 닫고 다시 웹 요청을 하면 이후 요청부터는 파란색이나 검은색으로 활성화되어 캡처된다.

해당 요청을 선택하고 Inspectors 탭을 선택하면 Response Body를 decode 할지 여부를 묻는 탭이 화면에 보인다.

이 탭을 클릭하면 캡처된 내용을 이후 확인할 수 있게 된다.

Inspectors 탭의 위쪽은 Request에 대한 내용이고 아래쪽은 Resposne에 대한 내용이다.

요청이 올바르게 되었는지 또는 응답이 원하는 형태인지는 각 위치에서 확인하면 된다.

내 경우 잘 사용하다가 어느 순간 Https traffic Capture가 제대로 되지 않았다.

알고 보니 오래 사용하여 인증서가 만료된 경우였다.

이런 경우 Tools -> Options -> Https 탭의 Actions를 선택하여 인증서를 reset 하고 재발급받으면 해결된다.