브라우저와 Redirect (feat. XMLHttpRequest)

XMLHttpRequest란?

 - All modern browsers have a built-in XMLHttpRequest object to request data from a server.
비동기적 통신을 브라우저에서 제공하기 위한 W3C 표준 스펙이다.
브라우저에서 제공하는 객체이며, jQuery의 Ajax 또한 XMLHttpRequest를 활용하여 구현되어 있다.

 

---

Redirect 란?

요청 client에게 Server가 다른 곳으로 다시 요청하기 위한 HTTP Response Status이다.
 - 301 Moved Permanently: 요청한 리소스의 URI가 변경됨, redirect 시 method가 GET으로 자동 변경
 - 302 Found: 요청한 리소스의 URI가 일시적으로 변경됨, redirect 시 method가 GET으로 자동 변경
 - 307 Temporary Redirect: 요청한 리소스가 다른 URI에 있으며, 302와 동일하지만, method가 변경 안됩니다.
 - 308 Permanent Redurect: 요청한 리소스가 영구적으로 변경됨, 301과 동일하지만, method가 변경 안됩니다.

즉 서버에서 Client를 다른 URI로 넘기고 싶을 때 주로 사용된다.
OAuth 2.0 스펙에서, authorization 관련 요청 시, 토큰을 redirect를 통해서 전달한다.
서버에서 3xx HttpStatus로 응답하면 Client는 Response Header의 Location 정보를 가지고 Redirect를 수행한다.

 

---

XMLHttpRequest의 Redirect 응답

XMLHttpRequest는 브라우저에서 제공하는 Object이다.
따라서 해당 Object의 통신은 브라우저가 구현했다.
기본적으로 XMLHttpRequest는 Redirect를 자동으로 수행한다.

또한 XHR의 fetch 메서드에서 Redirect에 대한 핸들링을 설정할 수 있다.

fetch(url, {
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded',
    },
    redirect: "follow",
}).then(function (response) {
    if (response.status === 401) {
        alert("로그인에 실패하였습니다.");
        console.log(response.status);
        return;
    }

    console.log(response.url);
    window.location.href = response.url;
});

개인 서버의 로그인 페이지의 script 중 일부이다.
redirect는 3가지 옵션을 지원한다.
follow: 항상 redirect를 수행한다. 즉 send 이후 제공받는 response 객체는 redirect 된 응답 값이다.
manual: redirect를 수행하지 않는다. 하지만, 보안상의 이유로 Location 값을 response로부터 받을 수 없다.
error: redirect status를 오류로 인식한다.

 

---

이슈사항 및 work around

Flutter 프로젝트 진행 중
OAuth 2.0 authorization_code의 redirect 되기 전 응답의 Loaction 헤더값을 핸들링하고 싶었지만
해당 값을 불러올 수 없었다.

기본적으로 Flutter의 기본 io 라이브러리의 web build는 XHR 사용하여 Flutter에 맞게 구현되어 있다.
하지만, 한번 레핑 되는 과정에서 redirect의 핸들링을 항상 follow 하도록 구현되어 있다.
결국 XHR을 직접 컨트롤하기 위해, 단일 페이지로 구성된 HTML + javascript로 따로 구현했다...

 

 

---

REFERENCE

• https://developer.mozilla.org/ko/docs/Web/HTTP/Status
• https://www.w3schools.com/xml/xml_http.asp