一天一个开源项目（第47篇）：Cursor Chat Browser - 浏览和管理 Cursor AI 聊天历史的 Web 应用

引言

"View, search, and export your AI conversations in various formats."

这是「一天一个开源项目」系列的第 47 篇文章。今天介绍的项目是 Cursor Chat Browser （GitHub）。

使用 Cursor 编辑器进行 AI 编程时，是否遇到过这些问题：想回顾之前的对话却找不到？想搜索某个技术问题的解决方案却无从下手？想导出聊天记录分享给团队却不知道如何操作？Cursor Chat Browser 是一个用于浏览和管理 Cursor 编辑器 AI 聊天历史的 Web 应用 ，支持查看、搜索和导出 你的 AI 对话为 Markdown、HTML、PDF 等多种格式，让你轻松管理和回顾与 AI 的对话历史。

为什么值得看？

🔍 浏览和搜索：浏览所有工作区的 Cursor 聊天历史，全文搜索功能
🌐 多存储支持：支持工作区特定存储和全局存储（新版本 Cursor）
🤖 双重日志：同时支持 AI 聊天日志和 Composer 日志
📁 工作区组织：按工作区组织聊天记录
📱 响应式设计：支持深色/浅色模式，移动端友好
⬇️ 多格式导出：支持 Markdown、HTML（语法高亮）、PDF 导出
🎨 语法高亮：代码块语法高亮显示
📌 可收藏链接：支持书签化的聊天 URL

你将学到什么

Cursor Chat Browser 的核心功能和特性
Cursor 编辑器聊天历史的存储机制
如何浏览、搜索和导出聊天记录
跨平台路径自动检测机制
Next.js + TypeScript + Tailwind CSS 技术栈实践
SQLite 数据库读取和解析

前置知识

了解 Cursor 编辑器的基本使用
对 Web 应用开发有基本了解
了解 Next.js 框架（可选）
对 SQLite 数据库有基本了解（可选）

项目背景

项目简介

Cursor Chat Browser 是一个用于浏览和管理 Cursor 编辑器 AI 聊天历史的 Web 应用。它解决了 Cursor 编辑器本身无法方便地浏览、搜索和导出聊天历史的问题，让开发者能够更好地管理和回顾与 AI 的对话。

核心特点：

浏览功能：浏览所有工作区的聊天历史
搜索功能：全文搜索，支持按聊天类型过滤
导出功能：支持 Markdown、HTML、PDF 多种格式
多存储支持：兼容新旧版本的 Cursor 存储格式
双重日志：同时支持 AI 聊天和 Composer 日志
自动检测：自动检测 Cursor 工作区存储路径
响应式设计：支持深色/浅色模式，移动端友好

解决的核心问题：

Cursor 编辑器无法方便地浏览历史聊天记录
无法搜索之前的对话内容
无法导出聊天记录分享或备份
多个工作区的聊天记录分散，难以统一管理
新版本 Cursor 改变了存储格式，需要兼容

面向的用户：

使用 Cursor 编辑器进行 AI 编程的开发者
需要回顾和整理 AI 对话历史的用户
需要导出聊天记录分享给团队的开发者
需要备份重要对话的用户
希望更好地管理 AI 编程对话的开发者

作者/团队介绍

作者：Thomas Pedersen （GitHub）
背景：开源开发者，专注于开发实用工具
理念：让开发者更好地管理和利用 AI 对话历史
社区：500+ stars，87+ forks，活跃的社区支持

项目数据

⭐ GitHub Stars: 500+
🍴 Forks: 87+
📦 版本: 持续更新中（32+ commits）
📄 License: MIT
🌐 仓库 : github.com/thomas-pede...
🐛 Issues : GitHub Issues

技术栈：

框架: Next.js 14 (App Router)
语言: TypeScript (93.7%)
样式: Tailwind CSS (6.0%)
UI 组件: shadcn/ui
数据库: SQLite（读取 Cursor 聊天数据库）
Node.js: 18+

重要特性：

支持 Windows、macOS、Linux、WSL2
自动检测 Cursor 工作区存储路径
支持新旧版本的 Cursor 存储格式
响应式设计，支持深色/浅色模式

主要功能

核心作用

Cursor Chat Browser 的核心作用是：提供一个 Web 界面来浏览、搜索和管理 Cursor 编辑器的 AI 聊天历史，让开发者能够：

浏览历史：查看所有工作区的聊天记录
搜索对话：全文搜索所有聊天内容
导出记录：导出为 Markdown、HTML、PDF 格式
组织管理：按工作区组织聊天记录
类型区分：区分 AI 聊天和 Composer 日志
跨平台：支持 Windows、macOS、Linux、WSL2

使用场景

