Ranjith Ramachandra
Ranjith Ramachandra

Reputation: 10764

How to solve Cross-Origin Read Blocking (CORB) issue with an AWS lambda gateway?

I was trying to make my react app running on my localhost to talk to the AWS. I have enabled CORS and the OPTIONS on the API.

Chrome gives this error now

Cross-Origin Read Blocking (CORB) blocked cross-origin response https://xxxxxx.execute-api.us-east-2.amazonaws.com/default/xxxxxx with MIME type application/json. See https://www.chromestatus.com/feature/5629709824032768 for more details.

I inspected the network tab and the options call is going through and the OPTIONS is sending this in the response header

access-control-allow-headers: Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token
access-control-allow-methods: DELETE,GET,HEAD,OPTIONS,PATCH,POST,PUT
access-control-allow-origin: *

How can I fix this CORB issue and get my first lambda function done?

Upvotes: 3

Views: 9200

Answers (3)

Sun Lee
Sun Lee

Reputation: 939

I fixed this for image files by updating the Content-Type metadata under Properties in S3 - image/jpeg for JPEG files and image/png for PNG files.

My application uploads image files via multer-s3 and it seems it applies Content-Type: 'application/x-www-form-urlencoded'. It has a contentType option with content-type auto-detect feature - this should prevent improper headers and fix the CORB issue.

It seems the latest Chrome 76 version update includes listening to remote file URL headers, specifically Content-Type. CORB was not an issue for other browsers such as Firefox, Safari, and in-app browsers e.g. Instagram.

Upvotes: 1

Ranjith Ramachandra
Ranjith Ramachandra

Reputation: 10764

I had to figure it out. I needed to do these two things to get it working

1. Enable CORS on the Amazon API gateway for your API

This will create an OPTIONS http method handler and you can allow posts from your website by setting the right value for access-control-allow-origin header.

2. Make sure your POST method handling is sending the right parameters when sending the response

import json
from botocore.vendored import requests

API_URL = "https://aladdin.mammoth.io/api/v1/user-registrations"

def lambda_handler(event, context):
    if event['httpMethod'] == 'POST':
        data = json.loads(event['body'])
        # YOUR CODE HERE
        return {
            'statusCode': 200,
            'body': json.dumps({}),
            'headers': {
              'access-control-allow-headers': 'Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token',
              'access-control-allow-methods': 'DELETE,GET,HEAD,OPTIONS,PATCH,POST,PUT',
              'access-control-allow-origin': '*'
            }
        }
    return {
        'statusCode': 200,
        'body': json.dumps({})
    } 

Upvotes: 2

Sébastien Stormacq
Sébastien Stormacq

Reputation: 14905

CORB is a Chromium specific protection and is not directly related to your CORS setup on the AWS side.

Does your server return the headers required by CORB ? X-Content-Type-Options: nosniff and a correct Content-Type ?

You can learn more about CORB on the Chromium web page at https://www.chromium.org/Home/chromium-security/corb-for-developers

Upvotes: 0

Related Questions