如何获取PubNub JS频道历史消息？求助排查代码问题

以下是你的代码存在的几个问题及修复方案：

1. 时间令牌参数格式错误 #

fetchMessages的end参数要求传入数字类型的时间令牌（timetoken），你当前传入的是字符串，会导致参数解析失败。

修复：

pubnub.fetchMessages(
    {
      channels: ['ch-1'],
      end: 15343325004275466, // 去掉引号，改为数字
      count: 20
    },
    // ...回调函数
);

2. 返回结果结构解析错误 #

fetchMessages的响应中，response.messages是一个以频道名为键的对象，不是数组。你直接用response.messages[0]无法拿到消息，需要通过频道名索引获取对应频道的消息数组，且每条消息是包含message属性的对象，需要提取实际内容。

修复回调函数：

(status, response) => {
  // 先判断请求是否成功
  if (status.error) {
    console.error('获取历史消息失败:', status);
    return;
  }
  // 获取ch-1频道的消息数组
  const channelMessages = response.messages['ch-1'];
  // 遍历消息并展示
  channelMessages.forEach(item => {
    sendMessage(item.message);
  });
}

3. DOM选择器可能无效 #

如果没有引入jQuery，原生JavaScript中$('box')是错误的写法，无法选中id为box的元素。

修复sendMessage函数：

function sendMessage(text){
    // 原生JS获取元素
    const box = document.getElementById('box');
    // 转义HTML标签并追加内容
    box.innerHTML = ('' + text).replace(/[<>]/g, '') + '<br>' + box.innerHTML;
}

修复后的完整代码 #

// 发送消息函数
function sendMessage(text){
    const box = document.getElementById('box');
    box.innerHTML = ('' + text).replace(/[<>]/g, '') + '<br>' + box.innerHTML;
}

// 获取历史消息
pubnub.fetchMessages(
    {
      channels: ['ch-1'],
      end: 15343325004275466,
      count: 20
    },
    (status, response) => {
      if (status.error) {
        console.error('获取历史消息失败:', status);
        return;
      }
      const channelMessages = response.messages['ch-1'];
      channelMessages.forEach(item => {
        sendMessage(item.message);
      });
    }
);

内容的提问来源于stack exchange，提问作者decipher