SlideShare a Scribd company logo
1 of 9
Fiddler
신명대
■ Fiddler 소개
제가 소개할 것은 Fiddler 웹 디버깅 툴 입니다.
요즘은 각 브라우저에 디버깅 기능이 내장되어 있어서 유용하게 사용하고
있습니다.
Fiddler는 설치형 입니다. 하지만 용량이 적으며, 브라우저에 상관없이 디
버깅이 가능한 툴입니다.
제가 Fiddler를 사용하는 이유는 Ajax 통신시 디버깅 하기에 가장 수월하기
때문입니다. 그리고 세션 리스트들과 각 세션에 대한 요청, 응답 정보들을
쉽게 체크할 수 있습니다.
■ Fiddler UI 소개
Session List
네트워크 통신 중인 세션 리스트를 출력해 줍니다.
검색, 필터링이 가능하며 각 세션 리스트를 클릭하면 상세정보를 볼 수 있
습니다.
Inspectors
Ajax관련 기능을 디버깅 할 때 제일 많이 사용하는 기능입니다.
해당 세션의 request의 다양한 정보와 response의 정보 그리고 response
의 내용도 볼 수 있습니다.
■ Fiddler 기본 구조
클라이언트 서버Fiddler
■ Fiddler 세션리스트 소개
Result : Session의 고유아이디
Protocol : Session을 주고 받는 방식
Host : 값이 출발하는 장소
URL : 주소입니다.
Body : 전송량
Content-Type : 컨텐츠의 종류를 나타냄
예) 문서, 웹페이지, 프로그램….
Process : Session을 이용하고있는 프로
그램과 프로그램아이디(PID)를 표시
■ Fiddler 세션리스트 검색
검색( 컨드롤 + f )
검색하고자 하는 키워드를 검색하면 검색
결과 리스트이 구분되어서 보입니다.
■ Fiddler 세션리스트 정보 보기(JSON)
Request
Response
■ Fiddler 세션리스트 정보 보기(TextView)
Request
Response
■ Fiddler 웹사이트
http://www.telerik.com/download/fiddler

More Related Content

What's hot

막하는스터디 두번째만남 Express(20151025)
막하는스터디 두번째만남 Express(20151025)막하는스터디 두번째만남 Express(20151025)
막하는스터디 두번째만남 Express(20151025)연웅 조
 
HTTP 완벽가이드- 19장 배포시스템
HTTP 완벽가이드- 19장 배포시스템HTTP 완벽가이드- 19장 배포시스템
HTTP 완벽가이드- 19장 배포시스템박 민규
 
HeadFisrt Servlet&JSP Chapter 3
HeadFisrt Servlet&JSP Chapter 3HeadFisrt Servlet&JSP Chapter 3
HeadFisrt Servlet&JSP Chapter 3J B
 
막하는 스터디 첫 번째 만남 Node.js
막하는 스터디 첫 번째 만남 Node.js막하는 스터디 첫 번째 만남 Node.js
막하는 스터디 첫 번째 만남 Node.js연웅 조
 
1. 미티어의 폴더구조
1. 미티어의 폴더구조1. 미티어의 폴더구조
1. 미티어의 폴더구조seung-hyun Park
 
Json view 예제 설명
Json view 예제 설명Json view 예제 설명
Json view 예제 설명Hyung Eun Jin
 
Http2(http2.0,g rpc,cookie,session,idempotent, x forwarded-for)
Http2(http2.0,g rpc,cookie,session,idempotent, x forwarded-for)Http2(http2.0,g rpc,cookie,session,idempotent, x forwarded-for)
Http2(http2.0,g rpc,cookie,session,idempotent, x forwarded-for)진태 이
 
자바 서블릿과 세션 (Java Servlet, Session)
자바 서블릿과 세션 (Java Servlet, Session)자바 서블릿과 세션 (Java Servlet, Session)
자바 서블릿과 세션 (Java Servlet, Session)Yu Yongwoo
 
