Method PUT is not allowed by Access-Control-Allow-Methods in preflight response, from AWS API Gateway

Question

I've got API Gateway setup to point to a lambda function, setup as a aws_proxy. I can GET, POST, DELETE just fine, but I'm trying to add a PUT and I getting Method PUT is not allowed by Access-Control-Allow-Methods in preflight response.

XMLHttpRequest cannot load https://api.small.pictures/picture/07e78691-20f9-4a20-8be5-458eaeb73a63. Method PUT is not allowed by Access-Control-Allow-Methods in preflight response.

I think I have my CORS setup properly. Here is the swagger user for the route.

  '/picture/{picId}':
    options:
      summary: CORS support
      description: |
        Enable CORS by returning correct headers
      consumes:
        - application/json
      produces:
        - application/json
      tags:
        - CORS
      x-amazon-apigateway-integration:
        type: mock
        requestTemplates:
          application/json: |
            {
              "statusCode" : 200
            }
        responses:
          "default":
            statusCode: "200"
            responseParameters:
              method.response.header.Access-Control-Allow-Headers : "'Content-Type,X-Amz-Date,Authorization,X-Api-Key'"
              method.response.header.Access-Control-Allow-Methods : "'*'"
              method.response.header.Access-Control-Allow-Origin : "'*'"
            responseTemplates:
              application/json: |
                {}
      parameters:
        - name: picId
          in: path
          required: true
          type: string
      responses:
        200:
          description: Default response for CORS method
          headers:
            Access-Control-Allow-Headers:
              type: "string"
            Access-Control-Allow-Methods:
              type: "string"
            Access-Control-Allow-Origin:
              type: "string"
    x-amazon-apigateway-any-method:
      produces:
      - "application/json"
      responses:
        200:
          description: "200 response"
          schema:
            $ref: "#/definitions/Empty"
      x-swagger-router-controller: main
      x-lambda-function: ../../swiki/build/picture
      x-amazon-apigateway-integration:
        type: aws_proxy
        httpMethod: POST
        uri: arn:aws:apigateway:us-west-2:lambda:path/2015-03-31/functions/@@LambdaFunctionPicture/invocations
        credentials: @@APIGatewayExecutionRole

As you can see I have Access-Control-Allow-Headers, Access-Control-Allow-Methods and Access-Control-Allow-Origin configured.

Why can't I make a PUT request?

Answer 1

Currently, setting '*' on the allowed methods seems not to be supported by most browsers. So you must set the methods explicitly by hand to achieve browser support.

Access-Control-Allow-Methods: POST, PUT, GET, OPTIONS

Access-Control-Allow-Methods

Compatibility notes

The wildcard value (*) that is mentioned in the latest specification, is not yet implemented in browsers:

Chromium: Issue 615313

Firefox: bug 1309358

Servo: Issue 13283