Wie übermittle ich JSON-Daten ohne Swagger-Benutzeroberfläche an FastAPI?

Umgehen der Swagger-Benutzeroberfläche für die JSON-Dateneingabe in FastAPI

Beim Arbeiten mit FastAPI ist es möglich, JSON-Daten ohne die Vermittlung der Swagger-Benutzeroberfläche zu veröffentlichen. So erreichen Sie dies:

JavaScript-Schnittstelle für die JSON-Datenübermittlung

Verwenden Sie eine JavaScript-basierte Schnittstelle wie die Fetch-API, um Daten im JSON-Format zu senden. Hier ist ein Beispiel:

<code class="javascript">var data = {
    name: "foo",
    roll: 1
}

fetch('/', {
    method: 'POST',
    headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
    },
    body: JSON.stringify(data)
}).then(resp => {
    return resp.text();
}).then(data => {
    // Handle the response
});</code>

HTML-Formular und Jinja2-Vorlagen

Alternativ können Sie Jinja2-Vorlagen und ein HTML-Formular verwenden, um Ihre Daten zu übermitteln. So geht's:

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>

index.html

<code class="html"><form method="post">
    <input type="text" name="name" value="foo">
    <input type="number" name="roll" value="1">
    <input type="submit" value="Submit">
</form>

<div id="responseArea"></div>

<script>
    document.querySelector('form').addEventListener('submit', (event) => {
        event.preventDefault();
        var data = new FormData(event.target);

        fetch('/', {
            method: 'POST',
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json'
            },
            body: JSON.stringify(Object.fromEntries(data))
        }).then(resp => {
            return resp.text();
        }).then(data => {
            document.getElementById("responseArea").innerHTML = data;
        }).catch(error => {
            console.error(error);
        });
    });
</script></code>

Durch die Verwendung dieser Techniken können Sie JSON-Daten bequem in Ihrem FastAPI-Backend veröffentlichen, ohne sich darauf verlassen zu müssen auf der Swagger-Benutzeroberfläche.

Das obige ist der detaillierte Inhalt vonWie übermittle ich JSON-Daten ohne Swagger-Benutzeroberfläche an FastAPI?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!