HTTP Redirect

참고: https://developer.mozilla.org/ko/docs/Web/HTTP/Redirections

URL 리다이렉션과 포워딩은 페이지 같은 리소스를 웹 애플리케이션이 다른 URL에 위치한 상태에서 링크를 존속시키는 기술이다.

원칙

HTTP에서 리다이렉션은 요청에 대해 특수한 응답을 전달함으로써 실행된다. 리다이렉트는 300번대의 상태코드를 가진 응답으로 리다이렉트 응답을 수신한 브라우저는 제공된 새로운 URL을 사용하여 이 새로운 URL을 즉시 로드한다.

Redirect 유형

영속적 리다이렉션

영원히 지속되는 리다이렉션. 원래의 URL이 더 이상 사용되지 않아야하며 새로운 URL을 더 선호한다.

301(Moved Permanently)

웹 사이트를 새롭게 띄워줄 때 사용. GET 메서드는 그대로 GET 메서드를 사용하며 다른 HTTP 메서드는 GET으로 변하거나 그대로 사용할 수 있다.

308(Permanent Redirect)

마찬가지로 웹 사이트를 새롭게 띄워줄 때 사용. 단, 308은 GET이 아닌 다른 HTTP 메서드를 사용할 때 동작의 애매모호함을 개선하고자 만들어졌다. 308은 메서드와 본문의 변경을 허용하지 않는다.

일시적 리다이렉션

302(Found)

303(See Other)

동작을 다시 촉발시키는 페이지 리프레시를 막기위한 리다이렉트 옵션. PUT이나 POST 요청 뒤에 사용된다.

307(Temporary Redirect)

302와 비슷. 단, GET이 아닌 다른 메서드를 사용하는 경우 동작의 애매모호함을 제거하기 위해 사용.

Permanent vs Temporary

참고: https://www.hochmanconsultants.com/301-vs-302-redirect/

사실 영속적 리다이렉션과 일시적 리다이렉션의 차이는 눈으로는 잘 구별이 안간다.
영속적 리다이렉션과 일시적 리다이렉션의 가장 큰 차이는 검색엔진의 판단이다. 잘못된 리다이렉션은 검색엔진에 트래픽 손실을 초래한다.

여기서 Permanent의 의미는 현재 리소스의 정보가 다른 URL로 옮겨진 경우를 의미한다. chorizzori.tistory.com의 내용의 pkch93.github.io로 옮겼거나 [chorizzori.tistory.com/posts?postId=1의](http://chorizzori.tistory.com/post?postId=1의) 내용을 [chorizzori.tistory.com/posts/1로](http://chorizzori.tistory.com/posts/1로) 바꾸고 싶은 경우 등에 사용할 수 있다.

위와 같은 경우에 301 응답을 사용하면 검색엔진이 이전에 인덱싱한 내용을 새로운 주소로 변경하여 반영하게 된다.

반면, Temporary는 일시적인 페이지, 사이트의 이동만을 다룬다. 따라서 검색엔진이 새로운 주소에 대해 반영하지 않는다.

단, 301 응답을 만드는 것은 조금 까다롭다. 아파치 서버의 경우는 .htaccess파일 설정을 해주어야하며 윈도우 서버는 약간의 오버헤드가 있을 수 있다.

특수 리다이렉션

300(Multiple Choice)

수동 리다이렉션. 브라우저에 리다이렉션 가능한 링크가 나열되어 클라이언트가 선택할 수 있도록 만든 리다이렉션. 거의 사용되지 않는다.

304(Not Modified)

캐시 리프레시. 캐시 값이 여전히 사용될 수 있다는 의미.

리다이렉션 방법과 우선순위

Response로 주어지는 HTTP Redirect 이외에도 두 가지 리다이렉트 방법이 있다. meta태그를 이용하는 HTML Redirect와 DOM을 사용하는 Javascript Redirect가 존재한다.

HTML Redirect

자주 사용되는 방법은 아니지만 개발자가 서버 제어권이 없거나 구성할 수 없는 경우 종종 사용되는 방법이다. meta태그와 함께 http-equiv 속성을 refresh로 두어 Redirect를 구현할 수 있다.

<meta http-equiv="refresh" content="0;URL='http://www.google.com'"/>

content 속성으로 리다이렉트 할 페이지를 정의할 수 있다. 위 content 속성에 첫 번째로 오는 숫자는 리다이렉트까지 기다려야하는 시간을 의미한다. 세미콜론 ;으로 구분하며 그 뒤에 URL로 리다이렉트 할 주소를 설정한다.

HTTP Redirect는 HTML 페이지에만 동작한다.

Javascript Redirect

자바스크립트를 활용한 리다이렉트. window.location의 값을 조작하여 리다이렉트하는 방법이다.

window.location = 'http://www.google.com'

HTTP Redirect처럼 모든 리소스에 대해 동작하는 것은 아니다. 자바스크립트를 실행한 클라이언트 상에서만 동작한다.

우선순위

1. HTTP Redirect
2. HTML Redirect
3. Javascript Redirect

위 순서로 페이지 리다이렉트가 된다. 단, 가능한 경우 HTTP Redirect를 사용해야하며 <meta>는 가능하면 사용하지 않아야한다. 조금의 실수로 Redirect 루프에 빠질 수 있기 때문이다.

리다이렉션 루프

성공적인 리다이렉션이 이전의 리다이렉션을 다시 따라갈 때 일어나는 상황. 즉, 리다이렉션이 다른 리다이렉션을 불러 결국 어떤 페이지도 볼 수 없는 상황을 의미한다.

대부분 서버 측 문제로 서버가 감지할 수 없다면 500 Internal Server Error가 발생한다. 리다이렉션 루프는 사용자 경험을 망치므로 피하는 것이 중요하다.