是否有可能发送我的对象与方法(函数)从服务器到客户端

Is it possible send my object with methods (function) from server to client?

本文关键字：函数 服务器 客户端 方法 有可能 我的 对象 是否      更新时间：2023-09-26

我有对象与方法(函数)在服务器上(node.js)。我想在浏览器中使用方法获取这个对象。

有可能吗?

我在GitHub上做了简单的例子

有server.js和index.html文件。运行——> node server.

++++++++ UPD(注释后)

我的对象在服务器上:

function ClassOrder(name, cost) {
  this.name = name;
  this.cost = cost;
  this.parts = [];
  this.summ = function() {
    var summ = 0;
    this.parts.forEach(function(part) {
      summ += part.summ();
    });
    return summ + this.cost;
  };
}
var myobject = new ClassOrder('my object', 10);
myobject.parts[0] = new ClassOrder('my first part', 20);
myobject.parts[1] = new ClassOrder('my second part', 30);
myobject.parts[1].parts[0] = new ClassOrder('my first in second part', 40);
console.log(myobject); // view myobject in console
console.log(myobject.summ());  // return 100 (10+20+30+40)

发送到客户端

res.end(JSON.stringify(myobject));

，并得到它的客户端javascript代码(在浏览器)

function getobject() {
  var xhr = new XMLHttpRequest();
  xhr.open('get', '/getobject', true);
  xhr.onreadystatechange = function() {
    if (xhr.readyState != 4) return; 
    var myobject = JSON.parse(this.responseText);
    console.log(myobject); // all data ok
    console.log(myobject.summ()); // no methods!! 
  };
  xhr.send(null);
}

这是一个简单的例子，在实际中我使用原型(或继承在util(node.js))。我在服务器上使用此方法并将其保存在DB中。所有工作都很好。但如果我不使用它的客户端我需要复制粘贴所有的方法，为什么?

我也不知道如何添加我的例子方法到我的对象在客户端没有反汇编。

问题是:如何在服务器和客户端上使用方法获得相同的对象而不进行双重编码。

有两种方法。

第一种方法是将我的方法(function)转换为文本并保存为object。然后我们可以使用Function构造函数来运行它。

function ClassOrder(name, cost) {
  this.name = name;
  this.cost = cost;
  this.parts = [];
  this.summfunc = ''
    var summ=0; '
    obj.parts.forEach(function(part) { '
      summ += part.summ(); '
    }); '
    return summ + obj.cost;';
}
ClassOrder.prototype.summ = function() {
  return (new Function('obj', this.summfunc))(this);
};

，可以在浏览器中使用

var myobject = JSON.parse(this.responseText);
myobject.constructor.prototype.summ = function() {
  return (new Function('obj', this.summfunc))(this);
};

链接提交到GItHub上的新分支

这种方式是不好的，因为我需要我所有的方法转换为文本。还有@Felix Kling，它使代码更难维护和遵循。

第二种方法是在服务器端和客户端使用一个包含类和方法的文件。在接收到数据后，将其"转换"到我的类。

my class in file order.js (part of file):

function Order(object) {
  object.parts = object.parts || [];
  var partsArr = [];
  object.parts.forEach(function (value, key) {
    partsArr[key] = new Order(value);
  });
  this.name = object.name || 'Default';
  this.cost = object.cost || 0;
  this.parts = partsArr;
}
Order.prototype.summ = function() {
  var summ = 0;
  this.parts.forEach(function(part) {
    summ += part.summ();
  });
  return summ + this.cost;
};

要求order.js并更改调用new Object的参数:

var Order = require('./order')
var myobject = new Order({name:'my object', cost: 10});
myobject.parts[0] = new Order({name:'my first part', cost: 20});
myobject.parts[1] = new Order({name:'my second part', cost: 30});
myobject.parts[1].parts[0] = new Order({name:'my first in second part', cost: 40});

，最后在客户端使用这个文件:

<script src='order.js'></script>
...
var xhrobj = JSON.parse(this.responseText);
var myobject = new Order(xhrobj);

链接提交到GItHub上的其他分支

我认为这种方法比第一种方法好。

我认为答案就在那里:调用从Ajax响应返回的JavaScript函数

但是似乎没有必要把答案放在脚本标签中，试试这个:

eval(this.responseText)
相关文章：