적용 대상

Adobe 팀 및 기업 고객.

목적

문제 해결을 위해 고객 브라우저 내에서 네트워크 요청에 대한 상세 정보가 필요한 경우, HAR 파일을 생성하는 것이 유용합니다. 이 문서를 통해 Chrome, Firefox, Edge, Safari에서 HAR 파일을 생성하는 방법을 알 수 있습니다.

Google Chrome

다음 단계는 Google Chrome에서 개발자 도구를 사용하는 방법을 보여 줍니다. 자세한 내용은 Chrome DevTools를 참조하십시오.

1. Chrome 브라우저에서 문제가 발생하기 전에 해당 단계로 이동합니다.
   

2. F12 키를 눌러 개발자 도구를 시작합니다. 도구 더 보기 > 개발자 도구 아래의 도구 모음 메뉴에서 도구를 실행할 수도 있습니다.

3. 기본적으로 브라우저는 현재 로드된 페이지에 대해서만 추적 정보를 유지합니다. 재현 단계에서 둘 이상의 페이지로 이동해야 하는 경우에도 브라우저가 모든 추적 정보를 유지하도록 다음 옵션을 설정하십시오.

   1. 콘솔 탭을 선택하고 콘솔 설정을 선택한 다음 로그 유지를 선택합니다.

      

   2. 네트워크 탭을 선택한 다음 로그 유지를 선택합니다.

      

4. 네트워크 탭에서 네트워크 로그 기록 중단 및 지우기를 선택합니다.

   

5. 네트워크 로그 기록을 선택한 다음 브라우저에서 문제를 재현합니다.

   

   다음 이미지와 유사한 세션 출력이 표시됩니다.

   

6. 예상치 못한 동작을 재현한 후에 네트워크 로그 기록 중단을 선택한 다음 HAR 내보내기를 선택하고 파일을 저장합니다.

   

7. 브라우저 개발자 도구 창으로 돌아가서 콘솔 탭을 선택합니다. 메시지 중 하나를 마우스 오른쪽 버튼으로 클릭한 다음 다른 이름으로 저장...을 선택하고 콘솔 출력을 텍스트 파일로 저장합니다.

8. 브라우저 추적 HAR 파일과 콘솔 출력을 .zip과 같은 압축 포맷으로 패키징합니다.

9. 지원 티켓에 압축 파일을 첨부합니다.

Safari

다음 단계에서는 Mac에서 Apple Safari의 개발자 도구를 사용하는 방법을 보여 줍니다. 자세한 내용은 Safari 개발자 도구 개요를 참조하십시오.

1. Safari에서 개발자 도구를 활성화합니다.

   1. Safari를 선택한 다음 환경 설정을 선택합니다.

   2. 고급 탭을 선택한 다음 메뉴 모음에서 개발 메뉴 표시를 선택합니다.

      

2. 브라우저에서 문제가 발생하기 전에 해당 단계로 이동합니다.
   

3. 개발을 선택한 다음 웹 검사기 표시를 선택합니다.

   

4. 기본적으로 브라우저는 현재 로드된 페이지에 대해서만 추적 정보를 유지합니다. 재현 단계에서 둘 이상의 페이지로 이동해야 하는 경우에도 브라우저가 모든 추적 정보를 유지하도록 다음 옵션을 설정하십시오.

   1. 콘솔 탭을 선택한 다음 로그 유지를 선택합니다.

      

   2. 네트워크 탭을 선택한 다음 로그 유지를 선택합니다.

      

5. 네트워크 탭에서 네트워크 항목 지우기를 선택합니다.

   

6. 브라우저에서 문제를 재현합니다. 다음 이미지와 유사한 세션 출력이 표시됩니다.

   

7. 예상치 못한 동작을 재현한 후에 내보내기를 선택하고 파일을 저장합니다.

   

8. 브라우저 개발자 도구 창으로 돌아가서 콘솔 탭을 선택하고 창을 확장합니다. 콘솔 출력의 시작 부분에 커서를 놓은 다음 출력의 전체 내용을 끌어서 선택합니다. Command-C를 사용하여 출력을 복사하고 텍스트 파일에 저장합니다.

   