진짜기초 Node.js
진짜기초 Node.js진짜기초 Node.js
진짜기초 Node.jsWoo Jin Kim
 
Node.js DBMS short summary
Node.js DBMS short summaryNode.js DBMS short summary
Node.js DBMS short summaryHoChul Shin
 
[Week2] 데이터 스크래핑
[Week2] 데이터 스크래핑[Week2] 데이터 스크래핑
[Week2] 데이터 스크래핑neuroassociates
 
Leadweb Nodejs
Leadweb NodejsLeadweb Nodejs
Leadweb Nodejs근호 최
 
[PHPFest 2013] PHP 성능 향상 방법
[PHPFest 2013] PHP 성능 향상 방법[PHPFest 2013] PHP 성능 향상 방법
[PHPFest 2013] PHP 성능 향상 방법phpkorea
 
Selenium을 이용한 동적 사이트 크롤러 만들기
Selenium을 이용한 동적 사이트 크롤러 만들기Selenium을 이용한 동적 사이트 크롤러 만들기
Selenium을 이용한 동적 사이트 크롤러 만들기Gyuhyeon Jeon
 
웹 서버 실행 환경
웹 서버 실행 환경웹 서버 실행 환경
웹 서버 실행 환경성균 전
 

What's hot (20)

막하는스터디 두번째만남 Express(20151025)
막하는스터디 두번째만남 Express(20151025)막하는스터디 두번째만남 Express(20151025)
막하는스터디 두번째만남 Express(20151025)
 
HTTP 완벽가이드- 19장 배포시스템
HTTP 완벽가이드- 19장 배포시스템HTTP 완벽가이드- 19장 배포시스템
HTTP 완벽가이드- 19장 배포시스템
 
HeadFisrt Servlet&JSP Chapter 3
HeadFisrt Servlet&JSP Chapter 3HeadFisrt Servlet&JSP Chapter 3
HeadFisrt Servlet&JSP Chapter 3
 
막하는 스터디 첫 번째 만남 Node.js
막하는 스터디 첫 번째 만남 Node.js막하는 스터디 첫 번째 만남 Node.js
막하는 스터디 첫 번째 만남 Node.js
 
1. 미티어의 폴더구조
1. 미티어의 폴더구조1. 미티어의 폴더구조
1. 미티어의 폴더구조
 
Kcjcinema
KcjcinemaKcjcinema
Kcjcinema
 
Json view 예제 설명
Json view 예제 설명Json view 예제 설명
Json view 예제 설명
 
Http2(http2.0,g rpc,cookie,session,idempotent, x forwarded-for)
Http2(http2.0,g rpc,cookie,session,idempotent, x forwarded-for)Http2(http2.0,g rpc,cookie,session,idempotent, x forwarded-for)
Http2(http2.0,g rpc,cookie,session,idempotent, x forwarded-for)
 
자바 서블릿과 세션 (Java Servlet, Session)
자바 서블릿과 세션 (Java Servlet, Session)자바 서블릿과 세션 (Java Servlet, Session)
자바 서블릿과 세션 (Java Servlet, Session)
 
2. template
2. template2. template
2. template
 
Mongodb tip42 50
Mongodb tip42 50Mongodb tip42 50
Mongodb tip42 50
 
진짜기초 Node.js
진짜기초 Node.js진짜기초 Node.js
진짜기초 Node.js
 
Html5 performance
Html5 performanceHtml5 performance
Html5 performance
 
Node.js DBMS short summary
Node.js DBMS short summaryNode.js DBMS short summary
Node.js DBMS short summary
 
[Week2] 데이터 스크래핑
[Week2] 데이터 스크래핑[Week2] 데이터 스크래핑
[Week2] 데이터 스크래핑
 
Leadweb Nodejs
Leadweb NodejsLeadweb Nodejs
Leadweb Nodejs
 
[PHPFest 2013] PHP 성능 향상 방법
[PHPFest 2013] PHP 성능 향상 방법[PHPFest 2013] PHP 성능 향상 방법
[PHPFest 2013] PHP 성능 향상 방법
 