回顾对话历史
- 查找之前解决的技术问题
- 回顾 AI 给出的代码建议
- 查看之前的错误解决方案
知识整理
- 导出重要对话为文档
- 整理技术问题和解决方案
- 创建知识库
团队分享
- 导出聊天记录分享给团队成员
- 将 AI 对话作为文档保存
- 创建技术文档
备份管理
- 备份重要的 AI 对话
- 跨设备同步聊天历史
- 版本控制聊天记录
搜索和分析
- 搜索特定技术问题的解决方案
- 分析 AI 对话模式
- 查找代码示例

快速开始

安装：

bash 复制代码

# 克隆仓库
git clone https://github.com/thomas-pedersen/cursor-chat-browser.git
cd cursor-chat-browser

# 安装依赖
npm install

# 启动开发服务器
npm run dev

访问：

打开浏览器访问：http://localhost:3000

配置：

应用会自动检测 Cursor 工作区存储路径：

Windows : %APPDATA%\Cursor\User\workspaceStorage
WSL2 : /mnt/c/Users/<USERNAME>/AppData/Roaming/Cursor/User/workspaceStorage
macOS : ~/Library/Application Support/Cursor/User/workspaceStorage
Linux : ~/.config/Cursor/User/workspaceStorage
Linux (remote/SSH) : ~/.cursor-server/data/User/workspaceStorage

如果自动检测失败，可以在配置页面（⚙️）手动设置路径。

注意：新版本的 Cursor 已将聊天数据存储从工作区特定位置移动到全局存储。此应用现在支持两种存储方法，以确保与所有 Cursor 版本兼容。

核心特性

浏览功能
- 查看所有工作区的聊天历史
- 按工作区组织聊天记录
- 浏览 AI 聊天日志和 Composer 日志
- 在工作区内的不同聊天标签之间导航
- 查看带类型指示器的合并日志
- 显示每个工作区的聊天和 Composer 数量
搜索功能
- 在导航栏中使用搜索栏搜索所有日志
- 按聊天日志、Composer 日志或两者过滤结果
- 搜索结果显示：
  - 类型徽章（Chat/Composer）
  - 匹配的文本片段
  - 工作区位置
  - 标题
  - 时间戳
导出功能
- Markdown：纯文本格式，带代码块
- HTML：带语法高亮的样式文档
- PDF：适合分享的格式化文档
多存储支持
- 支持工作区特定存储（旧版本）
- 支持全局存储（新版本 Cursor）
- 自动检测存储位置
- 兼容所有 Cursor 版本
双重日志支持
- AI 聊天日志
- Composer 日志
- 类型区分和过滤
- 合并视图
用户体验
- 响应式设计
- 深色/浅色模式支持
- 语法高亮的代码块
- 可收藏的聊天 URL
- 自动工作区路径检测

项目优势

对比项	Cursor Chat Browser	Cursor 编辑器内置	手动导出
浏览历史	✅ Web 界面，易于浏览	⚠️ 仅当前会话	❌ 不支持
搜索功能	✅ 全文搜索，支持过滤	❌ 不支持	❌ 需手动查找
导出格式	✅ Markdown、HTML、PDF	❌ 不支持	⚠️ 需手动复制
多工作区	✅ 统一管理所有工作区	⚠️ 分散在各工作区	⚠️ 需逐个处理
类型区分	✅ 区分 Chat 和 Composer	⚠️ 需手动区分	❌ 不支持
跨平台	✅ Windows、macOS、Linux	✅ 跨平台	✅ 跨平台
语法高亮	✅ 代码块语法高亮	✅ 支持	❌ 需手动处理
备份管理	✅ 导出备份	⚠️ 需手动复制文件	⚠️ 需手动操作

为什么选择 Cursor Chat Browser？

便捷浏览：Web 界面，易于浏览和搜索历史对话
多格式导出：支持 Markdown、HTML、PDF，满足不同需求
全文搜索：快速找到需要的对话内容
统一管理：统一管理所有工作区的聊天记录
自动检测：自动检测 Cursor 存储路径，无需手动配置
开源免费：MIT 许可证，完全免费使用

项目详细剖析

架构设计

Cursor Chat Browser 采用 Next.js 14 App Router 架构，使用 TypeScript 开发，通过 SQLite 读取 Cursor 的聊天数据库。

核心组件：

scss 复制代码

Cursor Chat Browser
├── Next.js 14 (App Router)
│   ├── 页面路由
│   ├── 服务端组件
│   └── 客户端组件
├── SQLite 数据库读取
│   ├── 读取 state.vscdb 文件
│   ├── 解析聊天记录
│   └── 解析 Composer 日志
├── UI 组件 (shadcn/ui)
│   ├── 导航栏
│   ├── 搜索栏
│   ├── 聊天列表
│   └── 导出功能
└── 样式系统 (Tailwind CSS)
    ├── 响应式设计
    └── 深色/浅色模式

设计理念：

简单易用：Web 界面，无需复杂配置
自动检测：自动检测 Cursor 存储路径
兼容性：支持新旧版本的 Cursor 存储格式
响应式：支持桌面和移动端
可扩展：基于 Next.js，易于扩展功能

Cursor 存储机制

