fiddler 피들러에 대해 알아보자
TRANSCRIPT
![Page 2: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/2.jpg)
피들러...?
![Page 3: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/3.jpg)
웹(http)...?
![Page 4: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/4.jpg)
웹 디버거 !!!!!
![Page 5: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/5.jpg)
![Page 6: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/6.jpg)
그..... 그만 알아보자.
![Page 7: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/7.jpg)
![Page 8: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/8.jpg)
![Page 9: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/9.jpg)
fiddle [|fɪdl]①[자.동] 만지작거리다②[타.동] (세부 사항을) 조작하다③= violin
④ [명] 조작, 사기
![Page 10: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/10.jpg)
조작하고 속인다.
![Page 11: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/11.jpg)
ServerHost(Capturing)
Clients
감청 조작HTTP Request HTTP Request
HTTP ResponseHTTP Response
fiddle !!
fiddle !!
fiddle !!
fiddle !!
fiddle !!
fiddle !!
fiddle !!fiddle !!
fiddle !!
fiddle !!
![Page 12: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/12.jpg)
fiddler = 무료 http 패킷 디버거 툴
![Page 13: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/13.jpg)
피들러(Fiddler)는 어떻게 생겼을까?
![Page 14: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/14.jpg)
요청과 응답들의 목록
응답
요청
![Page 15: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/15.jpg)
피들러(Fiddler)는 어떤 원리를이용해서 감청하고 조작해줄까?
![Page 16: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/16.jpg)
프록시(Proxy)
![Page 17: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/17.jpg)
피들러는 유틸 프로그램으로써사용자 컴퓨터의 프록시 서버역할을 한다.
![Page 18: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/18.jpg)
프록시란 것은 뭘까?
프록시(Proxy)?
![Page 19: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/19.jpg)
proxy [|prɑːksi]
① [명] 대리(권)② [명] 대리인
![Page 20: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/20.jpg)
클라이언트가 특정 서버를 통해서 다른 네트워크 서비스에 간접적으로접속할 수 있게 해주는 컴퓨터나 응용 프로그램을 프록시 서버한다.
Client Service Server
directly transport to server
indirectly transport to server
Service ServerProxy Server
Clients
packet
![Page 21: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/21.jpg)
피들러(Fiddler)가 프록시(Proxy) 서버이기 때문에모든 패킷을 조작하고 감청할 수 있다.
![Page 22: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/22.jpg)
단,
![Page 23: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/23.jpg)
패킷들이 피들러(Fiddler) 프록시 서버를 통해서 전송하며,HTTP 서비스 프로토콜을 이용한 통신일 경우에 한해서만!
![Page 24: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/24.jpg)
Fiddler에 대한 개괄적인 동작 원리는 프록시 서버의 응용이다.이론은 끝이다. 설치를 해보자! (끝이 어디 있겠습니까. 허허….)
![Page 25: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/25.jpg)
Fiddler Install https://www.telerik.com/download/fiddler다운로드 링크
다운로드 하면서 읽어 보자
![Page 26: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/26.jpg)
설치에 관련된 특이사항
- Telerik사에서 만든 웹 디버깅 프로그램- Windows, MAX OS, Linux Debian (주), Fedora- 리눅스의 설정은 프록시 직접 설정 해주어야한다.- 실제 리눅스에서 피들러를 이용해본 결과 설정 진짜 번거롭다.- Windows는 자동으로 잡힌다.- Browser에서 자동으로 잡히는 경우가 있지만, 자동으로 프록시 설정이
안 잡힌다면, 직접 설정해주어야 한다.
라이선스
- 이건 프리웨어기 때문에 Fiddler 로 인한 고장은 Telerik 에서 보장해주지 않는다.- 옵션으로 당신의 데이터들이 나중의 Telerik 제품을 위해서 전송이 될 텐대 이 정보들은
익명(Anonymous)으로 전송될 것이다. 원하지 않으면 설정에서 변경하라.- 이 소프트웨어의 법과 규칙들은 전부 미국의 수출 법률을 준수한다.- 이것은 서드파티의 유틸리티로서 사용이 가능하며, Telerik 에서 제공하는것이다.- 이 소프트웨어를 이용하여 재가공, 재배포하여 돈을 버는짓을 하면 법적 제재를 가한다.
![Page 27: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/27.jpg)
Fiddler 특징
웹 디버깅
성능 테스트
HTTP/HTTPS 트래픽 기록
웹 세션 조작 보안 테스트
커스터 마이징
쿠키, 헤더, 캐쉬를 조회할 수 있으며 서버의 언어, 클라이언트의 운영체제 및 디바이스에 관계없이 사용할 수 있다.
서비스 되는 웹 페이지의 무게를 측정하거나네트워크의 병목현상도 감지할 수 있다.
쉽게 웹 세션을 조작할 수 있고, 모든 세션작업에서 pause를 걸 수 있으며, 접속자의 요청과 응답을 조작할 수 있습니다.
피들러를 사용해서 웹 어플리케이션에 대한보안(https)를 테스트할 수 있으니, 피들러를통해서 https의 요청을 해석해봅시다
피들러는 확장성이 큰 유틸 프로그램입니다. 간단한 피들러 스크립트는 (.NET 언어로 작성되어 있다.)
피들러는 http 프록시 웹 디버거이기 때문에TLS의 패킷들을 감청할 수 있다.
![Page 28: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/28.jpg)
여기 까지 왔으면 다운로드가 끝나 있을 것이다. 이제! 피들러(Fiddler.exe)를 실행시켜 보자.
![Page 29: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/29.jpg)
설치를 완료하고 실행시킨 뒤, 아무 웹 페이지를 들어가면 다음과 같이자동적으로 Fiddler가 http에 대한 패킷을 감청할 것이다.
![Page 30: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/30.jpg)
만약, Fiddler가 패킷이 감청하고 있지 않다면브라우저의 프록시 설정을 들어가보자.
![Page 31: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/31.jpg)
브라우저의 설정
설정->고급 설정 표시 -> 프록시 설정 변경 -> LAN 설정 -> …프록시 사용 Check!
Check!!
![Page 32: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/32.jpg)
우선 Fiddler의 각각 컨트롤러 패널들을 살펴보자
![Page 33: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/33.jpg)
요청과 응답들의 목록
요청 값 보기
응답 값 보기
패킷 제어 메뉴
프로그램 제어 메뉴서비스 제어 메뉴
빠른 명령줄 상태
![Page 34: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/34.jpg)
드디어
![Page 35: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/35.jpg)
대망의 실습
![Page 36: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/36.jpg)
모바일에서 웹서버에 요청한 후 패킷을 감청 해보자. 그리고 감청한 패킷을 변형 시켜서 다시 웹 서버에 요청해보자
![Page 37: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/37.jpg)
우선 번거롭겠지만 모바일 단말기의 Wi-Fi 설정과데스크 탑의 Fiddler 프로그램의 설정을 잡아야 한다.
![Page 38: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/38.jpg)
Long Tab!!
①
②
③
④
⑤⑥
⑦
Wi-Fi 설정 -> 해당 SSID 롱 클릭 -> 네트워크 수정-> 고급 설정->프록시 설정 사용-> 프록시 호스트, 포트 지정-> 저장
![Page 39: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/39.jpg)
“어.... 음.. 제가 설정을 잘못 잡았나요?”
![Page 40: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/40.jpg)
(또는)
![Page 41: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/41.jpg)
아뇨, 아직 덜 잡으셨습니다….저는 아직 웹 페이지에 접속하라고 안했습니다!
![Page 42: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/42.jpg)
프로그램 제어 메뉴-> Tools -> Telerik Fiddler Options...->Allow Remote Computers to connect 에 Check!!
![Page 43: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/43.jpg)
적당한 설정은 이제 끝났다!(설정에 끝이 어디있겠습니까…. 허허)
모바일 단말기에서 http://smartlock.fun25.co.kr 을 들어가 보자.
![Page 44: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/44.jpg)
엥....? 이거 완전 뚱뚱이 사이트 아냐? (작성자의 웹 페이지입니다..)리소스를 뭐 이리 잡아먹어? (폰트를 누가 *.ttf로..)
![Page 45: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/45.jpg)
로그인을 해봅시다.
![Page 47: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/47.jpg)
/login.do 를 클릭하고 오른쪽 패널의 상단 메뉴에 inspector 를 선택하면다음과 같은 화면으로 요청값과 응답메시지를 확인 할 수 있다.
![Page 48: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/48.jpg)
잘 따라오고 있나요?
![Page 49: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/49.jpg)
이제 요청값을 조작해 보도록 하자 (Manipulate Request data)
![Page 50: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/50.jpg)
요청 값을 조작하기 위해서는 별도의 처리가 필요하다
![Page 51: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/51.jpg)
브레이크 포인트(Break Point)
![Page 52: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/52.jpg)
브레이크 포인트는 동작 중 특정 지점에서 멈춰 세우는 의미로Fiddler 에서는 브레이크 포인트를 걸 수 있는 방법이 세 가지 있습니다.
![Page 53: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/53.jpg)
1. 프로그램 제어 메뉴에서의 Break Point2. 프로그램의 상태 표시줄에서의 Break Point(1번과 동일기능)
3. 빠른 명령줄에서의 스크립팅 이용 (유연한 프레이크 포인트 가능)
![Page 54: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/54.jpg)
①
②③
- 1번과 2번은 같은 기능으로 써 Break Point의 시점을요청 전과 응답 후 로 지정할 수 있습니다.
- 3번은 빠른 명령 실행으로 Alt+Q로 Focus를이동시킬 수 있습니다.
- 3번에 대한 빠른 명령 실행 Documenthttp://docs.telerik.com/fiddler/KnowledgeBase/QuickExec
![Page 55: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/55.jpg)
1번과 2번에 대한 설정은 건너뛰고 개발자 답게 3번으로 실습 해보겠습니다.
![Page 56: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/56.jpg)
Fiddler의 메인 화면에서 [Alt + Q] 단축키를 누르고‘bpu smartlock.fun25.co.kr/[email protected]’ 을 입력해 봅시다.
브레이크 포인트 관련 명령어를 알아보자-bpu : break point url-bpafter : break point [response] after-bpbefore : break point [request] before
Ex) bpu smartlock.fun25.co.kr/[email protected]
![Page 57: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/57.jpg)
Break Point 가 걸린 웹 패킷
Response 에도 Break Point를 걸거나조작(Manipulation)작업의 완료를 선택함
스크립트가 적용되면 해당 영역에 표시됨
uri 명이 smartlock.fun25.co.kr/[email protected] 일 경우에 Break Point에 걸림
Notice !! bpu 명령어는 요청전에 break point를 걸어버린다.
![Page 58: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/58.jpg)
어떤가요? break point는 잘 걸렸나요? 이제 요청값들을 바꿔보도록 합시다.
![Page 59: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/59.jpg)
요청은‘dmlaldjqtdma’으로 하고서 요청값 변조를 통해서‘[email protected]’계정으로 로그인을 할 것이다.
![Page 60: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/60.jpg)
우선, 빠른 명령줄에서 [Alt + Q]‘bpu smartlock.fun25.co.kr/login.do’을 입력해 봅시다.
**Break point 의 해제는 ‘bpu ’만 입력하세요!상태 표시 줄에서 cleard break point 라는 메시지가 나타날 것입니다.
![Page 61: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/61.jpg)
그리고 로그인을 해서 브레이크 포인트에 걸려봅시다.
![Page 62: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/62.jpg)
Test 계정Email : dmlaldjqtdmaPassword : 아무거나
dmlaldjqtdma
● ● ● ● ● ● ●
![Page 63: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/63.jpg)
‘로그인’을 누르고 피들러를 열어보면 다음과 같이 login.do 에break point가 걸려있을 것입니다.
![Page 65: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/65.jpg)
‘Break On Response’를 누르면 응답값이 정상적으로 돌아오는것을 확인 할 수 있습니다.작업이 완료되면 Run to Completion을 눌러 클라이언트에게 전달합니다.
![Page 66: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/66.jpg)
마찬가지로 Break On Response를 잘 활용해서 Response를 수정하면 된다.
![Page 67: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/67.jpg)
드디어 실습 예제 끝!
![Page 68: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/68.jpg)
“잠깐..!!”
![Page 69: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/69.jpg)
“SSL 처리된 http는 어떻게 보는거죠..? 복호화된 문서를 어떻게 보라구요-!?”
![Page 70: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/70.jpg)
클릭하세요. 클릭
![Page 71: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/71.jpg)
이렇게
![Page 72: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/72.jpg)
“딸칵! 딸칵!”
![Page 73: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/73.jpg)
사실 검증을 위해 잠깐의 테스트를 해 봅시다.
![Page 74: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/74.jpg)
https 적용된 웹 페이지 중에.. Naver를 들어가서자신의 계정으로 로그인을 해봅니다
![Page 75: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/75.jpg)
Click-!
Check-!
Https 적용된 웹 사이트에 접속하게 되면 https 패킷이라 나타나는데이때, “HTTPS decryption is ….”를 클릭하고 Decrypt HTTPS Traffic 에다가 체크 합니다.
![Page 76: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/76.jpg)
만약 이 방법이 스마트하지 않다고 생각하면‘프로그램 제어 메뉴 -> Tools -> Telerik Fiddler Options-> Https Tab’
에서 설정할 수 있습니다.
![Page 77: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/77.jpg)
(끝! 을 내려고 했으나. 아쉽다. 그리고 나는 아직 피들러가 불편하다.)
![Page 78: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/78.jpg)
(예정 되어 있는 실습은 끝이지만…. 작성자는 프로 불편러라서…. 더 알아보았습니다…. )
![Page 79: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/79.jpg)
뭔가…. Fiddler를 계속 이용하다 보면 느끼는게 있습니다.
![Page 80: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/80.jpg)
뭐…뭐이리 많아…이 호스트는 어디야..?
이래서 크롬이 램 괴물이라 한거야?
아니.. 지금 그냥 구글링 하는대.. 패킷을 왜 읽어..
![Page 81: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/81.jpg)
1. 내가 원하는 것은 단 한곳의 서비스 서버에서 발생하는 요청과 응답….2. 지금 웹 패킷을 받고 싶지 않아….
3. A와 B의 패킷을 비교하고 싶어요….4. 페이지의 무게와 리소스 로드 시간을 알고 싶어요….
![Page 82: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/82.jpg)
그래서 준비해보았다. 불편하시지 마시라구!
![Page 83: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/83.jpg)
1. 내가 원하는 것은 단 한곳의 서비스 서버에서 발생하는 요청과 응답….
특정 호스트에 대한 내용만 받아보길 원한다면 Filters에서 설정할 수 있다.
![Page 84: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/84.jpg)
Documents: http://docs.telerik.com/fiddler/KnowledgeBase/Filters
① 선택형② 필수
④ 적용
③ 적용1. Network의 범위를 설정한다.
2. 숨길 것인지 보일 것인지에 대한 선택을설정한다.
3. 필터를 적용할 호스트들을 선택한다. 포트를지정하지 않으면 모든 포트에 대해 Listen 한다.
4. 적용한 필터의 내용대로 피들러가 웹 패킷감청에 적용한다.
![Page 85: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/85.jpg)
2. 지금 웹 패킷을 받고 싶지 않아….
패킷 캡쳐의 중단은 세 가지 방법이 있다. 매우 심플하니 길게 설명할 것 도 없다.- F12 키를 누른다.
- File-> Capture Traffic 을 체크한다.- 좌측 하단의 Capturing 상태를 클릭한다.
![Page 86: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/86.jpg)
![Page 87: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/87.jpg)
3. A와 B의 패킷을 비교하고 싶어요….
Ctrl 로 두 개의 패킷만 선택합니다. 그리고 오른쪽 클릭하고‘Compare’ 를 누르거나 ‘[Ctrl]+w’를 누르면 됩니다.
![Page 88: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/88.jpg)
피들러는 Text Compare Tool을 기본적으로 ‘WinMerge’를 사용하는데기본적으로 독자 여러분의 컴퓨터에서 WinMerge는 설치되어 있지 않다.
그러므로 Error Alert를 뿜을 것이다.
![Page 89: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/89.jpg)
그러니 우리는 ‘WinMerge’를 설치해서 사용하면 됩니다. 이 기능 하나 쓰겠다고 WinMerge를 사용해야 하나 자괴감 들고 괴롭겠지만,나름 실무에서 로그 분석할 때나 소스 분석할 때 유용하게 쓰일 수 있습니다.
설치하고 후회는 들지 않을 것입니다. (무료라구요 무료!)
WinMerge는 이클립스에서 Text비교하기 번거로울 때 가볍게 쓰기 좋은 툴이기도 합니다.
참고 : http://winmerge.org/
![Page 90: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/90.jpg)
다운로드 완료 후, 다시 비교하고 싶은 두 패킷을 선택한 다음 ‘Ctrl+w’를 눌러주면다음 화면과 같이 ‘WinMerge’가 실행되어 두 패킷을 비교합니다.
![Page 91: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/91.jpg)
4. 페이지의 무게와 리소스 로드 시간을 알고 싶어요….
패킷의 용량과 로드 된 시간을 파악하기 위해서는우측 패널의 Timeline기능을 활용하면 됩니다.
![Page 92: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/92.jpg)
복수개의 웹 패킷을 선택하고 우측 패킷의 timeline 을 선택하면 됩니다.
![Page 93: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/93.jpg)
진짜 끝!
![Page 94: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/94.jpg)
![Page 95: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/95.jpg)
![Page 96: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/96.jpg)
![Page 97: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/97.jpg)
이제 좀 피들러에 대해 감이 잡히시나요? 이 피피티를 작성하면서 저도 몰랐던것들을 여럿 배웠는대요. 아마 부분 틀린 지식들이 있을거 같기도 합니다.
저 이외에 다른 사람들 보여준다고 이것저것 준비해보았는데, 읽고나서 도움이되었으면 합니다.
그럼
Happy Hacking!!
![Page 98: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/98.jpg)
피드백이나 질문메일은 언제나 환영합니다.제 개인메일로 메일 주시면 친절히 답변 드리겠습니다.
Happy Hacking!
![Page 99: Fiddler 피들러에 대해 알아보자](https://reader034.vdocuments.net/reader034/viewer/2022050806/586fba2c1a28abe57d8b8683/html5/thumbnails/99.jpg)
References
참고 1 : http://www.mehdi-khalili.com/fiddler-in-action/part-1/
참고 2 : http://www.mehdi-khalili.com/fiddler-in-action/part-2/
참고 3 : http://www.telerik.com/fiddler/add-ons [Fiddler 확장 프로그램]
참고 4 : https://www.youtube.com/watch?v=8bo5kXMAcV0 [Fiddler 공식 영상]
참고 5 : http://winmerge.org/ [WinMerge 공식 홈페이지]