article 크롬(Chrome), IE, 파이어폭스(Firefox) 및 사파리(Safari)에서 HAR 파일을 생성하는 방법 in 구성 및 구현

크롬(Chrome), IE, 파이어폭스(Firefox) 및 사파리(Safari)에서 HAR 파일을 생성하는 방법

yyu — Mon, 24 Jul 2023 06:33:17 GMT

증상

이 문서에서는 크롬, IE, 파이어폭스 및 사파리에서 HAR 파일을 생성하는 방법을 보여줍니다. Microsoft Edge (Chromium)는 거의 Google Chrome과 동일한 방법으로 동작합니다.

해결 방법

HAR 파일은 최종 사용자의 웹 브라우저에서 성능 데이터를 수집하는 데 사용됩니다. 이 파일은 웹 페이지에서 생성되는 객체 및 응답 호출을 캡처합니다.

HAR로 수집할 수 있는 추가적인 측정 항목은 다음과 같습니다:

>서버에 연결하는 데 걸리는 시간

>DNS 정보를 수집하는 데 걸리는 시간

>서버에서 브라우저로 에셋을 전송하는 데 걸리는 시간

>객체를 요청하는 데 걸리는 시간

HAR 파일은 다양한 방법으로 사용되므로 Palo Alto Network의 지원 엔지니어는 문제 해결을 위해 데이터를 캡처하도록 요청할 수 있습니다.

크롬에서 HAR 및 로그 파일을 생성하는 방법은 다음과 같습니다.

구글 크롬을 엽니다.
크롬에서 해당 웹 페이지로 이동합니다.
크롬 메뉴 > 추가 도구 > 개발자 도구를 선택합니다.
네트워크 탭을 선택합니다.
네트워크 탭 내에서 "로그 보존" 옵션을 선택합니다.
네트워크 탭의 왼쪽 상단에 있는 빨간 원을 클릭하여 로그를 기록합니다.
페이지를 새로 고침하고 크롬이 브라우저와 웹 사이트 상호 작용을 기록하도록 합니다.
페이지가 로드된 후 콘솔 탭을 선택하고 콘솔 상자에서 마우스 오른쪽 버튼을 클릭합니다. "다른 이름으로 저장..."을 선택하고 원하는 이름으로 파일을 저장합니다.
다시 네트워크 탭으로 돌아가서 요소를 마우스 오른쪽 버튼으로 클릭합니다. "콘텐츠와 함께 HAR로 저장"을 선택합니다.
생성된 HAR 및 로그 파일을 지원 티켓에 업로드합니다.

파이어폭스에서 HAR 및 로그 파일을 생성하는 방법은 다음과 같습니다.

파이어폭스를 엽니다.
파이어폭스에서 해당 웹 페이지로 이동합니다.
파이어폭스 메뉴 > 웹 개발자 > 네트워크를 선택합니다.
네트워크 탭 내에서 "로그 보존" 옵션을 선택합니다.
네트워크 탭 중앙에서 새로 고침을 선택합니다.
페이지를 새로 고침하고 파이어폭스가 브라우저와 웹 사이트 상호 작용을 기록하도록 합니다.
페이지가 로드된 후, 마우스 오른쪽 버튼을 클릭하고 "모두 저장..."을 선택하여 HAR 파일로 저장합니다.
콘솔 탭을 선택하고 콘솔 상자에서 마우스 오른쪽 버튼을 클릭합니다. 모두 선택하고 메시지 복사를 선택합니다.
로그 메시지를 선호하는 텍스트 편집기로 복사합니다.
생성된 HAR 및 로그 파일을 지원 티켓에 업로드합니다.

사파리에서 HAR 및 로그 파일을 생성하는 방법은 다음과 같습니다.

사파리를 엽니다.
사파리에서 해당 웹 페이지로 이동합니다.
개발자 도구를 활성화합니다: 사파리 > 환경설정 > 고급 > 메뉴 막대에 개발자 메뉴 보기를 클릭합니다.
메뉴에서 "개발자"를 선택하고 "웹 인스펙터 보기"를 선택한 후 "네트워크" 탭을 선택합니다.
네트워크 탭 내에서 "로그 보존(Preserve log)" 옵션을 선택합니다.
페이지를 새로 고침하고 사파리가 브라우저와 웹 사이트 상호 작용을 기록하도록 합니다.
페이지가 로드된 후, 네트워크 탭 창의 오른쪽 상단에 있는 "내보내기"를 클릭합니다.
콘솔 탭을 선택하고 오류를 화면 캡처합니다.
생성된 HAR 파일과 콘솔 화면 캡처 파일을 지원 티켓에 업로드합니다.

Internet Explorer(IE)에서 HAR 및 로그 파일을 생성하는 방법

1. IE를 엽니다.
2. IE에서 해당 웹페이지로 이동합니다.
3. 개발자 도구를 열려면 키보드의 F12 키를 누르거나 메뉴에서 개발자 도구를 찾을 수 있습니다.
4. 개발자 도구 메뉴 > 네트워크 패널에서 탐색 시 항목 지우기 옵션을 선택 해제합니다. (기본값)
5. 프로파일링 세션 시작/캡처 시작을 선택합니다.
6. 페이지를 새로고침하고 IE가 브라우저와 웹사이트의 상호 작용을 기록하도록 허용합니다.
7. 페이지가 로드되면 HAR로 내보내기/캡쳐 트래픽 내보내기 아이콘을 클릭하고 저장합니다.
8. 콘솔 탭을 클릭하고 보고된 오류/경고를 확인합니다. 오류가 표시되면 콘솔 오류를 마우스 오른쪽 버튼으로 클릭하고 모두 복사를 선택하세요.
9. HAR 및 로그 파일을 지원 티켓에 업로드합니다.