2024. 5. 14. 14:09ㆍJavaScript, Vue
- SOP (Same-origin policy)
동일 출처 정책
어떤 출처에서 불러온 문서나 스크립트가 다른 출처에서 가져온 리소스와 상호 작용하는 것을 제한하는 보안 방식
웹 애플리케이션의 도메인이 다른 도메인의 리소스에 접근하는 것을 제어하여 사용자의 개인 정보와 데이터의 보안을 보호하고, 잠재적인 보안 위협을 방지한다.
잠재적으로 해로올 수 있는 문서를 분리함으로써 공격받을 수 있는 경로를 줄인다.
- Origin (출처)
URL의 Protocol, Host, Port 를 모두 포함하여 ‘출처’라고 부른다.
이 3가지가 모두 일치하는 경우, 동일 출처로 인식한다.
- CORS Policy (교차 출처 리소스 공유 정책)
다른 출처에서 온 리소스를 공유하는 것에 대한 정책으로, 웹 애플리케이션이 다른 도메인에 있는 리소스에 안전하게 접근할 수 있도록 허용 또는 차단하는 보안 메커니즘이다.
서버에서 설정되며, 브라우저가 해당 정책을 확인하여 요청이 허용되는지 여부를 결정한다.
→ 다른 출처의 리소스를 불러오려면 그 서버에서 올바른 CORS header를 포함한 응답을 반환해줘야 한다.
기본적으로 웹 브라우저는 같은 출처에서만 요청하는 것을 허용하고 다른 출처로의 요청은 보안상의 이유로 차단한다. SOP에 의해 다른 출처의 리소스와 상호작용 하는 것이 기본적으로 제한되기 때문이다. 하지만 현대 웹 애플리케이션은 다양한 출처로부터 리소스를 요청하는 경우가 많기 때문에 CORS 정책이 필요하게 되었다.
- CORS (Cross-Origin Resource Sharing) : 교차 출처 리소스 공유
CORS는 웹 서버가 리소스에 대한 서로 다른 출처 간 접근을 허용하도록 선택할 수 있는 기능을 제공한다.
⇒ 특정 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제
⇒ 다른 출처의 리소스를 가져오기 위해서는 이를 제공하는 서버에서 브라우저에 다른 출처지만 접근해도 된다는 사실을 알려줘야 한다.
- Authentication (인증)
수신된 요청을 해당 요청의 사용자 또는 자격 증명과 연결하는 메커니즘
= 누구인지 확인하는 과정
- Permissions (권한)
요청에 대한 접근 허용 또는 거부 여부를 결정
- DRF 에서의 인증
인증은 항상 view 함수 시작 시, 권한 및 제한 확인이 발생하기 전, 다른 코드의 진행이 허용되기 전에 실행된다. 단, 인증 자체로는 들어오는 요청을 허용하거나 거부할 수 없으며, 단순히 요청에 사용된 자격 증명만 식별한다는 것을 유의
- 승인되지 않은 응답 및 금지된 응답
인증되지 않은 요청이 권한을 거부하는 경우 2가지 오류 코드를 응답할 수 있다.
1. HTTP 401 Unauthorized
→ 요청된 리소스에 대한 유효한 인증 자격 증명이 없기에 클라이언트 요청이 완료되지 않았음을 나타낸다. = 누구인지 증명할 자료가 없다!
2. HTTP 403 Forbidden (Permission Denied)
→ 서버에 요청이 전달되었지만, 권한 때문에 거절되었다는 것을 의미한다. 401 응답과 달리 서버가 클라이언트가 누구인지는 알고 있는 상태
- TokenAuthentication
token 기반 HTTP 인증 체계
기본 데스크톱 및 모바일 클라이언트와 같은 클라이언트-서버 설정에 적합하다.
서버가 인증된 사용자에게 토큰을 발급하고 사용자는 매 요청마다 발급받은 토큰을 요청과 함께 보내 인증 과정을 거친다.
- Dj-Rest-Auth
회원가입, 인증(소셜 미디어 인증 등), 비밀번호 재설정, 사용자 세부 정보 검색, 회원 정보 수정 등 다양한 인증 관련 기능을 제공하는 라이브러리
- 클라이언트가 Token으로 인증 받는 방법
- Authorization HTTP Header에 포함
- 키 앞에는 문자열 ‘Token’ 이 와야 하며 공백으로 토큰과 문자열을 구분
- IsAuthenticated 권한
인증되지 않은 사용자에 대한 권한을 거부하고 인증된 사용자의 경우 권한을 허용
- Django Signals
= 이벤트 알림 시스템
애플리케이션 내에서 특정 이벤트가 발생할 때, 다른 부분에 신호를 보내어 이벤트가 발생했음을 알릴 수 있다.
주로 모델의 데이터 변경, 저장, 삭제와 같은 작업에 반응하여 추가적인 로직을 실행하고자 할 때 사용한다.
- 환경 변수 (environment variable)
애플리케이션의 설정이나 동작을 제어하기 위해 사용되는 변수
개발, 테스트 및 프로덕션 환경에서 다르게 설정되어야 하는 설정 값이나 API key 같은 민감한 정보를 포함한다.
환경 변수를 사용하여 애플리케이션의 설정을 관리하면 다양한 환경에서 일관된 동작을 유지하면서 필요에 따라 변수를 쉽게 변경할 수 있다.
또한 보안 문제를 피하고 애플리케이션을 다양한 환경에 대응하기 쉽게 만들어준다.
'JavaScript, Vue' 카테고리의 다른 글
Vue : State Management (0) | 2024.05.12 |
---|---|
Vue : Router (0) | 2024.05.09 |
Vue : Component State Flow (0) | 2024.05.09 |
Vue : Single-File Components (0) | 2024.05.02 |
Vue : Basic Syntax (0) | 2024.04.30 |