使用油猴脚本构建 DS 对话树

· · 科技·工程

DeepSeek 树形对话图 JS

DS有个很大的优点是所有对话都能被保存，每个对话都能产生分支，那么对话多了自然有需要管理的诉求。

直接看图：

放大看：

对话都能被记录并构建成图。

原理是发现网络中关于 history_messages 的响应，会记录全部对话 id 和对话父 id。

这是一个示例响应：

{
    "code": 0,
    "msg": "",
    "data": {
        "biz_code": 0,
        "biz_msg": "",
        "biz_data": {
            "chat_session": {
                "id": "65cf775c-b819-4a9b-93ba-c00e3281cf2b",
                "title": "用户问候助手回应",
                "title_type": "SYSTEM",
                "model_type": "default",
                "pinned": false,
                "updated_at": 1777528707.899,
                "seq_id": 199691907,
                "agent": "chat",
                "version": 2,
                "is_empty": false,
                "current_message_id": 2,
                "inserted_at": 1777528532.742
            },
            "chat_messages": [
                {
                    "message_id": 1,
                    "parent_id": null,
                    "model": "",
                    "role": "USER",
                    "thinking_enabled": false,
                    "ban_edit": false,
                    "ban_regenerate": false,
                    "status": "FINISHED",
                    "incomplete_message": null,
                    "accumulated_token_usage": 32,
                    "feedback": null,
                    "inserted_at": 1777528706.8309999,
                    "search_enabled": true,
                    "fragments": [
                        {
                            "id": 1,
                            "type": "REQUEST",
                            "content": "你好"
                        }
                    ],
                    "has_pending_fragment": false,
                    "auto_continue": false
                },
                {
                    "message_id": 2,
                    "parent_id": 1,
                    "model": "",
                    "role": "ASSISTANT",
                    "thinking_enabled": false,
                    "ban_edit": false,
                    "ban_regenerate": false,
                    "status": "FINISHED",
                    "incomplete_message": null,
                    "accumulated_token_usage": 63,
                    "feedback": null,
                    "inserted_at": 1777528706.8279998,
                    "search_enabled": true,
                    "fragments": [
                        {
                            "id": 2,
                            "type": "RESPONSE",
                            "content": "你好！很高兴见到你😊 有什么我可以帮你的吗？无论是问题、聊天，还是需要帮忙找资料或建议，我都很乐意协助～",
                            "references": [],
                            "stage_id": 1
                        }
                    ],
                    "has_pending_fragment": false,
                    "auto_continue": false
                }
            ],
            "cache_control": "REPLACE",
            "cache_reset_at": 1777528709
        }
    }
}

对话信息记录的非常全面。

同时避免前端缓存，强制刷新就行了。

而对于节点跳转，就是模拟点击，先找 LCA，再往上滑，切换分支，新版本直接跳到根节点，简单粗暴，稳定性强，往下滑，依次切换分支。

跳跃节点有卡顿现象是正常的，静等完成即可。

如果体验后有 bug 或者建议，劳烦提出，会改的。

教程：

大概有这个几个功能：

  1. 小地图显示节点，双击可切换圆形/方形，鼠标拖住可移动；

  2. 右下角点击或按 m 键进入图谱，显示全部 DS 对话节点；

  3. 在图谱页面双击节点可快速跳跃到该节点。

  4. 可任意改变颜色

  5. 有书签和标记功能，刷新页面不会丢

节点不对刷新下就好了。