9. 브라우저 추적 HAR 파일, 콘솔 출력 및 화면 녹화 파일을 .zip과 같은 압축 포맷으로 패키징합니다.

10.  

    지원 티켓에 압축 파일을 첨부합니다.

     

Firefox

다음 단계는 Firefox에서 개발자 도구를 사용하는 방법을 보여 줍니다. 자세한 내용은 Firefox 개발자 도구를 참조하십시오.

1. 브라우저에서 문제가 발생하기 전에 해당 단계로 이동합니다.
   

2. F12 키를 눌러 개발자 도구를 시작합니다. 도구 더 보기 > 웹 개발자 도구 아래의 도구 모음 메뉴에서 도구를 실행할 수도 있습니다.

3. 기본적으로 브라우저는 현재 로드된 페이지에 대해서만 추적 정보를 유지합니다. 재현 단계에서 둘 이상의 페이지로 이동해야 하는 경우에도 브라우저가 모든 추적 정보를 유지하도록 다음 옵션을 설정하십시오.

   1. 콘솔 탭을 선택하고 설정 아이콘을 선택한 다음 로그 유지를 선택합니다.

      

   2. 네트워크 탭을 선택하고 설정 아이콘을 선택한 다음 로그 유지를 선택합니다.

      

4. 네트워크 탭에서 지우기를 선택합니다.

   

5. 브라우저에서 문제를 재현합니다. 다음 이미지와 유사한 세션 출력이 표시됩니다.

   

6. 예기치 않은 동작을 재현한 후에 모두 HAR로 저장을 선택합니다.

   

7. 브라우저 개발자 도구 창으로 돌아가서 콘솔 탭을 선택합니다. 메시지 중 하나를 마우스 오른쪽 버튼으로 클릭한 다음 모든 메시지를 파일에 저장을 선택하고 콘솔 출력을 텍스트 파일에 저장합니다.

8. 브라우저 추적 HAR 파일, 콘솔 출력 및 화면 녹화 파일을 .zip과 같은 압축 포맷으로 패키징합니다.

9. 지원 티켓에 압축 파일을 첨부합니다.
   

Microsoft Edge

다음 단계는 Microsoft Edge에서 개발자 도구를 사용하는 방법을 보여 줍니다. 자세한 내용은  Microsoft Edge DevTools를 참조하십시오.

1. 브라우저에서 문제가 발생하기 전에 해당 단계로 이동합니다.
   

2. F12 키를 눌러 Microsoft Edge DevTools를 시작합니다. 도구 더 보기 > 개발자 도구 아래의 도구 모음 메뉴에서 도구를 실행할 수도 있습니다.

3. 기본적으로 브라우저는 현재 로드된 페이지에 대해서만 추적 정보를 유지합니다. 재현 단계에서 둘 이상의 페이지로 이동해야 하는 경우에도 브라우저가 모든 추적 정보를 유지하도록 다음 옵션을 설정하십시오.

   1. 콘솔 탭을 선택하고 콘솔 설정을 선택한 다음 로그 유지를 선택합니다.

      

   2. 네트워크 탭을 선택합니다. 해당 탭이 표시되지 않으면 도구 더 보기(+) 버튼을 클릭하고 네트워크를 선택합니다. 그런 다음 네트워크 탭에서 로그 유지를 선택합니다.

      

4. 네트워크 탭에서 네트워크 로그 기록 중단 및 지우기를 선택합니다.

   

5. 네트워크 로그 기록을 선택한 다음 포털에서 문제를 재현합니다.

   

   다음 이미지와 유사한 세션 출력이 표시됩니다.

   

6. 예상치 못한 포털 동작을 재현한 후에 네트워크 로그 기록 중단을 선택한 다음 HAR 내보내기를 선택하고 파일을 저장합니다.

   

7. 브라우저 개발자 도구 창으로 돌아가서 콘솔 탭을 선택합니다. 메시지 중 하나를 마우스 오른쪽 버튼으로 클릭한 다음 다른 이름으로 저장...을 선택하고 콘솔 출력을 텍스트 파일로 저장합니다.

8. 브라우저 추적 HAR 파일, 콘솔 출력 및 화면 녹화 파일을 .zip과 같은 압축 포맷으로 패키징합니다.

9. 지원 티켓에 압축 파일을 첨부합니다.