Stephen Sanwo
Stephen Sanwo


Stephen Sanwo

How to resolve Cross-Origin Resource Sharing (CORS) issues in FastAPI

Photo by DeepMind on Unsplash

How to resolve Cross-Origin Resource Sharing (CORS) issues in FastAPI

Code Snippet

Stephen Sanwo's photo
Stephen Sanwo
·Jul 1, 2022·

1 min read

While developing in local environment, you may need to connect your frontend to a local API endpoint. The connection is likely to fail with an error message like this: [Error] Failed to load resource: Origin localhost:3000 is not allowed by Access-Control-Allow-Origin.

This happens because even though the frontend and backend are running on localhost, they are considered to be in different origins. i.e. front end is running on localhost:3000, while backend is running on localhost:1234 The browser will restrict this connection for security reasons better explain here

To solve this, you will need to specify origins to be allowed by FastAPI as shown below:

from fastapi import FastAPI
from fastapi.middleware.cors import CORSMiddleware
import uvicorn

api = FastAPI()

origins = [


async def root():
    return 'Success'

if __name__ == "__main__":"api:api", host="", port=1234, reload=True)
Share this