Fetch request from react page leads to fast api server causes network error

Hey clouflare community,
I am hosting a react site on page. On button click I am making a request with axios(fetch might also be fine). It looks something like this:
const headers = {“Access-Control-Allow-Origin”: “"}
axios.get(
“example..elb.amazonaws”,
headers
).
then((response)=> {
console.log(response)
}).catch((error)=>{
console.log(error)
})
the server receiving the request in a fast api server where the code
origins = [
“localhost”,
“localhost:3000”,
“my.pages.dev”
"
”,
]

app = FastAPI()

app.add_middleware(
CORSMiddleware,
allow_origins=origins,
allow_methods=[““],
allow_headers=[”
”],
)

app.get(“/”)
def home_func():
return {“Hello”: “world”}
I case above code isn’t clear bellow is the explanation.
The problem is that I am trying to make a get request to server from react website, but I am getting network error. I have opened up the the cors temporarily to allow all origins but that doesn’t seem to help.
If any body could help I would be eternally great full.
Thank you