ZAP Plug-n-Hack을 이용한 DOM/PostMessage 분석
Plug-n-Hack(PnH)
Plug-n-hack, 즉 PnH는 Mozilla 보안팀이 제안한 표준으로 보안 도구와 브라우저간의 상호 작용을 쉽고 유용하게 할 수 있도록 만들어진 방법을 의미합니다.
이미 10년 가까이 되가는 기술로 초기에는 브라우저 console에서 보안 도구를 컨트롤 할 수 있는 형태로 구성되었지만, 현재는 ZAP의 Monitor Client에서 브라우저의 데이터를 가로채어 분석 도구에서 쉽게 사용할 수 있도록 제공하는 기능으로 바라보는 시선이 더 큽니다. 어쨌던 중요한점은 정해진 프로토콜에 따라 동작을 구성하면, ZAP이 아닌 다른 도구에서도 이와 같은 테스팅 기능을 사용할 수 있다는 점입니다. 혹시나 관심있다면 만들어보시는 것도 좋을 것 같네요.
Install AddOn in ZAP
Marketplace 에서 Plug-n-Hack Configuration
이란 확장으로 설치가 가능합니다.
Testing!
Add monitor clients
history 탭 등에서 context menu(우클릭)
> Monitor clients
중 하위 항목을 선택하여 monitor client 추가가 가능합니다.
각각 하위 항목은..
Name | Desc |
---|---|
Open as monitored URL | monitor clients에 등록된 URL을 오픈합니다. 외부 브라우저로 열리니 참고. |
Include subtree | 해당 URL 하위를 monitor clients에 포함합니다. |
Include all in scope | in-scope(context의 대상) 전체를 monitor clients에 포함합니다. |
추가된 Client는 Session Properties(Context 더블클릭 시 나타나는 메뉴) 중 Monitor Clients 에서 추가된 Scope와 Exclude 할 URL의 정규식을 확인할 수 있습니다.
Show event data
monitor client가 설정되면 페이지 로드 시 하단 툴바 중 clients 탭에서 이벤트가 수신되는 걸 확인할 수 있습니다. 여기에는 postMessage 데이터, DOM 자체의 이벤트 데이터 등이 포함됩니다.
Show detail data of Event
Request / Response 탭에는 간단한 정보만 보이지만, Data format을 PnH JSON으로 변경하면 아래와 같이 상세 데이터를 JSON 으로 확인할 수 있습니다.
{
"to": "ZAP",
"type": "eventInfoMessage",
"from": "TODO: we need a from",
"target": "someTarget",
"data": "a mousemove event happened!",
"eventData": "{\"isTrusted\":true,\"screenX\":-784,\"screenY\":904,\"pageX\":296,\"pageY\":207,\"clientX\":296,\"clientY\":207,\"x\":296,\"y\":207,\"offsetX\":76,\"offsetY\":118,\"ctrlKey\":false,\"shiftKey\":false,\"altKey\":false,\"metaKey\":false,\"button\":0,\"buttons\":0,\"region\":\"\",\"movementX\":0,\"movementY\":0,\"mozPressure\":0,\"mozInputSource\":1,\"MOZ_SOURCE_UNKNOWN\":0,\"MOZ_SOURCE_MOUSE\":1,\"MOZ_SOURCE_PEN\":2,\"MOZ_SOURCE_ERASER\":3,\"MOZ_SOURCE_CURSOR\":4,\"MOZ_SOURCE_TOUCH\":5,\"MOZ_SOURCE_KEYBOARD\":6,\"detail\":0,\"layerX\":76,\"layerY\":118,\"which\":1,\"rangeOffset\":0,\"SCROLL_PAGE_UP\":-32768,\"SCROLL_PAGE_DOWN\":32768,\"type\":\"mousemove\",\"eventPhase\":3,\"bubbles\":true,\"cancelable\":true,\"returnValue\":true,\"defaultPrevented\":false,\"composed\":true,\"timeStamp\":37090,\"cancelBubble\":false,\"NONE\":0,\"CAPTURING_PHASE\":1,\"AT_TARGET\":2,\"BUBBLING_PHASE\":3,\"ALT_MASK\":1,\"CONTROL_MASK\":2,\"SHIFT_MASK\":4,\"META_MASK\":8}",
"originalTargetPath": [
"__layout",
0,
0,
2,
2,
2,
0,
0,
0,
0,
0,
0,
0,
0
],
"messageId": "d95edc18-5d15-b4b6-2404-f1eadac11bd4",
"endpointId": "f07535d4-36fe-bf02-730e-8f44f8d84cda"
}
Resend event data
수신된 Event는 클릭 시 Request / Response 탭에서 내용을 확인할 수 있고, 우클릭으로 Resend가 가능합니다. 당연히 Resend 시 위에 PnH JSON 으로 디테일한 내용 전송도 가능합니다.
Global BP and Custom BP
Monitor clients에 추가된 패턴은 break 를 통한 테스팅 시 일반적인 웹 요청과 동일하게 잡히기 때문에 테스트할 떄 사용할 수 있습니다. 다만 DOM Event의 경우 양이 굉장히 많기 때문에 가급적이면 Monitor client를 사용할 땐 custom break point 를 걸어서 사용하는 걸 추천합니다.
Remote monitor client
특이하게 삭제 기능이 없습니다. Session Properties에서 URL을 제거해야 삭제할 수 있습니다.
Vs DOM Invader
최근 핫한 DOM Invader와 비교를 안할수가 없겠네요. 우선 Plug-n-Hack은 정말 오래된(ZAP 초기부터 있던 기능)이라 기능 면에선 당연히 DOM Invader가 훨씬 모던한데요, ZAP 사용자 입장에선 현재 크게 선택권이 없기 때문에 Plug-n-Hack이 최선의 대안인 것 같네요.
어쨌던 약간 비교해보면.. Plug-n-Hack 은 순수하게 Manual testing 위한 도구 정도로 보시면 좋을 것 같고, DOM Invader는 Manual testing의 포인트를 쉽게 잡기 위한 반 자동화 도구 정도로 생각하시는게 좋을 것 같습니다. 성격이 약간 다르다 보니 직접적으로 비교하긴 어렵지만, DOM Invader에 대한 대안은 ZAP 팀이 충분히 고려해야할 문제인 것 같네요.
Conclusion
솔직히 ZAP을 써온지도 이제 시간이 좀 지나서 기능이 많이 익숙해졌다고 생각했는데, 의외로 제가 잘 모르고 있던 기능들이 많습니다. 앞으로도 이러한 내용으로 글을 좀 작성해볼거고, 가능하다면 유툽으로 소개하고 이야기드릴 수 있도록 노력해볼게요 :D