버프슈트 확장 프로그램 JS Beautifier

내가 가장 사랑하는 툴 중에 하나인 "Burp Suite"에는 기존의 기능을 확장할 수 있는 extender 기능이 있다.
하지만 적절하게 사용할 기회가 없었는데, 페이스북을 분석하는 도중 불편한 기능이 있어서 확장 기능을 이용해서 개선을 시도해 보았다.

처음에는 원하는 기능이 있을까 싶어서 직접 개발을 시도하려 했으나, 생각보다 마켓에 다양한 확장 프로그램이 존재하였다.
그중 나에게 필요한 javascript 관련 도구가 존재하여 이를 소개하겠다.

Burp extender 소개

Burp Suite의 확장 프로그램은 자바, 파이썬, 루비로 작성 할 수 있으며, 제공하는 API와 예제 프로그램들은 공식 홈페이지 확장기능에서 확인 할 수 있다.

BApp store

확장프로그램 스토어이다. 다양하고 유용한 확장 프로그램들이 등록되어 있다. 버프슈트의 아쉬운 기능을 충족시키기 좋은 앱들이 등록되어 있었다.

JS Beautifier 소개

JS Beautifier는 minfiy한 js를 beautifying 해주는데, 이는 말그대로 이쁘게 보여주는 기능이다. 페이스북은 모든 기능을 자체적인 구조와 함께 데이터는 json타입에 담아 response 해준다. 하지만 데이터 낭비를 위해 모든 데이터를 minfiy해서 전송하기 때문에 압축된 json 데이터를 보기가 굉장히 불편했다.

for (;;);{"__ar":1,"payload":null,"domops":[["appendContent","#tl_unit_3821739841002711012 ._5pcr",false,{"__html":"\u003Cdiv class=\"_6q0 _1n8r\">\u003Cdiv class=\"_5m-\">\u003Ci class=\"_5n0\">\u003C\/i>\u003C\/div>\u003C\/div>"}]],"css":["xGYu\/"],"bootloadable":{},"resource_map":{"xGYu\/":{"type":"css","src":"https:\/\/fbstatic-a.akamaihd.net\/rsrc.php\/v2\/yY\/r\/eMakBH12nEv.css","crossOrigin":1}},"ixData":{},"lid":"0"}

예를 들면 다음과 같다. 거기다 한글의 경우 유니코드로 표현되기에 읽기도 불편하다.

JS Beautifier 설치

BApp store에서 원하는 앱을 선택한 후, 오른쪽 탭에서 Install을 누르면 자동으로 설치된다.

설치가 완료 되면 탭이 하나 추가된다. 유니코드 이스케이프 기능과 자동으로 Beautify하기 위해 몇가지 기능을 설정했다.

for(;;);  { "__ar": 1, "error": 1357032, "errorSummary": "죄송합니다. 문제가 있었습니다.", "errorDescription": "페이지를 새로고침하거나 브라우저 창을 닫은 후 다시 열어보세요.", "payload": null, "bootloadable": {}, "ixData": {}, "lid": "0"  }

페이스북에 요청을 보낸 화면이다.
이로써 위의 보기 힘들었던 구조에서 눈으로 보기 쉬운 구조로 자동으로 바뀐 것을 확인 할 수 있다.