python / / 2024. 8. 16. 14:40

[fastapi] 교차 출처 리소스 공유(cors) 설정하기

교차 출처 리소스 공유(CORS, Cross-Origin Resource Sharing)는 웹 애플리케이션이 서로 다른 출처(도메인, 프로토콜 또는 포트)에서 리소스를 요청할 때 발생하는 보안 메커니즘이다. CORS는 기본적으로 웹 브라우저에서 다른 출처의 리소스에 대한 접근을 제한하며, 이를 우회하기 위해 서버에서 CORS 헤더를 통해 특정 출처에서의 접근을 허용할 수 있다.

FastAPI는 이러한 CORS 설정을 간편하게 구성할 수 있는 기능을 제공하며, 이 글에서는 FastAPI에서 CORS를 설정하는 방법을 다룬다.

1. CORS가 필요한 이유

CORS는 기본적으로 보안을 강화하기 위해 존재한다. 브라우저는 자바스크립트를 사용한 요청이 다른 출처로 전송될 때 이를 제한하는데, 이는 악의적인 스크립트가 사용자의 권한으로 다른 출처에 있는 리소스에 접근하는 것을 방지하기 위함이다. 예를 들어, 특정 웹 애플리케이션에서 API를 호출할 때, 해당 API가 다른 도메인에 있을 경우 CORS 정책에 의해 접근이 차단될 수 있다.

CORS 문제는 프론트엔드 애플리케이션과 백엔드 API 서버가 다른 도메인에 있을 때 주로 발생한다. 이 문제를 해결하기 위해 서버에서 CORS를 허용하도록 설정해야 한다.

2. FastAPI에서 CORS 설정하기

FastAPI에서 CORS를 설정하는 것은 매우 간단하다. FastAPI는 이를 위해 fastapi.middleware.cors.CORSMiddleware를 제공하며, 몇 가지 간단한 설정으로 CORS 문제를 해결할 수 있다.

2.1. 기본적인 CORS 설정

아래는 기본적인 CORS 설정 예제이다. 이 설정은 특정 도메인에서만 API 요청을 허용하는 방식이다.

from fastapi import FastAPI
from fastapi.middleware.cors import CORSMiddleware

app = FastAPI()

origins = [
    "http://example.com",
    "https://example.com",
    "http://localhost:3000",
    "http://localhost:8000",
]

app.add_middleware(
    CORSMiddleware,
    allow_origins=origins,
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)

@app.get("/")
def read_main():
    return {"message": "Hello World"}

이 코드에서는 CORSMiddleware를 통해 CORS 설정을 추가했다.

  • allow_origins: 허용할 출처(origin)를 정의한다. 여기에 포함된 도메인만 API에 접근할 수 있다.
  • allow_credentials: 브라우저에서 쿠키와 같은 자격 증명을 포함한 요청을 허용할지 여부를 설정한다.
  • allow_methods: 허용할 HTTP 메서드를 지정한다. ["*"]로 설정하면 모든 메서드를 허용한다.
  • allow_headers: 허용할 HTTP 헤더를 지정한다. ["*"]로 설정하면 모든 헤더를 허용한다.

2.2. 모든 출처에서 허용하기

테스트 목적이나 로컬 개발 환경에서는 모든 출처에서의 요청을 허용해야 할 때가 있다. 이를 위해 allow_origins["*"]를 설정할 수 있다.

app.add_middleware(
    CORSMiddleware,
    allow_origins=["*"],  # 모든 출처에서 허용
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)

이 설정은 보안에 취약할 수 있으므로, 실제 프로덕션 환경에서는 사용하지 않는 것이 좋다. 프로덕션 환경에서는 특정 출처만 허용하도록 설정하는 것이 권장된다.

3. 고급 CORS 설정

CORS는 단순히 출처를 허용하는 것 외에도 더 복잡한 요구 사항을 지원할 수 있다. 예를 들어, 특정 헤더나 메서드만 허용하거나, 응답에 포함될 수 있는 노출된 헤더를 지정할 수 있다.

app.add_middleware(
    CORSMiddleware,
    allow_origins=["https://example.com"],
    allow_credentials=True,
    allow_methods=["GET", "POST"],
    allow_headers=["Authorization"],
    expose_headers=["X-Custom-Header"],
)
  • allow_methods: GET과 POST 요청만 허용한다.
  • allow_headers: Authorization 헤더만 허용한다.
  • expose_headers: 클라이언트가 응답에서 접근할 수 있는 헤더를 지정한다. 이 경우, X-Custom-Header 헤더를 클라이언트가 확인할 수 있다.

4. CORS 오류 해결하기

CORS 오류는 일반적으로 브라우저 콘솔에 표시된다. "CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource"와 같은 메시지가 나타날 수 있다. 이 오류를 해결하려면 서버의 CORS 설정을 확인하고, 클라이언트에서 서버로 요청을 보낼 때 올바른 출처와 메서드, 헤더를 사용했는지 점검해야 한다.

반응형
  • 네이버 블로그 공유
  • 네이버 밴드 공유
  • 페이스북 공유
  • 카카오스토리 공유