Selenium을 이용한 동적 사이트 크롤러 만들기
Selenium을 이용한 동적 사이트 크롤러 만들기Selenium을 이용한 동적 사이트 크롤러 만들기
Selenium을 이용한 동적 사이트 크롤러 만들기
 
웹 서버 실행 환경
웹 서버 실행 환경웹 서버 실행 환경
웹 서버 실행 환경
 
플라스크 템플릿
플라스크 템플릿플라스크 템플릿
플라스크 템플릿
 

More from ETRIBE_STG

데이터베이스 시스템 chapter4_STG박하은
데이터베이스 시스템 chapter4_STG박하은데이터베이스 시스템 chapter4_STG박하은
데이터베이스 시스템 chapter4_STG박하은ETRIBE_STG
 
데이터베이스 시스템 chapter3_STG박하은
데이터베이스 시스템 chapter3_STG박하은데이터베이스 시스템 chapter3_STG박하은
데이터베이스 시스템 chapter3_STG박하은ETRIBE_STG
 
데이터베이스 시스템 chapter2_STG박하은
데이터베이스 시스템 chapter2_STG박하은데이터베이스 시스템 chapter2_STG박하은
데이터베이스 시스템 chapter2_STG박하은ETRIBE_STG
 
데이터베이스 시스템 chapter1_STG박하은
데이터베이스 시스템 chapter1_STG박하은데이터베이스 시스템 chapter1_STG박하은
데이터베이스 시스템 chapter1_STG박하은ETRIBE_STG
 
Spring Security
Spring SecuritySpring Security
Spring SecurityETRIBE_STG
 
Springsecurity
SpringsecuritySpringsecurity
SpringsecurityETRIBE_STG
 
지적재산권
지적재산권지적재산권
지적재산권ETRIBE_STG
 
머큐리얼저장소추가 사용자추가 권한추가
머큐리얼저장소추가 사용자추가 권한추가머큐리얼저장소추가 사용자추가 권한추가
머큐리얼저장소추가 사용자추가 권한추가ETRIBE_STG
 
리눅스에 대하여
리눅스에 대하여리눅스에 대하여
리눅스에 대하여ETRIBE_STG
 
Wix - 웹 홈페이지 제작
Wix - 웹 홈페이지 제작Wix - 웹 홈페이지 제작
Wix - 웹 홈페이지 제작ETRIBE_STG
 
모바일에서 Ble pxp
모바일에서 Ble pxp모바일에서 Ble pxp
모바일에서 Ble pxpETRIBE_STG
 
모바일에서 Ble pxp
모바일에서 Ble pxp모바일에서 Ble pxp
모바일에서 Ble pxpETRIBE_STG
 
Android version
Android version Android version
Android version ETRIBE_STG
 
구글맵 JavaScript API
구글맵 JavaScript API구글맵 JavaScript API
구글맵 JavaScript APIETRIBE_STG
 
Javascript 완벽 가이드 정리
Javascript 완벽 가이드 정리Javascript 완벽 가이드 정리
Javascript 완벽 가이드 정리ETRIBE_STG
 
표기법을 아시나요?
표기법을 아시나요?표기법을 아시나요?
표기법을 아시나요?ETRIBE_STG
 
Google analytics
Google analyticsGoogle analytics
Google analyticsETRIBE_STG
 

More from ETRIBE_STG (20)

데이터베이스 시스템 chapter4_STG박하은
데이터베이스 시스템 chapter4_STG박하은데이터베이스 시스템 chapter4_STG박하은
데이터베이스 시스템 chapter4_STG박하은
 
데이터베이스 시스템 chapter3_STG박하은
데이터베이스 시스템 chapter3_STG박하은데이터베이스 시스템 chapter3_STG박하은
데이터베이스 시스템 chapter3_STG박하은
 
데이터베이스 시스템 chapter2_STG박하은
데이터베이스 시스템 chapter2_STG박하은데이터베이스 시스템 chapter2_STG박하은
데이터베이스 시스템 chapter2_STG박하은
 
