基于REST接口的Angular 2长轮询实现问题咨询

刚好有过类似的实现经验，我来给你拆解一下这个长轮询机制的实现细节，完全贴合你提到的REST接口规则：

核心逻辑先理清楚 #

先把你提到的规则再明确下，避免理解偏差：

长轮询核心机制：仅当请求发起后目标值发生变化时，服务器才返回新数据；每次请求需携带上一次响应返回的哈希值作为查询参数；服务器会保持连接等待，直到哈希不匹配（值变化）或默认30秒超时到期。

客户端实现步骤 #

客户端的核心就是循环发起请求，根据响应结果更新哈希值，具体步骤：

• 首次请求：不需要携带哈希参数，直接调用REST接口，拿到当前数据和对应的哈希值并保存。
• 后续轮询：把保存的哈希值通过查询字符串（比如?last_hash=xxx）传入接口，发起请求。
• 等待响应：保持请求连接打开，直到收到服务器的两种响应之一——要么是新数据+新哈希，要么是超时提示。
• 循环重试：无论哪种响应，立即发起下一次请求（超时的话继续用旧哈希，拿到新数据就更新哈希）。

给你一个简单的JavaScript客户端示例：

async function startLongPoll(lastHash = null) {
  try {
    let requestUrl = '/api/target-data';
    // 携带上次的哈希参数
    if (lastHash) {
      requestUrl += `?last_hash=${encodeURIComponent(lastHash)}`;
    }

    const response = await fetch(requestUrl, {
      method: 'GET',
      headers: { 'Accept': 'application/json' }
    });

    if (response.ok) {
      if (response.status === 200) {
        // 拿到新数据，更新哈希
        const result = await response.json();
        console.log('数据更新:', result.value);
        startLongPoll(result.hash);
      } else if (response.status === 204) {
        // 超时无更新，继续用旧哈希重试
        startLongPoll(lastHash);
      }
    } else {
      // 其他错误，延迟3秒再重试，避免频繁请求
      setTimeout(() => startLongPoll(lastHash), 3000);
    }
  } catch (err) {
    console.error('轮询出错:', err);
    setTimeout(() => startLongPoll(lastHash), 5000);
  }
}

// 启动长轮询
startLongPoll();

服务器端处理逻辑 #

服务器要做的就是对比哈希、等待变化、超时返回，步骤如下：

• 解析请求：获取查询参数里的last_hash（如果存在）。
• 计算当前哈希：对目标数据生成哈希值（比如用MD5、SHA-256，确保数据变哈希就变）。
• 分支处理：
  • 无last_hash（首次请求）：直接返回当前数据+哈希，结束请求。
  • 哈希相等：进入循环等待，每隔1秒重新计算哈希并对比，直到哈希变化或30秒超时。
  • 哈希不等：立即返回新数据+新哈希，结束请求。
• 清理资源：监听客户端断开事件，及时清理定时器，避免内存泄漏。

给你一个Node.js/Express的服务器示例：

const express = require('express');
const crypto = require('crypto');
const app = express();

// 模拟目标数据，实际可替换为数据库/缓存数据
let targetData = { content: '初始内容' };

// 生成数据哈希的工具函数
function generateDataHash(data) {
  return crypto.createHash('sha256')
    .update(JSON.stringify(data))
    .digest('hex');
}

app.get('/api/target-data', (req, res) => {
  const lastHash = req.query.last_hash;
  const currentHash = generateDataHash(targetData);
  const timeoutDuration = 30 * 1000; // 默认30秒超时

  // 首次请求或数据已更新，直接返回
  if (!lastHash || lastHash !== currentHash) {
    return res.json({
      value: targetData.content,
      hash: currentHash
    });
  }

  // 数据未更新，设置循环检查和超时
  const checkInterval = setInterval(() => {
    const newHash = generateDataHash(targetData);
    if (newHash !== lastHash) {
      clearInterval(checkInterval);
      clearTimeout(timeoutTimer);
      res.json({ value: targetData.content, hash: newHash });
    }
  }, 1000);

  const timeoutTimer = setTimeout(() => {
    clearInterval(checkInterval);
    // 返回204表示无更新超时
    res.sendStatus(204);
  }, timeoutDuration);

  // 客户端断开连接时清理定时器
  res.on('close', () => {
    clearInterval(checkInterval);
    clearTimeout(timeoutTimer);
  });
});

app.listen(3000, () => console.log('长轮询服务启动在3000端口'));

关键注意事项 #

• 哈希算法选择：优先选高效且碰撞概率低的算法，比如SHA-256，避免用容易碰撞的弱哈希。
• 资源管理：服务器一定要处理客户端主动断开的情况，不然定时器会一直占用内存。
• 重试策略：客户端遇到网络错误时，不要立即重试，加几秒延迟，防止雪崩。
• 可配置性：可以把超时时间做成可配置参数（比如通过请求头传递），适配不同场景需求。

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