Having problems with CORS errors on an AWS Lambda proxy resource enabled function. Followed the docs, which states that CORS headers now need to be set in the function itself, not in the API Gateway console, set them in the code but when I inspect the response in Chrome dev tools, the headers are not getting properly applied.
public async lambda(event: any, context: Context): Promise<any> {
const { httpMethod, resource } = event;
const { data, ...eventWithoutData } = event;
this.file = event
const imagePath = await this.uploadImageS3(this.file.data)
if (imagePath) {
return {
statusCode: 200,
headers: {
"Access-Control-Allow-Headers": "Content-Type",
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Methods": "OPTIONS,POST,GET"
},
url: imagePath,
}
} else {
return {
statusCode: 500,
headers: {
"Access-Control-Allow-Headers": "Content-Type",
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Methods": "OPTIONS,POST,GET"
},
error: "Error uploading image",
}
}
}
Still Access to XMLHttpRequest at 'https://bcf4r8e22h.execute-api.us-west-1.amazonaws.com/dev/upload-image/upload-owners-identification' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Upon inspecting the response headers in the dev tools, it lists:
- content-type: application/json
- date: Wed, 21 Sep 2022 14:26:28 GMT
- via: 1.1 85a9508ec4957ee0bf43a046eef1dce2.cloudfront.net (CloudFront)
- x-amz-apigw-id: Y0HLIGQtyK4Feuw=
- x-amz-cf-id: fKayyJtZ-TdIxFht2ExKXsVqPqgpwxcTs5UPi9dK7e6OVZC9BR9lGw==
- x-amz-cf-pop: LAX3-C3
- x-amzn-errortype: InternalServerErrorException
- x-amzn-requestid: 89d648c0-75a5-406d-97a6-23119ebe9731
- x-cache: Error from cloudfront
Thus, none of them are getting set at all. I feel taking a glance at headers it could be something to do with cloudfront, but I have no idea how. Can anyone assist with this please? Thanks