Frontend and Backend headers/CORS incompatible [duplicate]

Here are my ReactJs headers

const headers =  { "Content-Type": "application/json","Access-Control-Allow-Origin": "*", // Allow requests from any origin"Access-Control-Allow-Methods": "GET, POST, PUT, DELETE", // Allow the specified methods"Access-Control-Allow-Headers": "Origin, X-Requested-With, Content-Type, Accept", // Allow the specified headers  };

And my Python FastAPI headers

app = _fastapi.FastAPI()origins = ["http://localhost","http://localhost:3000",]# Apply CORS middlewareapp.add_middleware(    CORSMiddleware,    allow_origins=origins,    allow_credentials=True,    allow_methods=["GET", "POST", "PUT", "DELETE"],    allow_headers=["*"],)

But I'm getting this error when React pings FastAPI

Access to fetch at 'http://127.0.0.1:8000/api/users' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Is anything wrong with either side's headers?

Edit: I could add the specific API methods but don't want to copy/paste a thousand lines of code; if needed, I can link an example request and API method.