jquery - habilitar - no access control allow origin header is present on the requested resource api gateway

AWS API Gateway No hay encabezado ''Access-Control-Allow-Origin'' presente

Question

Estoy atascado en un problema con la puerta de enlace API y he revisado todas las demás respuestas de SO en estos foros de AWS y he revisado sus documentos, pero todavía no me alegro.

Estoy tratando de configurar una API utilizando la puerta de enlace de la API de AWS que llama a una función Lambda que lee / escribe en una tabla en DynamoDB.

La función Lambda a DynamoDB está funcionando. He creado una API en AWS y he creado los métodos GET y OPTIONS para ella. Leí que AWS no hace cumplir las OPCIONES solo para GET / POST, pero recibí un error de verificación previa en mi llamada ajax cuando no había un método de OPCIONES, así que agregué uno.

Por ahora solo para avanzar, no estoy usando una clave API o Autorización. Puedo llamar exitosamente a mi método GET usando POSTMAN, que devuelve el contenido de la tabla de DynamoDB.

Pero cuando trato de usar una llamada ajax JQuery me sale

No ''Access-Control-Allow-Origin'' header is present on the requested resource. Origin ''null'' is therefore not allowed access.

Puedo ver el uso de las herramientas de desarrollo de Chrome en la pestaña de red, el método OPTIONS que devuelve el estado 200 y el GET devuelve el estado 200 pero con el error anterior.

He intentado habilitar CORS en los métodos OPTIONS y GET, he vuelto a implementar la API después de cada cambio, he intentado lo siguiente ( http://enable-cors.org/server_awsapigateway.html ) pero siempre aparece el mismo error en el consola.

Estoy ejecutando la llamada ajax desde un archivo en mi escritorio, por lo que el origen es nulo ya que la página se implementará en S3 como una aplicación de página web única en JS.

Cuando habilité CORS en mi GET y OPCIONES puedo ver que Access-Control-Allow-Headers es ''Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token'' y acceso -Control-Permitir-Origen * es ''*''

Mi llamada Ajax se ve a continuación. También intenté copiar los encabezados exactos que utiliza POSTMAN, que tienen el conjunto de encabezados de Autorización (que por ahora he desactivado en AWS) pero siempre aparece el mismo error arriba

var awsHeaders = {};
awsHeaders[''X-Amz-Date''] = ''20161127T171734'';

$(''#add, #cloud'').click(function() {

    $.ajax({

        type: ''GET'',
        headers: awsHeaders,
        dataType : "json",
        url: ''...'',
        success: function (res) {

            console.log(''response in GET:'');
            console.log(res);

        },
        error: function(data) {
            console.log(''in error'');
            console.log(data);
        }

    });

});

¿Alguien puede arrojar luz sobre lo que podría faltar?

Muchas gracias

Actualización Vea la respuesta a continuación sobre cómo resolví esto según los comentarios de DigitalKapteain, estableciendo el encabezado ''Access-Control-Allow-Origin'': ''*'' en la respuesta de mi función Lambda. Busqué esto en los documentos de AWS pero no pude encontrarlo. Este enlace describe la diferencia entre Lambda y Lambda Proxy y explica qué hacer cuando se usa CORS https://serverless.com/framework/docs/providers/aws/events/apigateway/

Answer 1

La respuesta de Digitalkapitaen es correcta; Aquí está el código para salvar a alguien la molestia de buscar cómo configurar un encabezado de respuesta HTTP en Lambda :

exports.handler = function(event, context, callback) {
    callback(null, {
        "statusCode": 200,
        "headers": { 
            "Access-Control-Allow-Origin": "*" 
        }
    });
};

Answer 2

La respuesta para la solicitud GET a la función Lambda también debe contener el encabezado Access-Control-Allow-Origin .

Answer 3

Para alguien que busca integrar la solución de @ Digitalkapitaen en Flask, aquí está el siguiente código:

app = Flask(__name__)
cors = CORS(app, resources={r"/*": {"origins": "*"}})

@app.route("/")
def helloWorld():
  return "Hello, cross-origin-world!"

Instale el módulo flask-cors haciendo un:

pip install -U flask-cors

Answer 4

Si esto todavía no funciona para ti, asegúrate de JSON.stringify () tu objeto json si estás usando $ .ajax. De lo contrario, se le devolverá un error que afirma ser un error relacionado con CORS. Pero si envía el mismo objeto json utilizando Postman, la solicitud se realizará correctamente. Pruébalo...