如何更新来自不同socket.io事件的消息?

时间:2019-09-24 01:50:12

标签: javascript jquery socket.io

我正在使用具有差异事件channelName1channelName2的api

//...this the realtime record
socket.on(channelName1, message => {
      console.log(channelName1, message1);
      //this return single item list in realtime`[{"price":100,"size":0.001}]`
 });

//realtime snapshot collection of records
socket.on(channelName2, message => {
   console.log(channelName2, message2);
   //this return the collection `[{"price":100,"size":0.01}, {"price":200,"size":0.02} ]`
   $('#live').text(message2)
});

如果我发现集合message2中存在price":100,我想更新message2的大小,因此更新后消息2将

[{"price":100,"size":0.001}, {"price":200,"size":0.002} ]

任何人都可以指导我如何从channelName1更新为ChannelName2数据吗?

4 个答案:

答案 0 :(得分:4)

您必须将单个项目存储在某个地方,当集合到达时,您需要:

  1. 使用map处理集合中的每个项目。
  2. 对于每个项目,请尝试find在已存储的单个项目中。
  3. 如果找到,请更改大小。

我还在集合中包含了一条找不到的记录,因此您可以看到那里发生的事情:它保持不变。

忽略我为模拟套接字所做的微小更改。希望你能看到我在做什么的大图片。

希望这对您有所帮助,并且编码愉快。

// Stores each single item that arrives.
let singleItems = [];

// ...this is the realtime record.
function socketOn1(channelName1, message1) {
  console.log(channelName1, message1);

  // Store each single item as it arrives.
  singleItems.push(message1[0]);
};

// realtime snapshot collection of records
function socketOn2(channelName2, message2) {
  console.log(channelName2, message2);

  // For each element in the collection, find
  // the same record in the single items and
  // if found, update the price.
  results = message2.map((elem) => {
    found = singleItems.find(
      (single) => single.price === elem.price
    )
    if (found) {
      elem.size = found.size
    }
    return elem
  })

  console.log('results:')
  console.log(results)
};


// This stuff just simulates stuff arriving to sockets.
// You can ignore it if you want. But look at the order
// in which they are called.

let singleItemsMock = [{
    "price": 100,
    "size": 0.01
  },
  {
    "price": 50,
    "size": 0.02
  },
  {
    "price": 25,
    "size": 0.03
  },
  {
    "price": 10,
    "size": 0.04
  }
]

let collectionMock = [{
    "price": 100,
    "size": 0.001
  },
  {
    "price": 50,
    "size": 0.002
  },
  {
    "price": 13,
    "size": 0.005
  }
]

socketOn1(null, [singleItemsMock[0]])
socketOn1(null, [singleItemsMock[1]])
socketOn1(null, [singleItemsMock[2]])
socketOn1(null, [singleItemsMock[3]])

socketOn2(null, collectionMock)

答案 1 :(得分:4)

您可以将channel1的数据存储在hashMap中,并循环遍历channel2的数据以检查hashmap中是否有条目,并根据该条目返回项目。

const channel1HashMap = {};

//...this the realtime record
socket.on(channelName1, message => {
   console.log(channelName1, message1);
   dataHandler(message1, null);
});

//realtime snapshot collection of records
socket.on(channelName2, message => {
   console.log(channelName2, message2);
   const data = dataHandler(null, message2);
   updateView(data);
});

dataHandler = (message1, message2) => {
  const channel2Data = [];
  if(Array.isArray(message1)) {
    message1.forEach((message)=> {
       channel1HashMap[message.price] = message;
    });
  } else if(Array.isArray(message2)) {
    message2.forEach((message)=> {
      if(Object.prototype.hasOwnProperty.call(channel1HashMap, message.price)){
        channel2Data.push(channel1HashMap[message.price]);
      } else {
        channel2Data.push(message);
      }
    });
  }
  return channel2Data;
}

updateView = (data) => {
  $('#live').text(data)
}

答案 2 :(得分:3)

socket.on(channelName1, message => {
  console.log(channelName1, message1);
  //this return single item list in realtime`[{"price":100,"size":0.001}]`
  var t = $('#live').text(message2)
  var text = JSON.parse(t)
  text[1].price = message[0].price
  $('#live').text(JSON.stringify(text))
  });

答案 3 :(得分:1)

这是将websocket负载保存到在更“全局”范围内创建的对象的问题。

// since these are defined outside of the websocket event handlers
// they are available to each
var payload1 = [];
var payload2 = [];

const combinePayloads = () => {
    if (payload1[0].price === payload2[0].price) {
        // merge values if prices are the same
        let combinedArray = payload1.concat(payload2);
        console.log(combinedArray);
    }
};

socket.on(channelName1, message => {
    payload1 = message;
    combinePayloads();
});
socket.on(channelName2, message => {
    payload2 = message;
    combinePayloads();
});