与 Lambda 函数 (AWS) 集成的 DELETE 方法

Question

我首先要说我知道这可能是你将看到的最糟糕的 JavaScript 实现，但我必须将它用于学术目的。

我需要创建一个静态网站并为我的应用程序部署一个 API 网关，其中包含与 Lambda 函数集成的 GET、POST 和 DELETE 方法。

我的 GET 和 POST 功能运行良好，但问题在于 DELETE。

    <script>
        var url = 'The API endpoint';
        var submitBtn = document.getElementById('submitBtn');
        
        submitBtn.addEventListener('click', getDetails);
        function getDetails(){
            var mail = document.getElementById('mail').value;
            var firstName = document.getElementById('firstName').value;
            if(mail == '' || firstName == ''){
                alert("Please submit valid data!");
                return;
            }
            var params = '{"Item": {"email": "' + mail + '", "firstname": "' + firstName + '"}}';
            httpDeleteAsync(url, params, processResponse);
        }
        
        function httpDeleteAsync(url, params, callback){
            var xmlHttp = new XMLHttpRequest();
            xmlHttp.onreadystatechange = function(){
                if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
                    callback(xmlHttp.responseText);
                }
            }
            console.log(params);
            console.log(JSON.parse(params));
            xmlHttp.open("DELETE", url);            
            xmlHttp.setRequestHeader('Content-type', 'application/json');
            xmlHttp.send(params);
        }
        
        function processResponse(response){
            document.getElementById('response').innerHTML = response;
        }
    </script>

控制台没有显示任何错误，但是当我尝试删除时，我的页面上得到了一个空响应。 提前感谢您的帮助。

更新 #1 我开始认为问题出在 Lambda 函数上，但不确定我是否正确。

var AWS = require('aws-sdk');
var docClient = new AWS.DynamoDB.DocumentClient();

exports.handler = (event, context, callback) => {
    // TODO implement
    //console.log(event['body-json']);
    var tableName = 'Customers';
    var params = {
        TableName: tableName,
        Item : event['body-json'].Item
    }
    
    
    // docClient.put(params).promise().then(res => res).catch(err => err);
    
    docClient.delete(params, function(err, data) {
        if (err) {
            console.error("Unable to delete item. Error JSON:", JSON.stringify(err, null, 2));
        } else {
            console.log("DeleteItem succeeded:", JSON.stringify(data, null, 2));
        }
    });
};

Answer 1

我将 DELETE 视为 POST 的对立面，因此它们的过程在代码中相似，但我错了。 DELETE 与 GET 有更多的共同点。因此，通过以这种心态思考，我能够解决问题。下面是调整后的代码。

JAVASCRIPT：

    <script>
        var url = 'YOUR API'
        var submitBtn = document.getElementById('submitBtn');
        
        submitBtn.addEventListener('click', getDetails);
        function getDetails(){
            var mail = document.getElementById('mail').value;
            if(mail == ''){
                alert("Please submit a valid email!");
                return;
            }
            var params = 'email=' + mail;
            httpDelAsync(url, params, processResponse);
        }
        
        function httpDelAsync(url, params, callback){
            var xmlHttp = new XMLHttpRequest();
            xmlHttp.onreadystatechange = function(){
                if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
                    callback(JSON.parse(xmlHttp.responseText));
                }
            }
            console.log(params);
            xmlHttp.open("DELETE", url + "/?" + params);
            xmlHttp.send(null);
        }
        
        function isEmpty(obj) {
            for(var key in obj) {
                if(obj.hasOwnProperty(key))
                    return false;
            }
            return true;
        }
        
        function processResponse(response){
            //console.log(response);
            if(!isEmpty(response)){
                document.getElementById('firstNameLabel').innerHTML = response.Item.firstname;
                document.getElementById('mailLabel').innerHTML = response.Item.email;
                document.getElementById('error').innerHTML = "";
            }
            else{
                document.getElementById('firstNameLabel').innerHTML = '';
                document.getElementById('mailLabel').innerHTML = '';
                document.getElementById('error').innerHTML = "DELETED";
            }
        }
    </script>

Lambda 函数：

const AWS = require('aws-sdk');
var docClient = new AWS.DynamoDB.DocumentClient();

var tableName = "Customers" // Put your Table Name Here

exports.handler = async (event) => {
    console.log(event.email)
    
    var params = {
        TableName: tableName,
        Key: {
            email: event.email
        }
    };
    return docClient.delete(params).promise().then(res => res).catch(err => err);
    
};

DELETE 的响应有点小问题，但它工作正常，所以我保持原样。