REST API를 사용한 폼 베이스 인증(Form Base Authentication)에 베이직/다이제스트 인증(Basic/Digest Authentication)을 적용하기 #2

2019. 7. 16. 20:37Programming/JavaScript

반응형

폼 베이스 인증에 다이제스트 인증을 적용하기 #1 에서 싱겁게 끝내긴 하지만, 팀장님을 회유하는데 완벽하게 실패해버린 나는 다이제스트 인증을 따로 구현하는 수밖에 없었다. 야! 회사다닐 맛 난다! ^ ㅈ^)(쑻) 일단 가능한지부터 검토하기위해 Basic Authentication을 구현해봤다. 일단 HTTP Authentication, MDN web docs를 참조하여 Basic Authentication에 대한 내용을 파악하도록 하자. 크게 어렵지 않다.

 

일단 서버에서 인증정보 없이 접근을 시도하는 상대에게 401 에러와 함께, 헤더에 WWW-Authenticate값을 Basic Realm="[Realm]"와 같이 전달하여 Basic Authentication을 사용하고 있음을 알려준다. 401 응답을 받은 클라이언트는 헤더의 WWW-Authenticate값을 확인하고, Authorization라는 필드에 ID:Password의 base64 인코딩 값을 기록하여 다시 로그인을 시도한다. 사실상 base64는 복호화가 가능한 값이므로, 보안이 상당히 취약하다는 단점이 그대로 존재한다. 만약 폼 베이스 인증을 사용하면서 보안을 목적으로 Basic 인증을 추가적으로 사용하겠다고 한다면, 상식적으로 이해가 가지 않는 내용이된다. 폼 베이스에서 받은 ID와 패스워드값이 Plain text여서, 베이직 인증을 통해 보안을 강화하겠다면 또 모를까...

 

Vanilla Javascript를 사용할 경우에는 XMLHttpRequestsetRequestHeader를 사용하여, 헤더의 Authorization 필드에 접근할 수 있다.

`XMLHttpRequest.setRequestHeader("Authorization", "Basic " + btoa(username + ":" + password));`

 

jQuery에서는 beforeSend를 이용하여 통신하기 전에, 다음과 같이 헤더의 Authorization 필드에 접근할 수 있다.

beforeSend: function (xhr) {
    xhr.setRequestHeader ("Authorization", "Basic " + btoa(username + ":" + password));
}

 

AngularJS 1에서는 $http를 이용하여 통신하기 전에, 다음과 같이 헤더의 Authorization 필드에 접근할 수 있다.

$http.defaults.headers.common.Authorization = 'Basic '+$base64.encode([ID]+":"+[Password]);

 

일반적으로 요즈음의 프레임워크를 사용하는 경우라면 이런 경우가 없으리라 생각되므로, 여기까지만 기록하고 이번 글을 마치도록 한다. 당연하게도 서버쪽에서는 헤더에 기록된 Authorization필드값을 읽은 후, DB에 저장된 ID와 Password를 조합하여 base64값을 생성한 뒤 비교하면 된다. 간단간단...

 

기왕이면 Basic Authentication을 추가로 적용할바에야, Form으로 전달받은 ID와 Password를 단방향 암호화해서 전달하는 편이 훨씬 보안적으로 안전하다는 점을 기억해두자. 요즈음에는 SHA256, SHA512로 암호화하는 오픈소스도 많고, 심지어 암호화하는데 시간도 오래 걸리지 않는다 ' ㅅ')-3

반응형