Override 기능으로 개발자 도구 감지 우회하기

1. 문제 상황

방탈출 예약을 하기 위해 예약 시간을 훑어보던 중에 전부 선택할 수 없었다.
예약은 가능한 건지, 선택 가능한 날은 어떻게 표시되는지 궁금했다.

다른 테마도 전부 회색이라 예약 가능 UI를 찾을 수 없었다.

 

2. 문제 확인

DOM을 확인하기 위해 개발자 도구를 열어보려 하는데,
마우스 우클릭, F12, ctrl+shift+i 전부 실행되지 않았다.

웹 더보기에서 직접 개발자 도구를 열었는데
갑자기 화면이 전환되었다.

예약 일정 화면에서 전환되었다.

뭐가 화면을 전환시킨 건지 원인을 찾던 중,
콘솔 패널에서 출력이 반복되는 js 파일을 확인했다.

콘솔 패널에서 실행되고 있는 js 파일

devtools-detector.min.js가 매번 실행되면서
개발자 도구 사용 여부를 감지했다.

해당 파일 링크를 클릭하고 소스 패널로 넘어갔다.

소스 패널, devtools-detector.min.js 코드

 

3. 해결 방안 탐색

유튜브 쇼츠로 본 Override 디버깅 방법이 떠올랐다.

해당 js 파일을 빈 코드로 덮어씌우면 빈 코드를 계속 실행해
화면 전환을 우회할 수 있을 것 같았다.

 

4. 해결 방안 적용

1. 해당 소스 파일 우클릭, Override content 생성
2. 코드 복사본 디렉터리 위치 지정
3. 수정 코드로 화면이 바뀌었을 때 코드를 전부 지우고 ctrl+s로 파일 저장
4. 새로고침

이런 과정을 거치면 개발자 도구를 끄고 다시 켜도 차단화면이 뜨지 않았다.

모든 일정은 disabled가 적용된 스타일링이었다.

disabled를 지우고나서 예약 가능 UI를 확인할 수 있었다.

예약 가능 일정 UI