在没有 Swagger UI 的情况下将 JSON 数据发布到 FastAPI
使用 FastAPI 时，了解如何在不使用 Swagger UI 的情况下将 JSON 数据发布到其后端非常有用依赖 Swagger UI。这种方法允许通过指定的 URL 直接发布数据并在浏览器中检索结果。
使用 Javascript 接口
要实现这一点，您可以实现Javascript 接口，例如 Fetch API，可以以 JSON 格式提交数据。考虑以下代码示例：
<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>templates/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>通过执行以下步骤，您可以有效地将 JSON 数据发布到 FastAPI 后端，而无需 Swagger UI。这种方法允许更大的灵活性，并通过指定的 URL 与后端直接交互。
以上是如何在没有 Swagger UI 的情况下将 JSON 数据发布到 FastAPI？的详细内容。更多信息请关注PHP中文网其他相关文章！
