{"id":32349865,"url":"https://github.com/lucklyspace/lucky-client","last_synced_at":"2025-10-24T08:05:46.504Z","repository":{"id":317794670,"uuid":"1068255319","full_name":"LucklySpace/Lucky-client","owner":"LucklySpace","description":"A cross-platform instant messaging client application built with Tauri and Vue 3, featuring one-to-one chat, group chat, file transfer, audio/video calling, screen recording, screenshot capture, and QR code login capabilities.","archived":false,"fork":false,"pushed_at":"2025-10-12T03:57:59.000Z","size":18018,"stargazers_count":1101,"open_issues_count":2,"forks_count":125,"subscribers_count":107,"default_branch":"master","last_synced_at":"2025-10-18T13:14:05.215Z","etag":null,"topics":["element-ui","ffmpeg","javascript","markdown","protobuf","rust","tauri","typescript","vite","vue3","webrtc"],"latest_commit_sha":null,"homepage":" https://luckly-xyz.github.io","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/LucklySpace.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null},"funding":{"github":null,"patreon":null,"open_collective":null,"ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"lfx_crowdfunding":null,"polar":null,"buy_me_a_coffee":null,"thanks_dev":null,"custom":null}},"created_at":"2025-10-02T05:12:19.000Z","updated_at":"2025-10-18T01:58:33.000Z","dependencies_parsed_at":null,"dependency_job_id":"8a0322b9-7ddb-4986-832a-b535329c10b1","html_url":"https://github.com/LucklySpace/Lucky-client","commit_stats":null,"previous_names":["luckly-xyz/lucky-client","lucklyspace/lucky-client"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/LucklySpace/Lucky-client","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LucklySpace%2FLucky-client","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LucklySpace%2FLucky-client/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LucklySpace%2FLucky-client/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LucklySpace%2FLucky-client/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/LucklySpace","download_url":"https://codeload.github.com/LucklySpace/Lucky-client/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LucklySpace%2FLucky-client/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":280761808,"owners_count":26386245,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-24T02:00:06.418Z","response_time":73,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["element-ui","ffmpeg","javascript","markdown","protobuf","rust","tauri","typescript","vite","vue3","webrtc"],"created_at":"2025-10-24T08:03:10.241Z","updated_at":"2025-10-24T08:05:46.498Z","avatar_url":"https://github.com/LucklySpace.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🍀  Lucky （IM Client）- 高性能即时通讯客户端\n\n一个基于 Tauri 和 Vue 3 构建的跨平台即时通讯客户端应用程序。\n\n[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)\n[![Tauri](https://img.shields.io/badge/Tauri-2.5-blue)](https://tauri.app/)\n[![Vue.js](https://img.shields.io/badge/Vue.js-3.x-4FC08D)](https://vuejs.org/)\n[![TypeScript](https://img.shields.io/badge/TypeScript-Strict-3178c6)](https://www.typescriptlang.org/)\n[![Platform](https://img.shields.io/badge/Platform-Windows%20%7C%20macOS%20%7C%20Linux-61DAFB)](https://tauri.app/)\n\n## 目录\n\n- [项目概述](#项目概述) \n- [技术栈](#技术栈) \n- [功能特性](#功能特性) \n- [项目结构](#项目结构) \n- [开发环境搭建](#开发环境搭建) \n- [运行项目](#运行项目) \n- [构建项目](#构建项目) \n- [核心模块](#核心模块) \n- [数据库设计](#数据库设计) \n- [WebSocket通信协议](#websocket通信协议) \n- [国际化支持](#国际化支持) \n- [主题和样式](#主题和样式) \n- [插件和扩展](#插件和扩展) \n- [贡献指南](#贡献指南) \n- [许可证](#许可证) \n\n\n\n## 🌟项目概述 \n\nIM Client (Lucky) 是一个功能丰富的即时通讯客户端，支持一对一聊天、群聊、文件传输、音视频通话、屏幕录制、屏幕截取、扫码登录等核心功能。该项目使用现代化的前端技术栈构建，通过 Tauri 框架打包为跨平台桌面应用。\n\n### 项目特点\n\n- **跨平台支持** - 支持 Windows、macOS 和 Linux 操作系统\n- **高性能** - 使用 Rust 后端和 Vue 3 前端，确保应用运行流畅\n- **安全性** - 消息加密传输，本地数据安全存储\n- **现代化UI** - 基于 Element Plus 组件库构建的美观界面\n- **可扩展性** - 模块化设计，易于添加新功能\n\n### 应用场景\n\n- 企业内部通讯\n- 团队协作沟通\n- 个人即时通讯\n- 远程会议和协作\n\n\n\n## 技术栈\n\n- ### 前端核心\n\n  - **框架**：Vue 3（响应式 UI 的王者）\n  - **构建**：Vite（闪电般快速热重载）\n  - **语言**：TypeScript（严格类型检查，减少 bug）\n  - **状态管理**：Pinia（简洁的状态仓库）\n  - **路由**：Vue Router（无缝页面导航）\n  - **UI 库**：Element Plus（优雅组件，节省开发时间）\n  - **样式**：SCSS（变量化主题，易于定制）\n  - **国际化**：vue-i18n（多语言无缝切换）\n\n  ### 后端与跨平台\n\n  - **框架**：Tauri 2.5（Rust + WebView，轻量桌面应用）\n  - **语言**：Rust（安全、高性能后端逻辑）\n  - **数据库**：SQLite（本地持久化，高效查询）🗄️\n  - **网络**：WebSocket \u0026 HTTP（实时通信 + 文件传输）\n  - **序列化**：Protobuf（高效数据序列化协议）\n\n  ### 扩展技术\n\n  - **音视频**：WebRTC（P2P 通话，低延迟）\n  - **推送**：WebSocket（即时消息通知）\n  - **截图/录屏**：Screenshots (Rust) + FFmpeg（专业音视频处理工具）\n  - **分词**：Jieba（中文文本处理）\n\n\n\n##  🖼 项目预览\n\n### ✉️ 聊天页面\n\n\u003cimg src=\"picture/message_search.png\" style=\"zoom:150%;\" /\u003e\n\n\n\n### 📺️ 视频通话\n\n![](picture/group_call.png)\n\n\n\n### 🎯 主题切换\n\n ![](picture/theme.png)\n\n\n\n### 🔤 多语言支持\n\n\u003cimg src=\"picture/language.png\" style=\"zoom:150%;\" /\u003e\n\n\n\n### 📄 文件在线预览\n\n![](picture/preview_file.png)\n\n\n\n### 📌 屏幕截取\n\n![](picture/screenshot.png)\n\n\n\n## ✨ 功能特性 \n\n### 核心功能\n\n1. #### **即时通讯** 💬\n\n   - **单聊消息**：支持文本、表情、图片、文件等多种消息类型\n   - **群聊消息**：支持多人聊天，@功能，群公告等\n   - **消息类型支持**：\n     - 文本消息：支持富文本格式、表情、链接解析\n     - 图片消息：支持多种格式，自动压缩优化，支持图片预览\n     - 视频消息：支持录制和发送视频\n     - 音频消息：支持语音消息录制和播放\n     - 文件消息：支持任意类型文件传输；支持word 、excel、pdf、 markdown等文件预览\n     - 位置消息：支持发送地理位置信息\n   - **消息已读回执**：显示消息是否已被对方阅读\n   - **消息撤回**：支持撤回已发送的消息（时间限制内）\n   - **消息转发**：支持转发消息给其他联系人或群组\n\n2. #### **联系人管理** 👥\n\n   - **好友列表**：展示所有好友，支持分组管理\n   - **群组列表**：展示所有加入的群组，支持群组信息查看\n   - **联系人搜索**：支持按姓名、ID等条件搜索联系人\n   - **好友请求处理**：支持发送和处理好友请求\n   - **联系人信息**：展示联系人详细信息，支持备注设置\n\n3. #### **音视频通话** 📞\n\n   - **一对一音视频通话**：支持高质量音视频通话\n   - **群组音视频通话**：支持多人音视频会议\n   - **屏幕共享**：支持共享屏幕内容\n   - **噪音抑制**：内置噪音抑制功能，提升通话质量\n   - **录制功能**：支持通话录制（需用户授权）\n\n4. #### **文件传输** 📁\n\n   - **文件上传下载**：支持大文件分片传输\n   - **文件预览**：\n     - PDF文件：内置PDF阅读器\n     - Word文档：支持.doc/.docx格式预览\n     - Excel表格：支持.xls/.xlsx格式预览\n     - Markdown文档： 支持.md格式预览\n   - **图片预览**：支持常见图片格式预览和缩放\n   - **文件自动下载**：根据设置自动下载接收的文件\n   - **文件管理**：支持查看和管理已接收文件\n\n5. #### **系统功能** ⚙️\n\n   - **多语言支持 (中文/英文)** 🌍\n     - 界面语言切换\n     - 消息内容国际化\n   - **主题切换 (浅色/深色)** 🎨\n     - 跟随系统主题\n     - 手动切换主题模式\n   - **快捷键操作** ⌨️\n     - 支持常用操作快捷键\n     - 可自定义快捷键设置\n   - **系统托盘集成** 📦\n     - 最小化到系统托盘\n     - 托盘图标状态显示\n     - 托盘菜单操作\n   - **系统托盘消息通知** 🔔\n     - 桌面通知提醒\n     - 声音提示\n     - 未读消息计数\n     - 托盘闪烁通知\n   - **截图功能** 📸\n     - 全屏截图\n     - 区域截图\n     - 截图编辑\n   - **录屏功能** 📸\n     - 全屏幕录制\n\n### 技术特性\n\n1. **性能优化** ⚡\n   - 虚拟列表优化大量消息渲染：\n   - 懒加载和图片预加载：\n   - 消息缓存和数据库存储：\n   - 工作线程处理耗时操作：\n     - 使用 Web Workers 处理密集计算任务\n2. **安全特性** 🔒\n   - 消息加密传输：\n   - 文件安全存储：\n   - XSS 防护 (DOMPurify)：\n     - 消息内容安全过滤\n     - 防止恶意脚本注入\n   - 权限控制：\n     - 操作系统权限申请\n     - 用户隐私保护\n     \n     \n\n## 📁 项目结构 \n\n```\nim-client/\n├── proto/                    # Protocol Buffer 定义\n├── public/                   # 静态资源\n├── src/                      # 前端源码\n│   ├── api/                  # API 接口封装\n│   │   └── index.ts          # 统一API入口，封装所有后端接口调用\n│   ├── assets/               # 静态资源 (图片、样式、语言包等)\n│   │   ├── i18n/             # 国际化语言包\n│   │   │   ├── en-US.json    # 英文语言包\n│   │   │   └── zh-CN.json    # 中文语言包\n│   │   ├── iconfont/         # 字体图标\n│   │   ├── json/             # JSON数据文件\n│   │   └── style/            # 全局样式文件\n│   │       ├── fonts/        # 字体文件\n│   │       └── scss/         # SCSS样式文件\n│   ├── components/           # 公共组件\n│   │   ├── Bubble/           # 消息气泡组件（不同类型消息的展示）\n│   │   ├── ChatDetail/       # 聊天详情组件\n│   │   ├── Emoji/            # 表情选择器组件\n│   │   ├── FileUpload/       # 文件上传组件\n│   │   ├── Message/          # 消息容器组件\n│   │   ├── Setting/          # 设置相关组件\n│   │   └── ...               # 其他公共组件\n│   ├── constants/            # 常量定义\n│   │   ├── MessageCode.ts    # 消息状态码定义\n│   │   └── index.ts          # 其他常量导出\n│   ├── database/             # 数据库相关 (ORM、实体、映射器)\n│   │   ├── entity/           # 数据实体定义\n│   │   ├── mapper/           # 数据访问映射器\n│   │   └── orm/              # 自定义ORM框架\n│   ├── directive/            # Vue 指令\n│   │   ├── dompurify/        # DOM安全净化指令\n│   │   ├── lazy/             # 图片懒加载指令\n│   │   └── ...               # 其他自定义指令\n│   ├── docs/                 # 项目文档\n│   │   └── RNNoise集成指南.md # 噪音抑制集成文档\n│   ├── hooks/                # Vue Composition API Hooks\n│   │   ├── useWebRTC.ts      # WebRTC相关Hook\n│   │   ├── useWebSocketWorker.ts # WebSocket通信Hook\n│   │   ├── useChatInput.ts   # 聊天输入处理Hook\n│   │   └── ...               # 其他功能Hooks\n│   ├── i18n/                 # 国际化配置\n│   │   └── index.ts          # 国际化实例配置\n│   ├── layout/               # 布局组件\n│   │   ├── header/           # 头部布局\n│   │   ├── main/             # 主体布局\n│   │   ├── side/             # 侧边栏布局\n│   │   └── index.vue         # 根布局组件\n│   ├── models/               # 数据模型\n│   │   └── index.ts          # 所有数据模型定义\n│   ├── plugins/              # Vue 插件\n│   │   ├── modules/          # 各个插件模块\n│   │   └── index.ts          # 插件注册入口\n│   ├── proto/                # 生成的 Protocol Buffer 代码\n│   ├── router/               # 路由配置\n│   │   └── index.ts          # 路由定义和配置\n│   ├── store/                # 状态管理 (Pinia)\n│   │   ├── modules/          # 各模块状态\n│   │   ├── plugins/          # 状态管理插件\n│   │   └── index.ts          # 状态管理入口\n│   ├── types/                # TypeScript 类型定义\n│   ├── utils/                # 工具函数\n│   │   ├── Http.ts           # HTTP请求工具\n│   │   ├── Storage.ts        # 本地存储工具\n│   │   ├── WebRTC2.ts        # WebRTC工具\n│   │   └── ...               # 其他工具函数\n│   ├── views/                # 页面视图\n│   │   ├── message/          # 消息页面\n│   │   ├── contact/          # 联系人页面\n│   │   ├── call/             # 音视频通话页面\n│   │   ├── setting/          # 设置页面\n│   │   └── ...               # 其他页面\n│   ├── windows/              # 窗口管理\n│   │   ├── main.ts           # 主窗口管理\n│   │   ├── login.ts          # 登录窗口管理\n│   │   └── ...               # 其他窗口管理\n│   ├── worker/               # Web Workers\n│   │   ├── Websocket.worker.ts # WebSocket Worker\n│   │   └── ...               # 其他 Worker\n│   ├── App.vue               # 根组件\n│   ├── core.ts               # 核心初始化逻辑\n│   └── main.ts               # 入口文件\n├── src-tauri/                # Tauri 后端源码\n│   ├── capabilities/         # 权限配置\n│   ├── resources/            # 资源文件\n│   │   └── sql/              # 数据库SQL脚本\n│   ├── src/                  # Rust 源码\n│   │   ├── commands.rs       # Tauri命令处理\n│   │   ├── lib.rs            # 库入口\n│   │   ├── main.rs           # 主程序入口\n│   │   └── ...               # 其他Rust模块\n│   ├── Cargo.toml            # Rust 依赖配置\n│   └── tauri.conf.json       # Tauri 配置\n├── index.html                # HTML 模板\n├── package.json              # Node.js 项目配置\n├── vite.config.ts            # Vite 配置\n└── README.md                 # 项目说明文档\n```\n\n\n\n## 🔧 开发环境搭建 \n\n### 环境要求\n\n- Node.js \u003e= 16.0.0 \n  - 推荐使用 LTS 版本以确保稳定性\n  - 使用 nvm (Node Version Manager) 管理多个 Node.js 版本\n\n- Rust \u003e= 1.70.0 \n  - Tauri 基于 Rust 构建，需要安装 Rust 工具链\n  - 使用 rustup 管理 Rust 版本\n\n- pnpm \u003e= 8.0.0 \n  - 更快、更节省磁盘空间的包管理器\n  - 相比 npm 和 yarn 有更好的性能\n\n- Protocol Buffer Compiler (protoc) \n  - 用于生成 Protocol Buffer 代码\n  - 需要安装对应平台的 protoc 工具\n\n### 📥 安装步骤\n\n1. **克隆项目** \n   \n   ```bash\n   git clone \u003crepository-url\u003e\n   cd im-client\n   ```\n   \n2. **安装前端依赖** \n   \n   ```bash\n   # 安装项目依赖\n   pnpm install\n   \n   # 如果遇到依赖问题，可以尝试清除缓存后重新安装\n   pnpm store prune\n   pnpm install\n   ```\n   \n3. **安装 Tauri CLI** \n   \n   ```bash\n   # 全局安装 Tauri CLI 工具\n   pnpm add -g @tauri-apps/cli\n   \n   # 或者使用 npx 运行（推荐）\n   npx tauri --version\n   ```\n   \n4. **安装 Rust 工具链** \n   \n   ```bash\n   # 使用官方脚本安装 Rust\n   curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh\n   \n   # 安装完成后，重启终端或运行以下命令加载环境变量\n   source $HOME/.cargo/env\n   \n   # 验证安装\n   rustc --version\n   cargo --version\n   ```\n   \n5. **安装 protoc** \n   \n   ```bash\n   # Windows (Chocolatey)\n   choco install protoc\n   \n   # macOS (Homebrew)\n   brew install protobuf\n   \n   # Ubuntu/Debian\n   sudo apt install protobuf-compiler\n   \n   # 验证安装\n   protoc --version\n   ```\n   \n6. **开发工具推荐**\n   \n   - VS Code: 推荐的代码编辑器\n   - 插件推荐：\n     - Vue Language Features (Volar)\n     - TypeScript Vue Plugin (Volar)\n     - Rust Analyzer\n     - Tauri Language Support\n     - Prettier - Code formatter\n     - ESLint\n\n\n\n## ▶️ 运行项目 \n\n### 开发模式\n\n```bash\n\n# 启动开发服务器（仅前端）\npnpm dev\n\n# 启动 Tauri 开发模式（前后端同时启动）\npnpm tauri dev\n\n# 启动开发服务器并指定环境\npnpm dev --mode development\n```\n\n### 调试模式\n\n```bash\n# 启动带调试工具的开发服务器\npnpm dev --debug\n\n# 启动 Tauri 开发模式并启用调试\npnpm tauri dev --debug\n```\n\n### 环境配置\n\n项目支持多种环境配置：\n- `.env`: 默认环境配置\n- `.env.development`: 开发环境配置\n- `.env.production`: 生产环境配置\n\n环境变量包括：\n- `VITE_API_SERVER`: 后端API服务器地址\n- `VITE_API_SERVER_WS`: WebSocket服务器地址\n- `VITE_APP_NAME`: 应用名称\n\n\n\n## 🏗️ 构建项目 \n\n### 构建前端\n\n```bash\n# 构建前端资源（开发模式）\npnpm build\n\n# 构建前端资源（生产模式）\npnpm build --mode production\n```\n\n### 构建桌面应用\n\n```bash\n# 构建 Tauri 应用（生产版本）\npnpm tauri build\n\n# 构建调试版本（用于测试）\npnpm tauri:build:debug\n\n# 构建指定平台的应用\npnpm tauri build --target x86_64-pc-windows-msvc\n```\n\n### 生成 Protocol Buffer 代码\n\n```bash\n# 生成 TypeScript 的 Protocol Buffer 代码\npnpm gen:proto:ts-protos\n```\n\n### 构建产物说明\n\n构建完成后，产物位于以下目录：\n- `dist/`: 前端构建产物\n- `src-tauri/target/release/`: Tauri 应用构建产物\n  - Windows: `.msi` 或 `.exe` 文件\n  - macOS: `.app` 或 `.dmg` 文件\n  - Linux: `.AppImage` 或 `.deb` 文件\n\n\n\n## 🧩 核心模块 \n\n### 1. 聊天系统\n\n聊天系统是 IM 客户端的核心模块，负责处理所有与消息相关的功能。\n\n#### 消息类型支持\n- 文本消息：支持富文本格式、表情、链接\n- 图片消息：支持多种格式，自动压缩优化\n- 文件消息：支持任意类型文件传输\n- 音频消息：支持语音消息录制和播放\n- 视频消息：支持录制和发送视频\n- 系统消息：系统通知和提示信息\n- 群邀请消息：群组邀请相关信息\n\n#### 核心组件\n- `src/components/Bubble/` - 各类消息气泡组件\n  - `text.vue`: 文本消息气泡\n  - `image.vue`: 图片消息气泡\n  - `file.vue`: 文件消息气泡\n  - `audio.vue`: 音频消息气泡\n  - `video.vue`: 视频消息气泡\n  - `system.vue`: 系统消息气泡\n- `src/components/Message/` - 消息容器组件\n- `src/views/message/` - 消息主界面\n  - `ChatView/`: 聊天列表视图\n  - `ContentView/`: 聊天内容视图\n\n#### 关键技术实现\n- 虚拟列表：处理大量消息的高效渲染\n- 消息缓存：提升消息加载速度\n- 实时同步：确保多设备消息同步\n- 消息存储：本地数据库持久化存储\n\n### 2. 联系人系统 \n\n联系人系统管理用户的好友关系和群组信息。\n\n#### 功能特性\n- 好友列表管理：展示所有好友，支持分组\n- 群组列表管理：展示所有加入的群组\n- 联系人搜索：支持按条件搜索联系人\n- 好友请求处理：发送和处理好友请求\n\n#### 核心组件\n- `src/views/contact/` - 联系人主界面\n  - `ContactView/`: 联系人列表视图\n  - `ContentView/`: 联系人详情视图\n- `src/components/SelectContact/` - 联系人选择器\n- `src/components/UserPopover/` - 用户信息弹窗\n\n#### 数据结构\n- Friends 表：存储好友信息\n- Groups 表：存储群组信息\n- FriendRequests 表：存储好友请求信息\n\n### 3. 音视频通话\n\n音视频通话模块基于 WebRTC 技术实现，提供高质量的实时通信功能。\n\n#### 功能特性\n- 一对一音视频通话：点对点实时通信\n- 群组音视频通话：支持多人视频会议\n- 屏幕共享：支持共享屏幕内容\n- 噪音抑制：内置噪音抑制功能\n- 录制功能：支持屏幕录制\n\n#### 核心模块\n- `src/views/call/` - 通话界面\n  - `single.vue`: 单人通话界面\n  - `group.vue`: 群组通话界面\n  - `accept.vue`: 通话邀请接受界面\n- `src/hooks/useWebRTC.ts` - WebRTC 相关 Hook\n- `src/hooks/useNoiseSuppression.ts` - 音视频噪音抑制\n\n#### 技术实现\n- WebRTC：实现点对点实时通信\n- 媒体流处理：音视频采集和播放\n- 信令服务器：协调连接建立过程\n\n### 4. 文件传输 \n\n文件传输模块支持各种类型文件的安全传输和管理。\n\n#### 功能特性\n- 文件上传下载：支持大文件分片传输\n- 文件预览：\n  - PDF 文件：内置 PDF 阅读器\n  - Word 文档：支持 .doc/.docx 格式预览\n  - Excel 表格：支持 .xls/.xlsx 格式预览\n  - MakeDown文档：支持 .md 格式预览\n- 图片预览：支持常见图片格式预览和缩放\n- 自动下载：根据设置自动下载接收的文件\n- 文件管理：支持查看和管理已接收文件\n\n#### 核心组件\n- `src/components/Bubble/file.vue` - 文件消息气泡\n- `src/components/FileUpload/` - 文件上传组件\n- `src/hooks/useFileTransfer.ts` - 文件传输 Hook\n- `src/views/preview/file.vue` - 文件预览界面\n\n#### 技术实现\n- 分片传输：大文件分片上传和下载\n- 断点续传：支持传输中断后继续\n- 进度显示：实时显示传输进度\n- 文件校验：确保文件完整性\n\n### 5. 数据库系统 \n\n数据库系统使用 SQLite 实现本地数据存储，支持高效的数据访问和查询。\n\n#### ORM 框架\n- 自研 ORM 框架，专门针对 SQLite 优化\n- FTS5 全文搜索支持，提升消息搜索性能\n- 事务处理，确保数据一致性\n- 实体映射，简化数据库操作\n\n#### 数据实体\n- `src/database/entity/Chats.ts` - 聊天会话\n- `src/database/entity/Friends.ts` - 好友关系\n- `src/database/entity/SingleMessage.ts` - 单聊消息\n- `src/database/entity/GroupMessage.ts` - 群聊消息\n- `src/database/entity/Groups.ts` - 群组信息\n\n#### 核心功能\n- 数据持久化：本地存储用户数据\n- 查询优化：索引和查询优化\n- 同步机制：与服务器数据同步\n- 备份恢复：数据备份和恢复功能\n\n### 6. 系统设置 \n\n系统设置模块允许用户自定义应用行为和界面。\n\n#### 设置模块\n- 通用设置：基本应用设置\n- 通知设置：消息通知配置\n- 快捷键设置：自定义快捷键\n- 存储管理：文件存储管理\n- 主题设置：界面主题切换\n- 个人信息：用户信息管理\n\n#### 核心组件\n- `src/views/setting/` - 设置主界面\n- `src/components/Setting/` - 各类设置组件\n  - `General.vue`: 通用设置\n  - `Notification.vue`: 通知设置\n  - `Shortcut.vue`: 快捷键设置\n  - `StorageManageDialog.vue`: 存储管理\n  - `Theme.vue`: 主题设置\n  - `Profile.vue`: 个人信息\n\n## 数据库设计 \n\nIM Client 使用 SQLite 作为本地数据库，存储用户数据和消息历史。\n\n### 核心表结构\n\n#### Chats 表\n存储聊天会话信息，包括单聊和群聊会话。\n\n#### Friends 表\n存储好友信息及相关元数据。\n\n#### SingleMessage 表\n存储单聊消息的详细信息。\n\n#### GroupMessage 表\n存储群聊消息的详细信息。\n\n### 数据库特性\n\n1. **全文搜索支持**\n   - 使用 SQLite FTS5 扩展实现消息内容分词全文搜索  \n   - 支持关键词高亮显示\n   - 支持搜索结果排序\n\n2. **事务处理**\n   - 关键操作使用事务确保数据一致性\n   - 支持批量操作的原子性\n\n3. **性能优化**\n   - 合理的索引设计提升查询性能\n   - 分页查询避免大数据量加载\n   - 缓存机制减少数据库访问\n\n\n\n## 🌐 WebSocket通信协议 \n\nIM Client 使用 WebSocket 实现实时消息推送和通信，使用谷歌Protobuf序列化协议\n\n### 消息类型枚举\n\n```typescript\nconst IMessageType = {\n  ERROR: { code: -1, description: \"信息异常\" },\n  LOGIN_OVER: { code: 900, description: \"登录过期\" },\n  REFRESHTOKEN: { code: 999, description: \"刷新token\" },\n  LOGIN: { code: 1000, description: \"登陆\" },\n  HEART_BEAT: { code: 1001, description: \"心跳\" },\n  FORCE_LOGOUT: { code: 1002, description: \"强制下线\" },\n  SINGLE_MESSAGE: { code: 1003, description: \"私聊消息\" },\n  GROUP_MESSAGE: { code: 1004, description: \"群发消息\" },\n  VIDEO_MESSAGE: { code: 1005, description: \"视频消息\" },\n  AUDIO_MESSAGE: { code: 1006, description: \"音频通话\" },\n  CREATE_GROUP: { code: 1500, description: \"创建群聊\" },\n  GROUP_INVITE: { code: 1501, description: \"群聊邀请\" },\n  ROBOT: { code: 2000, description: \"机器人\" },\n  PUBLIC: { code: 2001, description: \"公众号\" }\n};\n```\n\n### 连接流程\n\n1. **建立 WebSocket 连接**\n   - 客户端连接到 WebSocket 服务器\n   - 传递用户认证信息（用户ID、Token）\n\n2. **发送登录消息 (code: 1000)**\n   - 发送登录请求，包含用户凭证\n   - 服务器验证用户身份\n\n3. **开始心跳检测 (code: 1001)**\n   - 定时发送心跳包保持连接\n   - 检测连接状态\n\n4. **接收和发送各类消息**\n   - 实时接收新消息\n   - 发送用户操作消息\n\n### 消息格式\n\n```json\n{\n  \"code\": 1003,\n  \"data\": {\n    \"messageId\": \"uuid\",\n    \"fromId\": \"sender_id\",\n    \"toId\": \"receiver_id\",\n    \"messageType\": 1,\n    \"messageBody\": \"{\\\"text\\\":\\\"Hello World\\\"}\",\n    \"sendTime\": 1640995200000\n  }\n}\n```\n\n### 连接管理\n\n- 自动重连机制：网络断开后自动尝试重连\n- 心跳检测：定期发送心跳包维持连接\n- 连接状态监控：实时监控连接状态变化\n\n\n\n## 🌍 国际化支持 \n\nIM Client 支持多语言界面，满足国际化需求。\n\n### 多语言实现\n\n- `src/i18n/` - 国际化配置\n- `src/assets/i18n/` - 语言包文件\n- 支持中文和英文\n\n### 语言包结构\n\n```json\n{\n  \"common\": {\n    \"ok\": \"确定\",\n    \"cancel\": \"取消\"\n  },\n  \"chat\": {\n    \"send\": \"发送\",\n    \"input_placeholder\": \"请输入消息...\"\n  }\n}\n```\n\n### 实现机制\n\n1. **语言包加载**\n\n2. **文本替换**\n\n3. **语言切换**\n\n\n\n## 🎨 主题和样式 \n\nIM Client 支持浅色和深色主题，提供良好的用户体验。\n\n### 样式架构\n\n- `src/assets/style/` - 全局样式文件\n- `src/assets/style/scss/` - SCSS 样式\n- `src/assets/style/theme.scss` - 主题变量\n\n### 主题切换\n\n- 支持浅色和深色主题\n- 通过 CSS 变量实现主题切换\n- `src/hooks/useThemeColor.ts` - 主题管理 Hook\n\n### 实现机制\n\n1. **CSS 变量**\n   - 使用 CSS 自定义属性定义主题颜色\n   - 通过修改变量值切换主题\n\n2. **样式隔离**\n   - 使用 SCSS 模块化管理样式\n   - 避免样式冲突\n\n3. **动态切换**\n   - 支持运行时切换主题\n   - 记住用户主题偏好设置\n\n## 🔌插件和扩展 \n\nIM Client 使用多种插件扩展功能。\n\n### Vue 插件\n\n- `src/plugins/modules/element.ts` - Element Plus 配置\n- `src/plugins/modules/router.ts` - 路由配置\n- `src/plugins/modules/store.ts` - 状态管理配置\n\n### Tauri 插件\n\n- `@tauri-apps/plugin-dialog` - 对话框\n  - 文件选择对话框\n  - 消息提示对话框\n- `@tauri-apps/plugin-fs` - 文件系统\n  - 本地文件读写\n  - 目录操作\n- `@tauri-apps/plugin-http` - HTTP 请求\n  - 发起 HTTP 请求\n  - 文件下载\n- `@tauri-apps/plugin-sql` - 数据库操作\n  - SQLite 数据库访问\n  - 查询和更新操作\n- `@tauri-apps/plugin-store` - 本地存储\n  - 键值对存储\n  - 配置信息持久化\n- `@tauri-apps/plugin-websocket` - WebSocket 连接\n  - WebSocket 客户端\n  - 实时通信支持\n\n## 🤝 贡献指南 \n\n我们欢迎任何形式的贡献，包括但不限于代码提交、问题报告、文档改进等。\n\n### 开发流程\n\n1. Fork 项目 🍴\n   - 在 GitHub 上 Fork 本项目\n   - 克隆到本地开发环境\n\n2. 创建功能分支 🌿\n   - 为每个功能或修复创建独立分支\n   - 分支命名规范：`feature/功能名称` 或 `fix/问题描述`\n\n3. 提交代码更改 📥\n   - 遵循代码规范和提交规范\n   - 添加必要的测试用例\n   - 更新相关文档\n\n4. 发起 Pull Request 🔄\n   - 提交 PR 到主仓库\n   - 详细描述变更内容\n   - 等待代码审查\n\n### 代码规范\n\n- 遵循项目现有的代码风格\n- 添加必要的注释和文档\n- 确保通过所有测试\n- 使用 TypeScript 进行类型检查\n\n### 提交规范\n\n- 使用有意义的提交信息\n- 遵循 conventional commits 规范\n- 每个提交应该只包含一个功能或修复\n\n### 开发工具\n\n- 使用 VS Code 进行开发\n- 安装推荐的插件\n- 使用 ESLint 和 Prettier 保持代码风格一致\n\n## ❓ 常见问题 \n\n### 构建问题\n\n1. 确保 Rust 工具链正确安装\n   - 运行 `rustc --version` 验证\n   - 如果未安装，参考安装步骤\n\n2. 检查 Tauri 依赖是否完整\n   - 查看 `src-tauri/Cargo.toml` 依赖配置\n   - 运行 `cargo check` 检查依赖问题\n\n3. 确认 protoc 编译器可用\n   - 运行 `protoc --version` 验证\n   - 如果未安装，参考安装步骤\n\n### 运行问题\n\n1. 检查环境变量配置\n   - 确认 `.env` 文件配置正确\n   - 检查 API 服务器地址是否可访问\n\n2. 确认网络连接正常\n   - 检查防火墙设置\n   - 确认 WebSocket 服务器可访问\n\n3. 验证数据库权限\n   - 检查 SQLite 文件读写权限\n   - 确认数据库文件路径正确\n\n### 视频反向代理（nginx）Q\u0026A\n\n**为什么WebRTC视频通话必须使用HTTPS或localhost？**\n\n 这是浏览器的安全策略要求。WebRTC API只能在安全上下文中使用，包括：\n\n- 通过HTTPS提供的页面\n- localhost域名（用于开发环境）\n- 127.0.0.1等回环地址\n\n这是为了防止恶意网站通过WebRTC获取用户摄像头、麦克风等敏感设备权限。\n\n**nginx配置中各部分的作用是什么？**\n\n- `listen 9000`：提供HTTPS信令服务，处理WebRTC连接的信令交换\n- `listen 1980`：提供HTTP流媒体服务，处理视频流的传输\n- `/api/` 路径：访问SRS服务器的管理API接口\n- `/rtc/` 路径：处理WebRTC连接请求和信令交换\n- `/.+/.*\\.(flv|m3u8|ts|aac|mp3)$` 路径：处理流媒体文件的传输\n\n**配置中的IP地址 `192.168.31.166` 需要修改吗？**\n\n 是的，这是一个示例IP地址，您需要将其修改为实际部署SRS媒体服务器的服务器IP地址。\n\n**如何测试反向代理配置是否正确？**\n\n1. 启动nginx服务和SRS服务器\n2. 使用浏览器访问 `https://localhost:9000` 检查信令服务是否可访问\n3. 访问 `http://localhost:1980/api/v1/clients` 检查API接口是否正常\n4. 尝试建立视频通话连接，确认媒体流是否正常传输\n\n````nginx\n#user  nobody;\n\nworker_processes  1;\n\n#pid        logs/nginx.pid;\n\nevents {\n    worker_connections  1024;\n}\nhttp {\n    include       mime.types;\n    default_type  application/octet-stream;\n    sendfile      on;\n    keepalive_timeout  65;\n    \n\tserver {\n        # HTTPS 监听端口（默认 443 也可以自定义，如 9191）\n        listen 9000;\n        server_name  localhost;  # 修改为你的域名或 IP\n\t\t\n        location / {\n           proxy_pass http://192.168.31.166:9000;\n\t\t   proxy_http_version 1.1;\n           proxy_set_header Host $host;\n           proxy_set_header X-Real-IP $remote_addr;\n        }\n\t}\n\n\tserver {\n        # HTTPS 监听端口（默认 443 也可以自定义，如 9191）\n        listen 1980;\n        server_name  localhost;  # 修改为你的域名或 IP\n\n        location / {\n           proxy_pass http://192.168.31.166:8080/;\n\t\t   proxy_http_version 1.1;\n           proxy_set_header Host $host;\n           proxy_set_header X-Real-IP $remote_addr;\n        }\n\n        location ~ /.+/.*\\.(flv|m3u8|ts|aac|mp3)$ {\n           proxy_pass http://192.168.31.166:8080$request_uri;\n\t\t   proxy_http_version 1.1;\n           proxy_set_header Host $host;\n           proxy_set_header X-Real-IP $remote_addr;\n        }\n   \n        location /api/ {\n           proxy_pass http://192.168.31.166:1985/api/;\n\t\t   proxy_http_version 1.1;\n           proxy_set_header Host $host;\n           proxy_set_header X-Real-IP $remote_addr;\n        }\n        \n        location /rtc/ {\n           proxy_pass http://192.168.31.166:1985/rtc/;\n\t\t   proxy_http_version 1.1;\n           proxy_set_header Host $host;\n           proxy_set_header X-Real-IP $remote_addr;\n        }\n    } \t\n}\n````\n\n\n\n## 🤝 贡献指南\n\n我们欢迎所有形式的贡献！请查看 [CONTRIBUTING.md](CONTRIBUTING.md) 了解详情。\n\n### 贡献方式\n\n1. **Fork** 项目\n2. 创建功能分支 (`git checkout -b feature/AmazingFeature`)\n3. 提交更改 (`git commit -m 'Add some AmazingFeature'`)\n4. 推送到分支 (`git push origin feature/AmazingFeature`)\n5. 创建 **Pull Request**\n\n### 开发交流\n\n- 提交 Issue 报告问题或建议新功能\n- 加入技术交流群讨论技术细节\n\n## 📞 联系我们\n\n- **项目主页**: [https://github.com/Luckly-XYZ](https://github.com/dennis9486/Lynk)\n- **问题反馈**: [Issues](https://github.com/Luckly-XYZ/Lucky-client/issues)\n- **邮箱**: 382192293@qq.com\n\n## 💬 项目状态\n\n本项目目前处于积极维护状态，持续更新和完善功能。\n\n---\n\n## 📢 免责声明\n\n本项目仅供学习和参考使用，不得用于任何商业用途。作者不对使用本项目可能引起的任何直接或间接损失承担责任。\n\n1. 本项目是一个开源学习项目，旨在提供即时通讯技术的学习和研究参考。\n2. 项目中涉及的技术方案、代码实现仅供参考，不保证其在生产环境中的稳定性、安全性和可靠性。\n3. 用户在使用本项目时应自行承担所有风险，包括但不限于数据丢失、系统损坏、通信安全等问题。\n4. 作者不提供任何形式的技术支持和保障，也不对项目的使用效果做任何承诺和保证。\n5. 如将本项目用于商业用途，需自行承担可能的法律风险和责任。\n\n---\n\n⭐ 如果这个项目对您有帮助，请给我们一个星标！","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flucklyspace%2Flucky-client","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flucklyspace%2Flucky-client","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flucklyspace%2Flucky-client/lists"}