Fiddler 피들러(Fiddler) 활용 - 패킷 바꿔치기(조작, manipulation)

피들러의 AutoResponder 탭을 이용합니다.

특정 요청을 했을 때 실제 서버에서 내려온 응답 패킷으로 웹 브라우저를 구성해서 보여주는게 아니라

AutoResponder 탭에서 변경한 패킷으로 웹 브라우저에 표시되도록 하려고 합니다.

 

현재 네이버에서 "실시간 검색어"를 입력하면 아래와 같이 보이는데요.

 

 

 

 

이것을 제가 바꿔치기 한 데이터로 아래와 같이 보이게 하겠습니다.

 

 

 

 

 

 

1. 원본 데이터가 어떻게 넘어오는지 확인합니다.

네이버에서 검색창에 검색어를 입력하면 입력한 문자가 바뀔 때(?) 마다 패킷이 전송되는 것을 볼 수 있습니다.

 

 

 

 

이걸 Inspectors에서 보면 Json 데이터를 응답으로 받고 있는 것을 확인할 수 있습니다. 

 

 

 

 

 

 

2. 원본 데이터를 변경해서 로컬에 저장합니다.

원하는 데이터를 변경해서 아래 내용을 "ac.js"라는 파일로 저장해둡니다.

 

3. AutoResponder 탭에 Rule을 추가합니다.

세션 리스트에서 해당 세션을 드래그앤 드랍으로 항목에 끌어다 놓고

respond with를 수정한 뒤 저장합니다.

 

 

4. 변경된 데이터로 웹 브라우저가 표시되는지 확인합니다.

 

 

 

 

 

 

 

 

 

 

 

사실 서버에서 데이터를 아예 이상하게 주면 되긴 하지만,

실서버 데이터를 써야하거나, 모듈들이 복잡하게 얽혀있거나,

 

때에 따라 불가능할 때가 있습니다.

 

 

 

 

또 어떨 때 활용하느냐

1. 예외사항에 해당되는 데이터가 서버에서 내려왔을 때도 클라이언트(웹 브라우저)에서 제대로 표시되는지 확인합니다.

예를들어 방금과 같은 경우에 우연찮게 자동완성 검색어가 매우 긴 경우가 생겼다고 하면,

박스를 넘기지 않고 말줄임 표시가 된다던지, 혹은 잘못된 데이터임을 파악하고 아예 표시되지 않는다던지 해서

이상하게 보이는 경우는 없어야합니다.

 

2. 패킷 바꿔치기 외에도 응답을 느리게 주거나 임의로 400 에러를 보낼 수 있습니다.

데이터를 못받을 경우 적절한 안내 메시지가 보여진다던가

응답이 늦을 경우, 지연 알림 메시지가 보여진다던가.

특정 스크립트 로딩을 지연 시켜, 스크립트 로딩이 이상하게 꼬일 경우에도 스크립트 에러 없이 적절한 동작을 하는지 확인합니다.

 

외에도 웹에 대한 지식이 있다면 다양하게 활용할 수 있겠죠