기본 콘텐츠로 건너뛰기

django-cors-headers 설정부터 보안 팁까지

Django로 웹 개발을 하다 보면, 프론트엔드(React나 Vue.js 같은)랑 백엔드(Django)가 서로 다른 도메인에서 돌아가는 경우가 많잖아요? 그럴 때 마주치는 골칫덩어리가 바로 CORS 문제입니다. 저도 처음엔 엄청 헤맸는데, django-cors-headers라는 멋진 패키지를 알게 된 후로는 한결 수월해졌어요. 하지만 이게 은근히 보안에 민감한 부분이라, 제대로 설정하지 않으면 큰일 날 수 있다는 걸 깨달았죠. 오늘은 제가 겪었던 경험과 함께, 안전하게 CORS 설정하는 방법을 알려드릴게요!

먼저 CORS가 뭔지 간단히 설명해 드릴게요. CORS는 "Cross-Origin Resource Sharing"의 약자로, 쉽게 말해 브라우저가 다른 도메인의 자원(예를 들어, Django 서버에서 제공하는 API)에 접근하려 할 때 발생하는 보안 제약입니다. 브라우저는 보안상 같은 도메인에서만 자원을 가져오도록 되어있거든요. 그래서 다른 도메인에서 API를 호출하려면, Django 서버가 특별한 허락(CORS 헤더)을 보내줘야 합니다. django-cors-headers는 이 허락을 자동으로 보내주는 역할을 하는 든든한 조력자 같은 존재죠.

핵심은 세 가지입니다. 첫째, Origin: API를 요청하는 도메인(프론트엔드)이죠. 둘째, CORS 헤더: Django 서버가 Origin에 접근을 허용할지 말지를 알려주는 신호 같은 겁니다. Access-Control-Allow-Origin 이라는 헤더가 가장 중요하고, Access-Control-Allow-Methods (어떤 HTTP 메서드를 허용할지, 예: GET, POST 등), Access-Control-Allow-Headers (어떤 헤더를 허용할지) 같은 것도 있어요. 마지막으로 Pre-flight request: 실제 요청 전에 서버가 허용하는 메서드와 헤더를 미리 확인하는 요청이에요. OPTIONS 메서드를 사용합니다. 이해가 되셨나요? 조금 어렵죠? 하지만 실제로 설정하는 건 생각보다 간단해요.

자, 이제 실제로 설정하는 방법을 보여드릴게요. 저는 처음에 설치하는 것부터 막혔었는데, 이건 의외로 간단합니다. 터미널에서 pip install django-cors-headers 라고 입력하면 끝!

다음은 settings.py 파일을 수정하는 부분입니다. 여기서 잠깐! settings.py 파일이 어딘지 모르시겠다면, Django 프로젝트의 최상위 디렉토리에서 찾아보세요. 없으면 큰일이에요! (농담입니다. 새로 만들면 됩니다.)

먼저 INSTALLED_APPS'corsheaders'를 추가해야 합니다. 그리고 이게 중요한데, MIDDLEWARE 설정에서 corsheaders.middleware.CorsMiddlewaredjango.middleware.common.CommonMiddleware 에 넣어줘야 해요. 순서가 바뀌면 제대로 작동하지 않으니 꼭 기억해두세요!

그리고 가장 중요한 CORS_ALLOW_ORIGIN_WHITELIST 설정입니다. 여기서 허용할 도메인들을 명시적으로 적어줘야 해요. 개발 환경(localhost)에서는 여러 포트를 허용하는 게 편리하겠죠? 예를 들어, CORS_ALLOW_ORIGIN_WHITELIST = ["http://localhost:3000", "http://127.0.0.1:3000", "http://localhost:8000"] 이렇게요. 하지만 운영 환경에서는 절대 CORS_ALLOW_ALL_ORIGINS = True를 쓰면 안 됩니다! 보안에 치명적인 문제가 생길 수 있어요. 반드시 특정 도메인만 허용하도록 CORS_ALLOW_ORIGIN_WHITELIST를 설정해야 합니다. 예를 들어, CORS_ALLOW_ORIGIN_WHITELIST = ["https://www.example.com"] 이런 식으로요. www.example.com을 여러분의 도메인으로 바꿔주세요!

필요에 따라 CORS_ALLOW_METHODS (허용할 HTTP 메서드)와 CORS_ALLOW_HEADERS (허용할 헤더)도 설정할 수 있습니다. 이 부분은 기본 설정값을 사용해도 괜찮지만, 필요한 헤더가 있다면 추가해주세요. 예를 들어, 인증 관련 헤더(authorization)가 필요할 수도 있겠죠.

CORS_ALLOW_CREDENTIALS = True 설정은 쿠키를 포함해서 요청을 보낼 수 있도록 허용하는 옵션입니다. 개발 환경에서 편의성을 위해 사용할 수 있지만, 운영 환경에서는 신중하게 사용해야 합니다. 그리고 중요한 점! CORS_ALLOW_CREDENTIALS = True를 사용하면 CORS_ALLOW_ORIGIN에는 단 하나의 Origin만 설정해야 합니다. 와일드카드(*)는 절대 사용하면 안 돼요!

마지막으로, 정적 파일(CSS, JavaScript, 이미지)은 CORS 설정과는 별개로 처리됩니다. 정적 파일을 제공하는 서버의 설정을 확인해야 합니다.

