제로하우스

Netlify Page Not Found 에러 Vue를 netlify를 통해 배포했을 경우, 메인 페이지는 표시되지만 다른 페이지에 접근하려는 경우 아래와 같이 Page Not Found 에러가 발생한다. 검색해보니 이는 React에서도 동일하게 발생하였다. 원인 최초 접속할 때의 url인 /는 index.html에서 읽는다. 하지만, SPA(Single Page Application)인 Vue와 React에서는 다른 화면으로 넘어가는 라우팅된 url에 대한 적절한 자원이 존재하지 않는다. 따라서 Page Not Found 에러가 발생하게 된다. 해결방법 Vue 혹은 React의 public 폴더 아래에 _redirects라는 파일을 생성한다. (확장자는 없다. 그리고 해당 파일 내부에 아래 코드를 작성..

Preflight Request(사전 요청)란? 교자 출처 리소스 공유(CORS) Preflight Request는 본격적인 교차 출처 HTTP 요청 전에 서버 측에서 그 요청의 메서드와 헤더에 대해 인식하고 있는지를 체크하는 것이다. Preflight Request는 HTTP Method(OPTIONS)이며, 본 요청을 보내기 전에 먼저 본 요청에 대한 권한을 확인하는 작업을 통해, 본 요청이 유효한지 체크할 수 있다. Preflight Request는 다음 3가지의 HTTP Request Header를 사용한다. "Access-Control-Request-Method" "Access-Control-Request-Headers" "Origin" Access-Control-Max-Age 헤더를 이용하면,..

상태 코드 상태 코드는 3자리 숫자로 만들어져 있으며, 첫번째 자리는 1에서 5까지 제공된다. 1xx(정보) : 요청을 받았으며 프로세스를 계속 진행 2xx(성공) : 요청을 성공적으로 인식 및 수용 3xx(리다이렉션) : 요청 완료를 위해 추가 작업 조치가 필요. 4xx(클라이언트 오류) : 요청의 문법이 잘못되었거나 요청을 처리할 수 없음 5xx(서버 오류) : 서버가 명백히 유효한 요청에 대한 충족을 실패 1XX : Information responses 서버가 요청을 받았으며, 서버에 연결된 클라이언트는 작업을 계속 진행하라는 의미이다. 100 Continue 진행 중임을 의미하는 응답코드 현재까지의 진행상태에 문제가 없으며, 클라이언트가 계속해서 요청을 하거나 이미 요청을 완료한 경우에는 무시해..

Overview HTTP 요청 메서드는 주어진 리소스에 수행하길 원하는 행동을 나타내며, HTTP 동사라고 부르기도 한다. 종류 GET: 특정 리소스의 표시를 요청한다. GET으 사용하는 요청은 오직 데이터를 받기만 한다. HEAD: GET 메서드의 요청과 동일한 응답을 요구하지만, 응답 본문을 포함하지 않는다. POST: 특정 리소스에 entity를 제출할 때 쓰인다. 이는 종종 서버 상태의 변화나 부작용을 일으킨다. PUT: 목적 리소스 모든 현재 표시를 요청 payload로 바꾼다. DELETE: 특정 리소스를 삭제한다. CONNECT: 목적 리소스로 식별되는 서버로의 터널을 맺는다. OPTIONS: 목적 리소스의 통신을 설정하는 데 사용된다. TRACE: 목적 리소스의 경로를 따라 메시지 loop..

Overview HTTP 메시지는 클라이언트와 서버 사이에서 데이터가 교환되는 방식이며, 요청(requests)과 응답(response)이라는 2가지 유형이 있다. HTTP 메시지는 몇 줄의 텍스트 정보로 구성되며, 이러한 정보는 구성 파일, API, 기타 인터페이스에서 자동으로 완성한다. 아래는 HTTP 메시지의 예시이다. 요청과 응답은 다음과 같은 유사한 구조를 가진다. start line: start line에는 요청이나 응답의 상태를 나타낸다. 항상 첫 번째 줄에 위치하며, 응답에서는 status line이라고 부른다. HTTP headers: 요청을 지정하거나, 메시지에 포함된 본문을 설명하는 헤더의 집합이다. empty line: 헤더와 본문을 구분하는 빈 줄 body: 요청과 관련된 데이터나..