Thursday, 12 August 2021

Incorrect Access-Control-Allow-Origin being added automatically to POST & DELETE endpoints

I have an app built with FastAPI hosted on API Gateway using serverless.

The API: https://xxxxx.execute-api.xx-xxxxxx-x.amazonaws.com/dev/{proxy+}

Since most of my endpoints are proxy endpoints, I am adding to the response headers as follows:

response.headers['Access-Control-Allow-Origin'] = "*"
response.headers['Access-Control-Allow-Credentials'] = "true"
response.headers['Access-Control-Allow-Headers'] = "Origin, X-Requested-With, Content-Type, Accept, x-access-token"

I have 3 different types of endpoints: GET, POST & DELETE.

The Access-Control-Allow-Origin is correctly assigned in the GET request as follows:

access-control-allow-credentials: true 
access-control-allow-headers: Origin,X-Requested-With,Content-Type,Accept,x-access-token 
access-control-allow-origin: * 
content-length: 150 
content-type: application/json 
date: Mon,09 Aug 2021 07:06:45 GMT 
x-amz-apigw-id: DyYQPFBHFiAFrQA= 
x-amzn-remapped-content-length: 150 
x-amzn-requestid: 24fac4dc-189c-468e-9ca7-1bfd6ccfbabe 
x-amzn-trace-id: Root=1-6110d401-2816fc3630142ecd24604935;Sampled=0 

it is not correctly being assigned in the POST & DELETE methods. When I host it on API Gateway, the above-mentioned API is being automatically added to the Access-Control-Allow-Origin in place of "*", which I am specifically mentioning when I declare the response headers as shown above.

The response headers for the POST & DELETE methods:

access-control-allow-credentials: true 
access-control-allow-headers: Origin,X-Requested-With,Content-Type,Accept,x-access-token  access-control-allow-methods: GET,POST,DELETE 
access-control-allow-origin: https://xxxxx.execute-api.xx-xxxxxx-x.amazonaws.com/dev/{proxy+} 
content-length: 392 
content-type: application/json 
date: Mon,09 Aug 2021 07:01:37 GMT 
x-amz-apigw-id: DyXgoHozliAFnJA= 
x-amzn-remapped-content-length: 392 
x-amzn-requestid: a03fad7e-1caf-4a8c-b188-932923085755 
x-amzn-trace-id: Root=1-6110d2d0-39fe47e07531d93a585117d7;Sampled=0 

Because of this, the following error is shown in the frontend:

Failed to load resource: Origin http://localhost:3000 is not allowed by Access-Control-Allow-Origin.

Is there something that I am missing that should be added for these methods?

Thanks

Edit 1:

I'm setting the response headers to all the endpoints as follows:

from fastapi import APIRouter

router = APIRouter(
    prefix="/dimensioning",
    tags=["dimensioning"],
)

@router.post('/')
def post_body(response: Response):
    response.headers['Access-Control-Allow-Origin'] = "*"
    response.headers['Access-Control-Allow-Credentials'] = "true"
    response.headers['Access-Control-Allow-Headers'] = "Origin, X-Requested-With, Content-Type, Accept, x-access-token"
    response.headers['Content-Type'] = "application/json"
    # do the other stuff

@router.get('/')
def get_body(response: Response):
    response.headers['Access-Control-Allow-Origin'] = "*"
    response.headers['Access-Control-Allow-Credentials'] = "true"
    response.headers['Access-Control-Allow-Headers'] = "Origin, X-Requested-With, Content-Type, Accept, x-access-token"
    response.headers['Content-Type'] = "application/json"
    # do the other stuff

@router.delete('/')
def delete_body(response: Response):
    response.headers['Access-Control-Allow-Origin'] = "*"
    response.headers['Access-Control-Allow-Credentials'] = "true"
    response.headers['Access-Control-Allow-Headers'] = "Origin, X-Requested-With, Content-Type, Accept, x-access-token"
    response.headers['Content-Type'] = "application/json"
    # do the other stuff

I am also following the structure here. So in my main.py, as done here, I have

app.add_middleware(
    CORSMiddleware,
    allow_origins=["*"],
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)

Edit 2

When I inspect the response, I see that there are 2 APIs:

enter image description here

This is for the POST (which doesn't have the response headers I mention) enter image description here

This is for the OPTIONS method enter image description here



from Incorrect Access-Control-Allow-Origin being added automatically to POST & DELETE endpoints

No comments:

Post a Comment