Question

我编写了一个小应用程序，它通过 ajax GET 从服务器获取数据并将这些数据加载到 html 表中。此外，用户可以通过填写表格或通过复选框删除数据来将数据添加到表格行中。然后表中的所有数据都通过 ajax PUT 发送到服务器。在发送之前，将再次有一个 get-request 以从服务器获取最新数据。到目前为止一切顺利。

现在我面临的问题是，当从多个客户端访问网站时，第二个 get-request 无法正常工作。发送时不会添加数据，它会被其他用户的条目/输入覆盖。

有人知道如何解决这个问题吗？提前致谢！

GET 请求

  function getMessage() {
    // Send HTTP Request
      $.ajax({
          type: 'GET',
          url: endpointUrlGet,
          contentType : 'application/json',
          success: function(data) {
              // Loading data from get request into table
                  var filter_data = '';
                  $.each(data, function(index, value) {
                      filter_data += '<tr>';
                      filter_data += '<td><input type="checkbox" /></td>';
                      filter_data += '<td>' + value.nummer+ '</td>';
                      filter_data += '<td>' + value.start+ '</td>';
                      filter_data += '<td>' + value.time+ '</td>';
                      filter_data += '<td>' + value.type+ '</td>';
                      filter_data += '<td>' + value.start_time+ '</td>';
                      filter_data += '<td>' + value.end_time+ '</td>';
                      filter_data += '</tr>';
                  });
                  $("#entries").append(filter_data );
          },
          error: function(d) {
              alert("Fehler beim Laden.")
          }
      })
  }

PUT 请求

function sendMessage(payload) {
      // Send HTTP Request
      $.ajax({
        type: 'PUT',
        url: endpointUrlPut,
        contentType : 'application/json',   
        data : payload,
        statusCode: {
            200: function() {
                location.reload();
                alert("Success.");
            },
            400: function() {
                alert( "Fehler." );
                console.log("Bad request.");
              },
            403: function() {
                alert( "Fehler." );
                console.log("Forbidden.");
                },
            404: function() {
                alert( "Fehler." );
                console.log("Page not found.");
              },
            500: function() {
                alert( "Fehler." );
                console.log("Internal Server error.");
              },
            502: function() {
                alert( "Fehler." );
                console.log("Bad Gateway.");
                },
            503: function() {
                alert( "Fehler." );
                console.log("Service Unavailable.");
                }
          },
          error: function(d) {
              alert("Fehler beim Senden.");
          }
     })       
  }

方法调用：

$('#submit_btn').click(function() {

        getMessage();
        sleep(100);


        $("#entries input[type='checkbox']:checked").closest("tr").remove();    
        var table= $('#entries tr:has(td)').map(function(i, v) {
            var $td =  $('td', this);
                return {
                         nummer: $td.eq(1).text(),
                         start: $td.eq(2).text(),
                         time: $td.eq(3).text(),
                         type: $td.eq(4).text(),
                         start_time: $td.eq(5).text(),
                         end_time: $td.eq(6).text()
                       }
        }).get();

        // Parses the tabledata into required JSON-format
        var data = JSON.stringify({
            "env" : "dev",
            "allData" : table
        })


        // Sending the filters via PUT
        sendMessage(data);

      });

Answer 1

<块引用>

我认为更多的是关于实现而不是你的 Ajax 请求。您需要同步对资源的访问。

我这个评论的意思是，是否允许多个客户端同时访问资源？如果允许，在什么基础上进行更新？我觉得不应该允许两个客户端同时访问同一个资源，否则会导致数据不一致，就像你的情况一样。您需要应用正确的同步技术来实现所需的输出。希望这很清楚！

通过 Ajax PUT 请求从多个客户端发送数据

1 个答案: