테스트 | 브라우저
연속적인 리퀘스트 테스
postman과 42 tester를 통과했다고 해서 여러분의 웹서버가 잘 만들어졌다는 것은 아닙니다. 간단한 요청에는 잘 대응한다는 것을 확인했을 뿐입니다. 여러분도 이제 잘 알겠지만, 우리는 브라우저에서 한 번에 하나의 페이지를 보지만 그 안에 들어있는 엘리먼트들은 무수히 많습니다. 간단히 생각해보면 기본적으로 HTML 페이지가 있고, HTML 문서를 꾸미는 CSS 파일이나 JS 파일이 있습니다. 또 HTML 문서 안에 들어갈 이미지들도 많고요.
우리가 주소창에 입력하는 것은 하나의 리퀘스트입니다. 하지만 그 리퀘스트의 응답을 토대로 브라우저는 페이지 구현에 필요한 리소스들을 인식하고, 수많은 리퀘스트들을 추가로 요청하여 하나의 페이지를 완성합니다. 그러니까, 여러 개의 연속적인 리퀘스트들을 잘 처리하여 복잡한 페이지를 띄울 수 있어야 비로소 웹서버가 잘 동작한다고 말할 수 있습니다.
위의 페이지에는 웹사이트 어워드에서 수상한, 잘 만들어진 페이지들이 많습니다. 그만큼 화려하고 복잡합니다. 마음에 드는 페이지에 들어가 마우스로 오른쪽 클릭을 하고, save as..를 눌러 web page를 다운받으세요. 다운받은 페이지 디렉토리를 여러분의 프로젝트 디렉토리에 놓고, configuration 파일을 설정하세요. 그리고 크롬에서 개발자 도구를 켠 뒤, 네트워크 탭을 열고 여러분의 웹서버에서 돌려보는 겁니다. 여러분의 탓이 아닌 몇몇 리퀘스트들을 제외한 대부분의 요청이 정상적으로 수행되고, 그럴듯한 페이지가 떠야 합니다. 계속해서 무한 로딩이 되면서 해결되지 않는 리퀘스트가 있다거나, 리소스를 가지고 있음에도 불구하고 제대로 응답하지 않는 상황이 일어나서는 안 됩니다.
만약 웹을 간단히라도 다룰 줄 안다면 HTML, CSS, JS, 이미지를 활용해 간단한 구조를 만들어서 하나의 페이지가 깔끔하게 제대로 뜨는지 확인하는 게 좋습니다.
캐시 지우기
브라우저를 통해 테스트를 하게 되면 가장 많이 겪는 문제가 캐시 문제입니다. 브라우저 단에서 캐싱을 하기 때문에, 여러분의 리소스나 코드가 바뀌더라도 서버는 이전에 기억한 응답을 화면에 띄우는 겁니다. 그래서 여러분은 문제를 수정했는데도 문제가 여전히 남아있다고 생각하거나, 문제가 발생했는데도 문제가 없다고 여기게 될 수 있습니다. 이를 위해서는 테스트를 할 때 크롬 개발자 도구에서 네트워크 탭을 열고, 이게 캐싱에 의한 응답이 아닌지 확인해야 합니다. cached라는 표시가 함께 떠있다면 우클릭을 해서 캐시를 없애주세요.
Last updated