Javascript:处理服务器尚未分配id的客户端初始化对象

javascript: handling client side initiated objects that the server hasn't assigned an id to

本文关键字：id 客户端 初始化 对象 分配 处理 服务器 Javascript      更新时间：2023-09-26

我正在开发一个javascript应用程序，我试图使服务器端同步尽可能自动和不引人注目

我面临的问题是，当创建一个对象客户端我可以立即发送创建ajax请求，而我在等待它返回添加对象到ui在必要的地方

然而，因为对象在服务器响应之前没有id，所以我不能对其执行任何更新或销毁操作，直到服务器响应并更新其id

处理这个问题的最好方法是什么?

一些有帮助的代码:

create_object = function() {
  return {
    save: function() {
      if (this.isNew()) {
        this.create();
      } else {
        this.update();
      }
    },  
    isNew: function() {
      return (this.id === undefined || this.id === null);
    },
    update: function () {
      $.ajax({
        url: '/update_object/'+this.id+'.json',
        type: 'post',
        dataType: 'json',
        data: this
      });
    },
    create: function () {
      var object = this;
      $.ajax({
        url: '/create_object',
        type: 'post',
        dataType: 'json',
        data: this,
        success: function(data) {
          object.id = data.id;
        }
      });
    },
    destory: function () {
      $.ajax({
        url: '/destroy_object/'+this.id+'.json',
        type: 'get',
        dataType: 'json'
      });
    }
  };
};
var object = create_object();
object.message = "Foo!";
object.save();
// this will create a new object until object.save has responded
object.message = "Bar!";
object.save();
// this wont work until object.save has responded
object.destroy();

这不是一个真正的问题。AJAX本质上是异步的(异步 Javascript和XML)。您必须等到从服务器获得响应后才能更新UI。

如果你必须立即更新UI，你可以创建一个带有占位符ID的元素，然后在服务器响应后用实际的ID更新。

这是对你的评论的回应。web应用程序不是纯粹的客户端应用程序。它们适合客户机-服务器范式。您可以尝试使用同步post，但这样做的副作用是在服务器响应之前占用浏览器(这是由于Javascript是单线程的事实)。

也就是说，服务器的响应应该非常快，除非你的网络很慢，或者你发送到服务器的任何帖子都会导致一些计算密集型的操作。

走占位符路线会(正如你已经意识到的)导致你必须处理各种各样的新问题。你必须确保它们是唯一的。现在，如果他们在服务器使用id响应之前对客户端元素执行某些操作怎么办?服务器将不知道占位符id的含义。有一些方法可以解决这个问题(排队请求是一种方法)，但这会使您的代码变得更加复杂。我不认为仅仅为了让UI更新更快而做出这样的权衡是值得的。

一个选项是提供一些视觉反馈给用户，应用程序正在"工作"(即，当你正在等待服务器的响应)。例如，旋转器

至于堆叠AJAX请求，这是使用jQuery消息队列插件可以采用的一种方法。

相关文章：