Cursor 编辑器将聊天历史存储在 SQLite 数据库中（state.vscdb 文件）。

存储位置：

Windows : %APPDATA%\Cursor\User\workspaceStorage\<workspace-id>\state.vscdb
macOS : ~/Library/Application Support/Cursor/User/workspaceStorage/<workspace-id>/state.vscdb
Linux : ~/.config/Cursor/User/workspaceStorage/<workspace-id>/state.vscdb

新版本变化：

旧版本 ：每个工作区有独立的 state.vscdb 文件
新版本（v44.9+）：使用全局存储，聊天数据集中管理

数据库结构：

sql 复制代码

-- 简化的数据库结构
CREATE TABLE ItemTable (
    key TEXT PRIMARY KEY,
    value TEXT  -- JSON 格式的聊天数据
);

路径自动检测

应用会自动检测不同平台的 Cursor 存储路径：

检测逻辑：

typescript 复制代码

// 伪代码示例
function detectCursorPath(): string {
  const platform = process.platform;
  
  switch (platform) {
    case 'win32':
      return path.join(process.env.APPDATA, 'Cursor/User/workspaceStorage');
    case 'darwin':
      return path.join(os.homedir(), 'Library/Application Support/Cursor/User/workspaceStorage');
    case 'linux':
      // 检查是否是 WSL2
      if (isWSL2()) {
        return `/mnt/c/Users/${username}/AppData/Roaming/Cursor/User/workspaceStorage`;
      }
      return path.join(os.homedir(), '.config/Cursor/User/workspaceStorage');
    default:
      throw new Error('Unsupported platform');
  }
}

手动配置：

如果自动检测失败，用户可以在配置页面手动设置路径：

点击配置图标（⚙️）
输入 Cursor 工作区存储路径
保存配置

搜索功能实现

搜索功能支持全文搜索和类型过滤：

搜索流程：

markdown 复制代码

1. 用户输入搜索关键词
   ↓
2. 扫描所有工作区的 state.vscdb 文件
   ↓
3. 解析聊天记录和 Composer 日志
   ↓
4. 全文搜索匹配内容
   ↓
5. 按类型过滤（Chat/Composer/All）
   ↓
6. 显示搜索结果

搜索结果展示：

类型徽章（Chat/Composer）
匹配的文本片段（高亮显示）
工作区位置
标题
时间戳

导出功能

支持三种导出格式：

Markdown 导出：

markdown 复制代码

# Chat Title

## User
用户消息内容

## Assistant
AI 回复内容

```code
代码块内容

csharp 复制代码

**HTML 导出**：

- 带样式的 HTML 文档
- 代码块语法高亮（使用 highlight.js 或类似库）
- 响应式设计
- 可打印格式

**PDF 导出**：

- 使用浏览器打印功能或 PDF 库
- 格式化文档
- 适合分享和存档

**导出实现**：

```typescript
// 伪代码示例
async function exportChat(chatId: string, format: 'md' | 'html' | 'pdf') {
  const chat = await loadChat(chatId);
  
  switch (format) {
    case 'md':
      return exportAsMarkdown(chat);
    case 'html':
      return exportAsHTML(chat);
    case 'pdf':
      return exportAsPDF(chat);
  }
}

技术栈详解

Next.js 14 App Router：

使用最新的 App Router 架构
服务端组件和客户端组件混合使用
文件系统路由
服务端数据获取

TypeScript：

类型安全
更好的开发体验
代码提示和错误检查

Tailwind CSS：

实用优先的 CSS 框架
快速开发
响应式设计
深色模式支持

shadcn/ui：

基于 Radix UI 的组件库
可访问性支持
可定制样式
组件丰富

SQLite：

使用 better-sqlite3 或类似库读取数据库
轻量级，无需额外服务
直接读取 Cursor 的数据库文件

兼容性处理

项目需要处理新旧版本的 Cursor 存储格式差异：

旧版本（工作区特定存储）：

python 复制代码

workspaceStorage/
├── workspace-id-1/
│   └── state.vscdb
├── workspace-id-2/
│   └── state.vscdb
└── ...

新版本（全局存储）：

scss 复制代码

User/
├── workspaceStorage/
│   └── (旧格式)
└── globalStorage/
    └── (新格式)

兼容策略：

同时检查两种存储位置
优先使用新格式
如果新格式不存在，回退到旧格式
统一数据模型处理两种格式

项目地址与资源

官方资源

🌟 GitHub : github.com/thomas-pede...
🐛 Issue Tracker : GitHub Issues
💬 Pull Requests : GitHub PRs
📝 Changelog : CHANGELOG.md

适用人群

Cursor 用户：使用 Cursor 编辑器进行 AI 编程的开发者
知识管理：需要整理和回顾 AI 对话历史的用户
团队协作：需要导出和分享聊天记录的团队
备份需求：需要备份重要对话的用户
Web 开发者：学习 Next.js + TypeScript + Tailwind CSS 的开发者

欢迎来我中的个人主页找到更多有用的知识和有趣的产品