개발자툴 콘솔 에러
티스토리 블로그 운영을 하다 보면 F12를 눌러 개발자툴(DevTool)로 들어가서 스킨 변경에 대한 힌트를 얻고 오류를 해결하며 다른 여러 가지 도움도 받습니다.
그런데 갑자기 개발자툴 콘솔에 에러 메시지가 발생하는 경우가 있습니다. 이 번 글에서는 다양하게 발생하는 콘솔 경고 에러를 해결하는 방법에 대해 알아보도록 하겠습니다.
에러 메시지 1
개발자툴의 콘솔 창에 아래 그림과 같이 'Failed to load resource: the server responded with a status of 403 ()'라는 에러 메시지가 잔뜩 발생하는 경우가 있습니다.
403 에러는 서버에 요청이 전달되었지만 거절된 경우에 발생하는 에러로 이경우는 아래 그림의 오른쪽 상단을 확인하면 구글에서 거절하여 발생한 문제로 원인을 알고 해결하면 간단합니다.
이 콘솔 에러의 원인은 다양한데 정리하면 아래와 같으며 해당 사항을 조치하거나 조치할 항목이 없다면 기다리면 자연적으로 해결됩니다.
- 아직 애드센스 정식 인증을 받지 못한 상태에서 광고를 삽입한 경우
- 위반 사항 등으로 인해 애드센스 광고 정지 등의 제재를 받은 경우
- 수동 광고 삽입과 관련된 코드에 오류가 있는 경우
- 애드센스 광고 승인 이후 시간이 얼마 안 된 경우
- 2차 도메인으로 애드센스 승인을 받은 후 원래 블로그 주소로 진입할 경우
에러 메시지 2
다음은 아래와 같은 메시지가 콘솔 창에 무수히 나타나는 경우입니다. 내용을 보면 매우 심각하게 느껴지는데 실상을 알고 보면 별일이 아닙니다.
'Channe1: Error in handIeResponse UNK/SW_UNREACHABLE .....,' 'Uncaught (in promise) Error: Could not establish connection.
Receiving end does not exist.'
이 에러는 에버노트 웹 클리퍼 확장 프로그램(Evernote Web Clipper)을 설치하면 발생하며 바로 삭제하거나 비활성화시키면 해결됩니다. 해당 확장 프로그램이 뭔가 호환되지 않는 에러를 발생시키는 것으로 보입니다.
에러 메시지 3
다음 에러 메시지는 아래 그림과 같이 적색이 아닌 황색 경고로 그냥 두어도 크게 문제가 되지 않는 경고입니다. 하지만 찜찜하니 이 에러도 없애려면 개발자툴 오른쪽 상단의 톱니바퀴를 눌러 설정으로 이동하여 변경을 해주어야 합니다.
'DevTools failed to load source map: Could not load content for https://static-int.adsafep rotected.com/4.js.map: Connection error: net: :ERR_NAME_NOT_RESOLVED'
아래 그림에서 볼 수 있듯이 Settings(설정)/Preferences(기본설정)에서 노란색으로 표시된 EnabIe JavaScript source maps(JavaScript 소스 맵 사용)과 Enable CSS source maps(CSS 소스 맵 사용)의 왼쪽 체크 박스를 해제하여 비활성화하면 에러 메시지가 사라집니다.
원본 소스와 변환된 소스를 맵핑해 주는 기능으로 웹개발이 고도화되면서 JavaScript나 CSS의 문제를 디버깅하기 위한 설정입니다.