데이터베이스 시스템 chapter1_STG박하은
데이터베이스 시스템 chapter1_STG박하은데이터베이스 시스템 chapter1_STG박하은
데이터베이스 시스템 chapter1_STG박하은
 
Spring Security
Spring SecuritySpring Security
Spring Security
 
Springsecurity
SpringsecuritySpringsecurity
Springsecurity
 
지적재산권
지적재산권지적재산권
지적재산권
 
AWS
AWSAWS
AWS
 
머큐리얼저장소추가 사용자추가 권한추가
머큐리얼저장소추가 사용자추가 권한추가머큐리얼저장소추가 사용자추가 권한추가
머큐리얼저장소추가 사용자추가 권한추가
 
리눅스에 대하여
리눅스에 대하여리눅스에 대하여
리눅스에 대하여
 
Wix - 웹 홈페이지 제작
Wix - 웹 홈페이지 제작Wix - 웹 홈페이지 제작
Wix - 웹 홈페이지 제작
 
모바일에서 Ble pxp
모바일에서 Ble pxp모바일에서 Ble pxp
모바일에서 Ble pxp
 
모바일에서 Ble pxp
모바일에서 Ble pxp모바일에서 Ble pxp
모바일에서 Ble pxp
 
Android version
Android version Android version
Android version
 
구글맵 JavaScript API
구글맵 JavaScript API구글맵 JavaScript API
구글맵 JavaScript API
 
Objc literals
Objc literalsObjc literals
Objc literals
 
Javascript 완벽 가이드 정리
Javascript 완벽 가이드 정리Javascript 완벽 가이드 정리
Javascript 완벽 가이드 정리
 
표기법을 아시나요?
표기법을 아시나요?표기법을 아시나요?
표기법을 아시나요?
 
Swing browser
Swing browserSwing browser
Swing browser
 
Google analytics
Google analyticsGoogle analytics
Google analytics
 

피들러 신명대

  • 2. ■ Fiddler 소개 제가 소개할 것은 Fiddler 웹 디버깅 툴 입니다. 요즘은 각 브라우저에 디버깅 기능이 내장되어 있어서 유용하게 사용하고 있습니다. Fiddler는 설치형 입니다. 하지만 용량이 적으며, 브라우저에 상관없이 디 버깅이 가능한 툴입니다. 제가 Fiddler를 사용하는 이유는 Ajax 통신시 디버깅 하기에 가장 수월하기 때문입니다. 그리고 세션 리스트들과 각 세션에 대한 요청, 응답 정보들을 쉽게 체크할 수 있습니다.
  • 3. ■ Fiddler UI 소개 Session List 네트워크 통신 중인 세션 리스트를 출력해 줍니다. 검색, 필터링이 가능하며 각 세션 리스트를 클릭하면 상세정보를 볼 수 있 습니다. Inspectors Ajax관련 기능을 디버깅 할 때 제일 많이 사용하는 기능입니다. 해당 세션의 request의 다양한 정보와 response의 정보 그리고 response 의 내용도 볼 수 있습니다.
  • 4. ■ Fiddler 기본 구조 클라이언트 서버Fiddler
  • 5. ■ Fiddler 세션리스트 소개 Result : Session의 고유아이디 Protocol : Session을 주고 받는 방식 Host : 값이 출발하는 장소 URL : 주소입니다. Body : 전송량 Content-Type : 컨텐츠의 종류를 나타냄 예) 문서, 웹페이지, 프로그램…. Process : Session을 이용하고있는 프로 그램과 프로그램아이디(PID)를 표시
  • 6. ■ Fiddler 세션리스트 검색 검색( 컨드롤 + f ) 검색하고자 하는 키워드를 검색하면 검색 결과 리스트이 구분되어서 보입니다.
  • 7. ■ Fiddler 세션리스트 정보 보기(JSON) Request Response
  • 8. ■ Fiddler 세션리스트 정보 보기(TextView) Request Response