Swagger UI 없이 FastAPI에 JSON 데이터 게시
FastAPI로 작업할 때 Swagger UI 없이 JSON 데이터를 백엔드에 게시하는 방법을 이해하면 유용합니다. Swagger UI에 의존합니다. 이 접근 방식을 사용하면 지정된 URL을 통해 데이터를 직접 게시하고 브라우저에서 결과를 검색할 수 있습니다.
Javascript 인터페이스 사용
이를 달성하려면 JSON 형식으로 데이터를 제출할 수 있는 Fetch API와 같은 Javascript 인터페이스입니다. 다음 코드 예를 살펴보세요.
<code class="javascript">body: JSON.stringify({name: "foo", roll: 1})</code>
이 코드 조각은 전송을 위해 Javascript 개체를 JSON으로 변환합니다.
프런트엔드 구현
FastAPI 백엔드에서는 다음 방법 중 하나를 활용할 수 있습니다.
구현 예
Python에서 다음 구현 예를 고려하세요.
app.py
<code class="python">from fastapi import FastAPI, Request from fastapi.templating import Jinja2Templates from pydantic import BaseModel app = FastAPI() templates = Jinja2Templates(directory="templates") class Item(BaseModel): name: str roll: int @app.post("/") async def create_item(item: Item): return item @app.get("/") async def index(request: Request): return templates.TemplateResponse("index.html", {"request": request})</code>
template/index.html
<code class="html"><!DOCTYPE html> <html> <body> <h1>Post JSON Data</h1> <form method="post" id="myForm"> name : <input type="text" name="name" value="foo"> roll : <input type="number" name="roll" value="1"> <input type="button" value="Submit" onclick="submitForm()"> </form> <div id="responseArea"></div> <script> function submitForm() { var formElement = document.getElementById('myForm'); var data = new FormData(formElement); fetch('/', { method: 'POST', headers: { 'Accept': 'application/json', 'Content-Type': 'application/json' }, body: JSON.stringify(Object.fromEntries(data)) }) .then(resp => resp.text()) // or, resp.json(), etc. .then(data => { document.getElementById("responseArea").innerHTML = data; }) .catch(error => { console.error(error); }); } </script> </body> </html></code>
이 단계를 따르면 Swagger UI 없이도 JSON 데이터를 FastAPI 백엔드에 효과적으로 게시할 수 있습니다. 이 접근 방식을 사용하면 지정된 URL을 통해 더 큰 유연성과 백엔드와의 직접적인 상호 작용이 가능합니다.
위 내용은 Swagger UI 없이 FastAPI에 JSON 데이터를 게시하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!