Как отправить данные JSON из фронтенда JavaScript на FastAPI?
Вопрос проверяет знание взаимодействия между фронтендом и FastAPI через POST-запросы с передачей данных JSON.
Короткий ответ
Данные JSON можно отправить из JavaScript с помощью метода fetch или axios. FastAPI автоматически парсит тело запроса JSON и передает данные в обработчик маршрута.
Длинный ответ
Для отправки JSON-данных с фронтенда на FastAPI используется метод fetch. FastAPI поддерживает автоматическое преобразование JSON в Python-объекты при указании аннотаций типов для параметров функции маршрута.
Пример на стороне фронтенда (JavaScript):
const data = { name: "John", age: 30 };
fetch("http://localhost:8000/user/", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
})
.then((response) => response.json())
.then((result) => console.log(result));
Пример маршрута FastAPI:
from fastapi import FastAPI
from pydantic import BaseModel
app = FastAPI()
class User(BaseModel):
name: str
age: int
@app.post("/user/")
def create_user(user: User):
return {"message": f"User {user.name} is {user.age} years old"}Когда фронтенд отправляет данные, FastAPI автоматически преобразует JSON в объект User и проводит валидацию.
Когда использовать:
- Для клиент-серверных приложений, где фронтенд отправляет структурированные данные на сервер.