네트워크 요청

Developer Tools 의 또 다른 유용한 섹션은 Network 입니다. 여기에서 모든 네트워크 요청과 이에 대한 자세한 정보를 추적하고 수신된 답변을 구문 분석할 수 있습니다. 국가에 대한 정보가 있는 테이블의 예를 살펴보겠습니다. 모듈 8에서 생성되었으며 이 테이블을 채우려면 GET 요청이 이루어져야 한다는 것을 알고 있습니다. 해당 페이지를 열고 요청이 실제로 전송되고 올바르게 구성되었는지 확인하겠습니다.

테이블이 올바르게 만들어지고 자동으로 채워지므로 요청을 보낸다는 사실이 의심의 여지가 없습니다. 실제로 Network 섹션에서 볼 수 있습니다. 그러나 잠재적 부재는 테이블에 데이터가 없는 이유에 대한 답을 줄 수 있습니다. 이 경우 GET 요청이 없는 이유를 찾아야 한다는 것이 분명해질 것입니다(가능한 옵션: 전송을 위한 올바른 트리거가 설정되지 않음, 트리거를 활성화하는 이벤트가 발생하지 않음, 비즈니스 프로세스가 오류와 함께 컴파일됨).

필요한 정보를 보다 편리하게 표시하기 위해 Fetch / XHR 필터를 즉시 활성화(이 단계에서 필요하지 않은 다양한 서비스 요청은 표시되지 않음)하거나 키워드 검색을 사용할 수도 있습니다.

Headers

여기에서 모든 세부 사항에서 요청을 구문 분석하고 올바르게 수행되었는지 확인할 수 있습니다. 이 예에서는 Headers 탭( General -> Request URL )에서 요청이 매개변수를 사용하여 완전히 표시됩니다.

매개변수가 설정되었는지 확인할 수 있습니다.

• _offset=0 - 데이터가 처음부터 들여쓰기 없이 있는 그대로 요청됩니다.
• _with=1 - 국가에 대한 정보 외에 관련 테이블의 정보도 요청합니다(이 경우 1은 도시에 대한 정보를 가져옴을 의미함).
• _limit=10 - 요청이 처음 10개 요소로 제한됩니다.
• _sort_order=ASC - 오름차순으로 정렬된 데이터
• _sort_by=name - 이름별로 정렬된 데이터

Payload 탭에서 동일한 매개변수를 볼 수 있습니다. 요청의 구성을 자세히 연구해야 할 때 적합합니다. 이는 모델 객체가 데이터베이스에 쓰기 위해 전달될 때 POST 요청을 보낼 때 종종 필요하며 그 구조를 자세히 고려해야 합니다.

Preview

그러나 가장 큰 관심은 종종 요청 자체가 아니라 요청에 대한 응답, 요청의 결과입니다. Preview 탭에서 구조화된 형태로 볼 수 있습니다.

이 예에서는 3개국에 대한 정보가 응답으로 수신되었음을 알 수 있습니다. 또한 이름, 설명, 관련 도시에 대한 데이터 및 다양한 서비스 정보(ID, 생성 시간, 수정 시간 등)를 볼 수 있습니다. 여기에 데이터가 없으면 이 데이터가 테이블에 없는 이유도 설명됩니다(즉, 이 데이터를 얻을 수 있는 비즈니스 프로세스를 이해해야 함을 의미합니다). 또는 그 반대의 경우에도 추가 데이터가 있으면 표를 더 자세히 만들 수 있음이 분명해집니다.