React+Spring架构下Cometd握手JWT令牌更新问题求助

问题根源 #

你之前的代码中，additional是初始化时创建的静态对象，token值在首次加载时就被固定，后续localStorage更新后，这个对象的token不会自动同步，导致每次握手都发送旧令牌。另外，cometd.handshake并非只能调用一次，断开连接后可以重新触发握手。

解决方法 #

方法1：使用beforeHandshake拦截器动态注入最新令牌 #

通过添加Cometd的元消息监听器，在每次握手请求发送前动态获取最新token并注入到消息中，这是最推荐的方式，能覆盖所有自动/手动握手场景：

// 初始化Cometd客户端（React组件中可放在useEffect或初始化逻辑里）
const cometd = new CometD();
cometd.configure({
    url: '/cometd', // 替换为你的Cometd服务地址
    logLevel: 'info'
});

// 添加握手消息拦截器，每次握手前更新token
cometd.addListener('/meta/handshake', (message) => {
    const latestToken = localStorage.getItem('token');
    // 将最新token注入到握手消息的自定义字段中
    message['com.app.credentials'] = { token: latestToken };
});

// 首次发起握手
cometd.handshake((reply) => {
    if (reply.successful) {
        console.log('Cometd握手成功');
    } else {
        console.error('Cometd握手失败:', reply);
    }
});

方法2：令牌刷新后主动触发重新握手 #

在JWT令牌刷新成功后，主动断开Cometd连接并重新握手，确保使用新令牌：

// 令牌刷新函数示例（根据你的实际刷新逻辑调整）
async function refreshJwtToken() {
    // 调用后端刷新接口获取新令牌
    const response = await fetch('/api/auth/refresh', { method: 'POST' });
    const { token } = await response.json();
    
    // 更新localStorage中的令牌
    localStorage.setItem('token', token);
    
    // 触发Cometd重新握手
    if (cometd.isConnected()) {
        // 先断开连接，再发起新握手
        cometd.disconnect(() => {
            cometd.handshake();
        });
    } else {
        // 若已断开，直接发起握手
        cometd.handshake();
    }
}

关键说明 #

• /meta/handshake监听器会在每次握手请求发送前执行，无论是首次加载、自动重连还是手动触发的握手，都能确保注入最新的token。
• cometd.handshake支持多次调用，当客户端处于断开状态时，调用该方法会发起新的握手流程；若已连接，调用后会触发重新握手（具体行为可通过Cometd配置调整）。
• REST接口正常是因为每次请求都会重新从localStorage读取token，而Cometd初始的静态参数不会自动更新，拦截器正好弥补了这个差异。

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