Что такое CORS

CORS (Cross-Origin Resource Sharing) — это механизм, который позволяет веб-страницам запрашивать ресурсы с другого домена, порта или протокола.

По умолчанию браузеры запрещают такие запросы из соображений безопасности. Это называется политикой одного источника (Same-Origin Policy).


Как работает CORS

Браузер отправляет предварительный запрос (preflight) с методом OPTIONS, чтобы узнать, разрешён ли основной запрос. Сервер должен ответить с заголовками:

  • Access-Control-Allow-Origin — разрешённые источники
  • Access-Control-Allow-Methods — разрешённые HTTP-методы
  • Access-Control-Allow-Headers — разрешённые заголовки
  • Access-Control-Allow-Credentials — разрешены ли куки

FastAPI предоставляет готовое решение через CORSMiddleware.


Создание утилиты cors.py

Создадим файл app/utils/cors.py, который будет содержать настройку CORS для нашего приложения.

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

def setup_cors(app: FastAPI) -> None:
    """Настройка CORS для приложения"""
    
    app.add_middleware(
        CORSMiddleware,
        allow_origins=["*"],
        allow_credentials=True,
        allow_methods=["*"],
        allow_headers=["*"],
    )

Разбор кода cors.py

  • allow_origins=["*"] — разрешаем запросы с любых источников (для разработки)
  • allow_credentials=True — разрешает передачу куки и заголовков авторизации
  • allow_methods=["*"] — разрешает все HTTP-методы (GET, POST, PUT, DELETE и т.д.)
  • allow_headers=["*"] — разрешает все заголовки

Подключение к main.py

Теперь обновим app/main.py, чтобы подключить CORS:

                from fastapi import FastAPI
from .utils.lifespan import get_lifespan
from .utils.cors import setup_cors
from .config import settings

# Получаем lifespan
lifespan = get_lifespan()

app = FastAPI(
    title=settings.APP_NAME,
    description=settings.APP_DESCRIPTION,
    version=settings.APP_VERSION,
    lifespan=lifespan
)

# Настройка CORS (должна быть до всех роутов)
setup_cors(app)

@app.get("/")
async def home():
    return {"message": f"Добро пожаловать на {settings.APP_NAME}!"}

@app.get("/about")
async def about():
    return {"message": "Это страница 'О проекте'."}

@app.get("/settings")
async def show_settings():
    """Эндпоинт для проверки настроек (только для разработки)"""
    return {
        "app_name": settings.APP_NAME,
        "app_description": settings.APP_DESCRIPTION,
        "app_version": settings.APP_VERSION,
        "app_port": settings.APP_PORT,
        "app_host": settings.APP_HOST,
        "app_debug": settings.APP_DEBUG,
    }

Настройка для продакшена

Для продакшена список allow_origins должен содержать только ваши реальные домены. В app/utils/cors.py можно сделать так:

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

def setup_cors(app: FastAPI) -> None:
    """Настройка CORS для приложения"""
    
    # Для продакшена укажите свои домены
    if settings.APP_DEBUG:
        origins = ["*"]
    else:
        origins = [
            "https://pytexpert.ru",
            "https://www.pytexpert.ru",
        ]
    
    app.add_middleware(
        CORSMiddleware,
        allow_origins=origins,
        allow_credentials=True,
        allow_methods=["*"],
        allow_headers=["*"],
    )

Проверка работы

Запустите сервер и проверьте заголовки CORS:

uvicorn app.main:app --reload

Откройте консоль разработчика в браузере (F12) и выполните JavaScript-запрос с другого источника:

                fetch('http://127.0.0.1:8000/')
    .then(r => r.json())
    .then(d => console.log(d));

Если CORS настроен правильно — вы увидите ответ от сервера.

Проверьте заголовки ответа:

  • Access-Control-Allow-Origin: *
  • Access-Control-Allow-Credentials: true
  • Access-Control-Allow-Methods: *

Итог

Сегодня мы сделали:

  • ✅ Разобрались, что такое CORS и зачем он нужен
  • ✅ Создали app/utils/cors.py с настройкой CORS
  • ✅ Подключили CORS в app/main.py через middleware
  • ✅ Рассмотрели настройку для продакшена
  • ✅ Проверили работу через браузер

После проверки закоммитьте и запушьте изменения в GitHub:

git add .
git commit -m "Добавлен CORS middleware"
git push

Следующая статья: Маршруты


Ищете хостинг для размещения вашего проекта в сети Интернет?
Посмотрите здесь →

Реклама. ООО «Бегет» ИНН 7801451618 erid: 2VtzqxQSRkE