[Dreamhack] devtools-sources 문제 풀이

 

 

 

💻 "드림핵의 퍼즐들은 나의 손끝에서 해체된다..."
"디지털 전장에 소환된 나는, 이제 문제를 사냥할 뿐이다."

 

 

🧠 이 문제를 풀기 위해 필요한 기반 지식

 

1️⃣ 개발자 도구 DevTools - Sources & Search

 

- F12 → Sources 탭 진입

- 웹페이지에 로드된 모든 JS, CSS, HTML 등의 리소스가 나열됨

중요한 건 여기!
👉 Ctrl + Shift + F를 누르면 전체 소스를 한 번에 검색할 수 있어!

 

 

🎯 devtools-sources 문제 시작해보자!

 

 

---

문제 설명

개발자 도구의 Sources 탭 기능을 활용해 플래그를 찾아보세요.

플래그 형식은 DH{...} 입니다.

 

---

 

 

🚀 문제풀이 과정

 

✅ 1. index.html 열기(문제 파일 다운!)

 

 

기본적인 포트폴리오 사이트가 열림 (배경 + 이름 정도)

 

 

✅ 2. DevTools 열기 → Sources 탭으로 이동

 

webpack:// 경로 하위에서 웹팩으로 번들된 원본 파일들이 나열됨

 

✅ 3. Search 기능으로 전체 소스 일괄 탐색!

Ctrl + Shift + F 누르고 DH 입력

 

📍 그러면 아래처럼 숨겨진 주석에서 플래그가 바로 튀어나옴!

 

 

Search 기능(Ctrl+Shift+F) 하나만 제대로 써도 문제 해결이 순식간!

실제 프론트 해킹에서도 이런 식으로 api, token, flag 키워드 찾아보는 게 기본😎