I’m currently experiencing an issue with my React application hosted on Netlify and my FastAPI application hosted on HuggingFace Spaces. The issue arises when I make a request from my React app to my FastAPI application.
Here’s the error message I receive:
Access to XMLHttpRequest at 'https://neonmcgameromgomg-fastapiapplication.hf.space/?prompt=Tiger' from origin 'mywebsite.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
In my FastAPI application, I have already set up CORS middleware to allow all origins, methods, and headers. Here’s the relevant code snippet:
app.add_middleware( CORSMiddleware, allow_credentials=True, allow_origins=["*"], allow_methods=["*"], allow_headers=["*"] )
Despite this, I’m still encountering the CORS issue. My HuggingFace Space is public, and I’m not sure why the ‘Access-Control-Allow-Origin’ header isn’t being recognized.
Any help or guidance on this issue would be greatly appreciated. Thank you in advance!