자, 이제 CORS 설정이 끝났습니다! 하지만 설정 후에는 반드시 테스트를 해봐야 합니다. 제대로 설정되지 않았다면 브라우저 콘솔에서 CORS 에러 메시지를 볼 수 있을 거예요. 그럼 다시 설정을 확인해보세요. 특히 운영 환경에서는 보안 전문가와 상의해서 설정하는 것을 추천합니다. 보안은 항상 최우선이니까요! 어려워 보이지만, 한번 해보면 의외로 쉽다는 것을 알게 될 거예요. 화이팅!

댓글

이 블로그의 인기 게시물

Django에서 트랜잭션 관리하기

Django에서 트랜잭션 관리하기 안녕하세요! 오늘은 Django에서 데이터베이스 트랜잭션을 효과적으로 관리하는 방법에 대해 알아보겠습니다. 1. 트랜잭션의 중요성 트랜잭션은 데이터베이스의 일관성과 무결성을 보장하는 중요한 개념입니다. Django에서는 여러 가지 방법으로 트랜잭션을 관리할 수 있습니다. 1.1 기본 개념 원자성(Atomicity) : 트랜잭션은 모두 실행되거나 모두 실행되지 않아야 합니다. 일관성(Consistency) : 트랜잭션 전후로 데이터베이스의 일관성이 유지되어야 합니다. 격리성(Isolation) : 동시에 실행되는 트랜잭션들이 서로 영향을 주지 않아야 합니다. 지속성(Durability) : 완료된 트랜잭션의 결과는 영구적으로 저장되어야 합니다. 2. Django의 트랜잭션 관리 2.1 기본 설정 # settings.py DATABASES = { 'default': { 'ENGINE': 'django.db.backends.postgresql', 'NAME': 'mydatabase', 'USER': 'myuser', 'PASSWORD': 'mypassword', 'HOST': 'localhost', 'PORT': '5432', 'ATOMIC_REQUESTS': True, # 모든 뷰를 트랜잭션으로 래핑 } } 2.2 데코레이터 사용 from django.db import transaction @transaction.atomic def create_order(user, items): order = Order.objects.create(user=...

AWS S3 + CloudFront로 정적 파일 서빙 완전 가이드

AWS S3 + CloudFront로 정적 파일 서빙 완전 가이드 안녕하세요! 오늘은 AWS S3와 CloudFront를 사용하여 정적 파일을 효율적으로 서빙하는 방법에 대해 알아보겠습니다. 왜 S3와 CloudFront를 사용할까요? 높은 가용성 : AWS의 글로벌 인프라를 활용 빠른 전송 속도 : CloudFront의 CDN 기능으로 전 세계 사용자에게 빠른 전송 비용 효율성 : 사용한 만큼만 지불 보안 : AWS의 보안 기능 활용 확장성 : 트래픽 증가에 자동 대응 1. S3 버킷 설정 1.1 버킷 생성 및 설정 import boto3 def create_s3_bucket(): s3 = boto3.client('s3') # 버킷 생성 bucket_name = 'your-static-files-bucket' s3.create_bucket( Bucket=bucket_name, CreateBucketConfiguration={ 'LocationConstraint': 'ap-northeast-2' } ) # 버킷 정책 설정 bucket_policy = { "Version": "2012-10-17", "Statement": [ { "Sid": "PublicReadGetObject", "Effect": "Allow", "Principal": "*", "Action": "s3:GetObje...

Python에서 asyncio 완전 정복 (await, async, gather 등)

어휴, 요즘 파이썬으로 비동기 프로그래밍 하는 재미에 푹 빠졌어요! 특히 asyncio 는 정말 마법 같더라고요. 처음엔 좀 낯설었는데, 익숙해지니까 속도 향상이 눈에 띄게 느껴져서 완전 반해버렸습니다. 이 글에선 제가 asyncio 를 배우면서 깨달은 점들을 풀어놓을게요. 혹시 비동기 프로그래밍이 뭔지 잘 모르시겠다면, 간단히 말해 여러 작업을 동시에 처리해서 프로그램 속도를 엄청나게 높이는 기술이라고 생각하시면 돼요. 마치 여러 요리사가 동시에 음식을 만들어서 손님에게 빨리 제공하는 것과 비슷하죠! 일단 async 와 await 라는 녀석들이 핵심인데요, async 는 함수 앞에 붙여서 "얘는 비동기 함수야!"라고 선언하는 거예요. 그리고 await 는 다른 비동기 함수가 끝날 때까지 기다리라고 지시하는 역할을 하죠. 예를 들어, 네트워크에서 데이터를 가져오는 함수가 있다면, await 를 사용해서 데이터가 다 가져올 때까지 기다렸다가 다음 작업을 진행할 수 있어요. 그 동안 다른 작업을 처리할 수 있으니, 마치 멀티태스킹을 하는 것처럼 느껴져요. 신기하지 않나요? 그리고 asyncio.gather 는 여러 비동기 함수를 동시에 실행하고 결과를 모아주는 아주 유용한 친구입니다. 제가 웹사이트 여러 개에서 데이터를 동시에 가져와야 할 때 정말 요긴하게 썼어요. 하나씩 순서대로 가져오는 것보다 훨씬 빠르더라고요! 마치 여러 개의 탭을 동시에 열어놓고 작업하는 것과 같다고 생각하시면 될 것 같아요. 실제로 제가 썼던 코드를 보여드릴게요. 세 개의 웹사이트에서 데이터를 가져오는 예제인데요. (아래 코드 삽입) 이 코드를 보시면, fetch_data 함수가 각 웹사이트에서 데이터를 가져오는 역할을 하고, asyncio.gather 가 이 함수들을 동시에 실행하도록 도와주는 것을 볼 수 있을 거예요. asyncio.sleep(2) 는 네트워크 지연을 시뮬레이션하기 위해 넣...