Heim > Artikel > Backend-Entwicklung > Warum zeigt meine React-App keine JSON-Daten von meinem FastAPI-Backend an?
Eine React-Anwendung zeigt keine JSON-Daten an, die von einem FastAPI-Backend bei localhost abgerufen wurden: 8000/todo. Die Daten werden empfangen, aber nicht in der React-Benutzeroberfläche gerendert.
Dieses Problem wird durch eine fehlende CORS-Konfiguration (Cross-Origin Resource Sharing) im FastAPI-Backend verursacht. Standardmäßig beschränken Browser ursprungsübergreifende Anfragen, um Sicherheitsrisiken vorzubeugen.
Um dieses Problem zu beheben, muss CORS in der FastAPI-Anwendung aktiviert sein. Dies kann mit der CORSMiddleware erreicht werden.
Der folgende Code zeigt, wie CORS in einer FastAPI-Anwendung aktiviert wird:
from fastapi import FastAPI from fastapi.middleware.cors import CORSMiddleware app = FastAPI() origins = ["http://localhost:3000", "http://127.0.0.1:3000"] app.add_middleware( CORSMiddleware, allow_origins=origins, allow_credentials=True, allow_methods=["*"], allow_headers=["*"], )
Die CORSMiddleware ermöglicht ursprungsübergreifende Anfragen von den angegebenen Ursprüngen (http://localhost:3000 und http://127.0.0.1:3000 in diesem Beispiel). Es ermöglicht auch die Aufnahme von Cookies in die Anfrage (allow_credentials=True) und schränkt HTTP-Methoden oder Header nicht ein (allow_methods=["*"],allow_headers=["*"]).
Das obige ist der detaillierte Inhalt vonWarum zeigt meine React-App keine JSON-Daten von meinem FastAPI-Backend an?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!