20. 모든 개발자를 위한 HTTP 웹 기본 지식 - [HTTP 상태코드] - 3xx - 리다이렉션 1

👨🏻‍🏭 3xx (Redirection)

요청을 완료하기 위해 유저 에이전트(웹 브라우저)의 추가 조치 필요

300 : Multiple Choices

301 : Moved Permanently

302 : Found

303 : See Other

304 : Not Modified

307 : Temporary Redirect

308 : Permanent Redirect

---

🧑🏻‍🏫 리다이렉션 이해

웹 브라우저는 3xx 응답의 결과에 Location 헤더가 있으면, Location 위치로 자동 이동(리다이렉트)

사용자가 예전 이벤트 페이지( /event) URL을 북마크 해두었는데 새로운 이벤트 페이지(/new-event) URL로 바뀐 경우, 사용자가 예전 이벤트 페이지에 접속해도 새로운 이벤트 페이지 URL로 자동으로 접속할 수 있게 한다.

 

🌊자동 리다이렉트 흐름

1. 클라이언트가 GET /event 를 서버에 요청한다.
2. /event 는 더이상 사용되지 않으므로 서버는 상태코드 301과 Location에 /new-event를 담아 응답한다.
3. 웹 브라우저에서 URL 경로를 /event -> /new-event 로 자동 리다이렉트 한다.
4. 클라이언트가 GET /new-event를 서버에 요청한다.
5. 서버는 상태코드 200과 /new-event에 대한 리소스를 응답한다.

 

🧑🏻‍🏫리다이렉션 종류

1) 영구 리다이렉션: 특정 리소스의 URI가 영구적으로 이동

• 이벤트 페이지 URI가 바뀌어 더이상 사용하면 안되거나 내부적으로 URI 경로가 아예 바뀐 경우→ /event -> /new-event
• → /members -> /users

2) 일시 리다이렉션: 일시적인 변경

• 주문 완료 후 주문 내역 화면으로 이동
• PRG: Post/Redirect/Get

3) 특수 리다이렉션: 결과 대신 캐시를 사용

---

🏺 영구 리다이렉션 - 301, 308

리소스의 URI가 영구적으로 이동

• 301과 308의 기능은 동일
• 리소스의 URI가 영구적으로 이동했다는 거를 알려준다. 따라서 원래의 URI를 사용하면 안된다.
• 하지만 검색 엔진들이 원래의 URI로 들어오는 경우들이 많다.
• 검색 엔진등에서도 변경을 인지할 수 있다.

👻 301 Moved Permanently

리다이렉트시 요청 메서드가 GET으로 변하고, 본문이 제거될 수 있음(MAY)

1. 클라이언트가 메세지 바디에 리소스를 담아 POST /event 를 서버에 요청
2. 서버는 메세지 바디를 제거하고  /event는 더이상 쓰지 않으니 /new-event를 쓰겠다고 301 코드와 Location에 /new-event를 담아 응답한다.
3. 그럼 클라이언트는 새로운 URI로 경로를 바꾸게 되고(자동 리다이렉트) 메시지를 제거하여 GET /new-event 를 서버에 요청한다. (Post에서 Get으로 변경)
4. 서버는 200 코드와 /new-event 의 리소스를 응답한다.
   > 이벤트 페이지에서 회원 정보를 등록하려고 했으나, 메시지 바디가 제거된 채로 자동 리다이렉트 되어 입력한 정보가 날라가 처음부터 회원 정보를 다시 입력해서 등록해야 한다.

---

🎃 308 Permannet Redirect

리다이렉트시 요청 메서드와 본문 유지

1. 클라이언트가 메세지 바디에 리소스를 담아 POST /event 를 서버에 요청하면
2. 서버는 메세지 바디를 제거하고 308 코드와 Location에 /new-event를 담아 응답한다.
3. 웹 브라우저의 URL이 자동 리다이렉트 되고 클라이언트는 메시지를 유지해서 POST /new-event 를 서버에 요청한다.
4. 서버는 200 코드와 /new-event 의 리소스를 응답한다.
   > 이벤트 페이지에서 회원 정보를 등록하면 자동 리다이렉트 되어 입력한 정보가 유지되어 회원 정보가 정상 등록된다.

(참고) 여기서는 스펙 설명을 위해 이런 예제를 보여주었지만, 실무에서는 308을 거의 사용하지 않는다.

 

만약 /event 에서 /new-event로 URI가 바뀌면 내부적으로 전달해야하는 데이터 자체가 바뀌기 때문에, POST로 요청을 받아도 리다이렉트시 GET으로 바뀌는게 맞다.

---

🙋🏻‍♂️ Q&A

Q. 상태코드를 개발자가 직접 지정하여 응답 메시지를 보내는 건가요? 그렇다면 어떻게 상태코드를 지정하나요?

 

A. 백엔드 웹 프레임워크들은 보통 HTTP 상태 코드를 직접 지정할 수 있는 메서드를 제공한다.

response.setStatus(303)

 

[출처] https://www.inflearn.com/questions/112127

---

Q. 서버 측에서 동일 주문 중복 방지를 하기 위해 어떻게 구현해야하나요?

 

A. 보통 주문 화면에 들어가는 시점에 서버에서 임시 주문 번호를 발급해두는데, 주문 번호는 다음과 같이 만들 수 있다.

1. DB가 제공하는 중복없이 순서대로 값이 증가하는 시퀀스 값을 사용
2. UUID 사용

 

[출처] https://www.inflearn.com/questions/117465

---

Q. 영구 리다이렉트와 일시 리다이렉트의 차이점은 무엇인가요?

 

A. 단순 웹 브라우저 입장에서는 영구 리다이렉트와 일시 리다이렉트는 같다.

다만 검색엔진처럼 사용자가 아닌 시스템이 크롤링을 하는 경우를 생각해보면 도움이 된다.

1. 영구 리다이렉트는 검색 엔진이 URL을 변경해도 된다.
2. 일시 다이렉트는 검색 엔진이 URL을 변경하면 안된다. URL이 일시적으로 변경된 것으로 향후 다르게 변경될 수 있기 때문이다.

 

[참고] https://www.inflearn.com/questions/137142

[참고] https://www.inflearn.com/questions/189308

 

참고 : https://hseungyeon.tistory.com

 

위 자료는 김영한님의 ‘모든 개발자를 위한 HTTP 웹 기본 지식’ 강의를 참고하여 작성하였습니다.
https://www.inflearn.com/course/http-웹-네트워크/dashboard