횡단 관심사
횡단 관심사는 여러 서비스에 걸쳐서 동작해야 하는 코드를 의미한다.
관심사란 코드가 하고자 하는 목적과 동작을 의미하는데, 횡단 관심사는 여기서 확장하여 애플리케이션 내 핵심 비즈니스 로직들에 걸져서 실행되어야 하는 동작들을 의미함.
대표적인 예시들은 다음과 같다.
- 인증 / 인가
- 로깅
- 트랜잭션 처리
- 에러처리
이 중에 프론트엔드에서 가장 흔히 생각할 수 있는 "인증 / 인가"에 대해 다뤄볼 것임.
횡단 관심사 처리의 중요성
횡단 관심사는 여러 비즈니스 로직들에 걸쳐 실행되기 때문에 혼재되면 로직과 횡단 관심사 모두 수정하기 힘들어진다.
예를 들어, 인증 로직이 핵심 비즈니스 로직 안에 혼재되면 코드의 관심사가 여러 개가 되는 것임.👽
또, 이후 인증 로직이 변경된다면 이걸 수정하기 위해 여러 모듈을 건드리거나 수정해야 하는 아주 귀찮은 일이 발생하는 것이다.
HTTP 통신에서 횡단 관심사 처리
인증 / 인가를 풀어서 설명하자면 내가 누구인지 증명하고, 이에 걸맞은 권한을 획득하는 행위를 의미한다.
인증이 왜 횡단 관심사인가? 하면 인증은 특정 비즈니스 로직에 포함된 것이 아니라 HTTP통신을 이용하는 비즈니스 로직에 걸쳐 이뤄져야 하는 동작이기 때문이다. 여러 핵심 로직에 걸쳐 수행돼야 하기에 횡단 관심사라고 하는 것.
HTTP란 백엔드 서버와 통신할 때 가장 기본적으로 사용하는 프로토콜이다.
HTTP는 stateless(상태를 유지하지 않는) 특징으로 인해 매 요청을 별개의 요청으로 처리한다. 따라서 HTTP통신을 주고받을 때 증명을 하려면, 프론트엔드단에서 인증 정보를 통신마다 전송해줘야 한다.
https://codesandbox.io/p/sandbox/http-cross-cutting-concenrs-52slq8?file=%2Fsrc%2FApp.js%3A22%2C1
codesandbox.io
>> 예제 코드
예제 코드를 보면 Base URL 설정과 인증 토큰 자동 추가등으로 횡단 관심사를 처리해주고 있음.