JavaScript Fetch API blocked by CORS policy due to gzip?

I am running into a CORS error and can not seem to find out why. After testing I think it has something to do with either CORS, headers, app.api.binary_types.append("application/json"), or a combination. Can someone help? I have searched the web for a couple of hours, but can not seem to find the answer.

My Chalice app code:

from chalice import Chalice, Response
app = Chalice(app_name="myChaliceApp")
app.api.binary_types.append("application/json")
app.debug = True


@app.route("/some_test3", methods=["POST"], cors=True)
def some_test3():
    request = app.current_request
    data = request.json_body
    blob = json.dumps(data).encode("utf-8")
    payload = gzip.compress(blob)
    custom_headers = {"Content-Type": "application/json", "Content-Encoding": "gzip"}

    return Response(body=payload, status_code=200, headers=custom_headers)

My JavaScript code:

    const url = "https://xxxx.execute-api.eu-central-1.amazonaws.com/api/some_test3"

    const data = {
      Test: 3
    };

    fetch(url, {
        method: 'POST',
        body: JSON.stringify(data),
        headers: {
          'Content-Type': 'application/json',
          'Accept-Encoding': 'gzip'
        }
      })
      .then((response) => response.json())
      .then((data) => {
        console.log('Success:', data);
      })
      .catch((error) => {
        console.error('Error:', error);
      });

[jamesls]

Thanks for looking into this, I’ll take a look at the PR shortly.

[Misza13]

@MartijnHarmenzon I think I got to understand the issue, lead by a fix mentioned in https://forums.aws.amazon.com/message.jspa?messageID=785296#785356 - created a simple PR that fixes the OPTIONS integrations created by Chalice. I have already managed to get my API to work the way I intended based on my fork.