웹개발을 시작하고 나서 머지 않아 알게 되는 프로그램이 있습니다. 바로 fiddler입니다. fiddler를 통해서 주로 통신으로 오고가는 데이터를 확인하기도 하고 변조하기도 하는데요. 오늘은 웹뿐만 아니라 앱 테스트를 할 때도 피들러를 사용할 수 있는데 앱 디버깅을 위한 피들러 설정 방법에 대해 알아보겠습니다.
크게 2가지 부분으로 나뉩니다.
첫번째, 내 로컬 PC에서 피들러 설정하기.
두번째, 모바일 와이파이 설정하기.
첫번째, 내 로컬 PC에서 피들러 설정하기
1. 내 PC에서 피들러 찾기
윈도우 검색창에서 fiddler를 검색해보겠습니다. 한글로 피들러라고 검색하면 안나옵니다.
영어로 fiddler를 입력하세요.
2. 피들러 실행하기
보시는 것처럼 fi <-- 이런식으로 검색하니까 바로 Fiddler4가 검색되었습니다.
제 로컬에 설치되어 있는 피들러는 Fiddler4네요. 그러면 실행시켜보겠습니다.
3. 설정 메뉴 찾기
피들러를 실행시키면 여러가지 메뉴들이 있는데요.
그 중에서 Tools - Options 를 찾고 Options...를 열어보겠습니다.
▼ Tools - Options
4. Options 창에서 Connections 탭 찾기
Options 창을 열었다면 Connections 탭을 엽니다.
첫번째, Allow remote computers to connect 부분을 체크합니다.
그리고 2번에 있는 Fiddler listens on port : 8888 이라고 있는데요.
8888을 기억해두세요. 이따가 모바일에서 설정할 때 입력하려는 포트 번호입니다.
▼ Options - Connections
여기까지 했다면 피들러 설정은 끝났네요.
그럼 모바일 설정을 해보겠습니다.
두번째, 모바일 와이파이 설정하기.
1. 와이파이 메뉴 찾기
본인 핸드폰에서 와이파이 아이콘을 찾고 꾹 눌러줍니다. 보통 UI는 스마트폰마다 차이가 있을 겁니다.
2. 설정메뉴로 들어가기
설정하는 아이콘을 눌러 들어갑니다.
3. 설정 > 고급 찾기
저의 핸드폰은 [고급] 메뉴가 맨 아래 있습니다. [고급] 으로 들어가볼게요.
▼ 와이파이 > 설정
4. 프록시 수동으로 바꾸고 세팅하기.
[고급]까지 들어왔다면 여기서부터 진짜입니다.
1) 프록시
( 설정 안함 / 수동 / 자동 설정 중에 아래 그림처럼 수동으로 선택합니다.)
2) 프록시 포트
아까 피들러에서 설정한 포트번호 8888번을 여기에 입력하면 됩니다.
▼ 와이파이 > 설정 > 고급
3) 프록시 호스트 이름
이 부분에 연결하려고 하는 내 피씨의 아이피(IP)를 적어주면 됩니다.
(그리고 아이피 주소 확인 방법을 모르겠다면 아래 글을 참고하세요.)
5. 저장하기
위에서 프록시(수동), 프록시포트를 피들러 설정 포트와 맞춰주었고
IP까지 설정 완료하였다면
'저장' 버튼으로 저장하세요.
마무리
여기까지 설정을 완료하였다면 디버깅하고자 하는 앱을 실행하고 실행 페이지를 실행해 테스트해봅니다. 일반적으로 피들러는 웹사이트 디버깅을 하는데 주로 사용하는데 이런 식으로 앱 디버깅 역시 가능하다는 점도 알아두면 좋을 것 같습니다. 그럼 도움이 되는 글이길 바랍니다.
