워드프레스 등으로 웹사이트를 구축하다보면 PC는 괜찮은데, 휴대폰에서만 문제가 발생하는 경우, 실제 디바이스에서 디버깅을 해야 할 수도 있습니다. Android 디바이스와 Chrome 브라우저를 사용한다면, Chrome의 원격 디버깅 기능을 사용하여 휴대폰에서 직접 콘솔 오류를 확인할 수 있습니다. 다음은 그 방법입니다:
Android 디바이스에서 Chrome 원격 디버깅 하기
- Android 디바이스 설정:
- 디바이스에서 “개발자 옵션”을 활성화합니다.
- “USB 디버깅”을 활성화합니다.
- 디바이스 연결:
- Android 디바이스를 컴퓨터에 USB로 연결합니다.
- 허용 대화 상자가 표시되면 “OK”를 클릭합니다.
- Chrome 개발자 도구 열기:
- 컴퓨터의 Chrome 브라우저에서
chrome://inspect로 이동합니다. - “Devices” 섹션에서 연결된 디바이스를 확인하고 “Inspect” 링크를 클릭합니다.
- 컴퓨터의 Chrome 브라우저에서
- 디버깅 시작:
- 원격 디버깅 세션에서 콘솔을 열어 오류나 경고를 확인합니다.
- 문제가 발생하는 동작을 재현하고 콘솔에서 관련 오류 메시지나 경고를 찾습니다.
이 방법을 통해 실제 모바일 환경에서 발생하는 문제를 직접 디버깅할 수 있으며, 이를 통해 문제의 원인을 더 정확하게 파악할 수 있을 것입니다.
“Inspect” 링크가 보이지 않는다면, 몇 가지 확인해야 할 사항이 있습니다:
1. Chrome 버전 확인
- 디바이스와 컴퓨터 모두에서 Chrome의 최신 버전을 사용하고 있는지 확인하세요.
2. USB 디버깅 허용
- Android 디바이스가 컴퓨터에 연결되어 있고 USB 디버깅이 허용되어 있는지 확인하세요.
3. 인터넷 페이지 열기
- Android 디바이스에서 디버깅하려는 웹 페이지를 열고 있어야 합니다. 페이지가 열려 있는 상태에서
chrome://inspect페이지를 새로 고쳐 보세요.
4. 포트 포워딩 확인
- 포트 포워딩 설정이 올바른지 확인하세요. 필요한 경우 포트 포워딩을 설정하거나 수정하세요.
5. 방화벽 및 보안 소프트웨어 확인
- 컴퓨터의 방화벽이나 보안 소프트웨어가 디바이스와의 연결을 차단하고 있지 않은지 확인하세요.
위의 사항들을 확인한 후에도 “Inspect” 링크가 보이지 않는다면, 다른 USB 포트를 사용하거나 다른 컴퓨터에서도 시도해 보세요. 이러한 방법들이 문제 해결에 도움이 되길 바랍니다.
