[Python] My FastAPI service is giving CORS errors from my website running on localhost when I...

I have an API built in FastAPI hosted with uvicorn. I also have a website build in next.js. My typical workflow is to run the API locally on the command line and it will be hosted on localhost:8000, then run the website on the command line and point it at the API at the above address. The website runs at localhost:3000.

If I run the API on the command line, this all works fine, no CORS issues. My API is currently set up super-permissive for now:

cors_app = CORSMiddleware(app=app, allow_origins=["*"], allow_methods=["*"], allow_headers=["*"])

uvicorn.run(
cors_app,
host="0.0.0.0",
port=8000,
log_config=LOGGING_CONFIG,
)


However, if I want to debug the API, I can run it with this launch.json entry:

{
"name": "Python Debugger: FastAPI",
"type": "debugpy",
"request": "launch",
"module": "uvicorn",
"args": ["services.api.app.main:app", "--reload"],
}


When I do, everything seems fine, but all front-end fetch commands suddenly throw 405 CORS Errors:

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.


Why is this only happening when I run out of VSCode with the debugpy debugger? It runs the exact same server setup code and has the same CORS configured so it makes now sense that running it in the debugger should surface new CORS issues....

How can I fix it?

Continue reading...