打造一个以隐私为核心的本地会议助手！

打造一个私密的AI会议助手，你也能做到！

在这个信息如洪水般涌来的时代，我们早已习惯把数据存储在云端。

不过，作为一名开发者，面对一些敏感资料，比如会议记录和私人语音笔记的时候，我总是心里有点儿不安：

你可能感兴趣：难以置信！百度文心快码推出无障碍版本，助力视障IT从业者轻松提升工作效率！

到底有没有办法开发出一个完全离线、能够在浏览器上运行且永久免费使用的AI会议助手呢？

面对复杂的技术，比如WebAssembly、模型量化还有多线程调度，对我这个非专业开发者来说，通常得花上几周时间去啃那些技术文档。

不过这次，在文心快码（Comate）的帮助下，我仅用两个小时就搞定了这个会议助手的全栈开发。

00｜项目背景：开发一个注重隐私的会议助手

市面上的会议记录软件虽然很不错，但它们有两个致命的缺陷：

• 隐私问题：数据必须上传到云端，这对公司机密和个人隐私来说，始终是个风险。

• 依赖网络：在高铁、飞机或者网络不好的地方，这些工具根本就无法使用。

因此，我想基于开源社区最热门的Whisper（语音识别）技术和一个可以本地部署的大语言模型，开发一个纯前端、零服务端、完全离线的Web应用。我的要求是：

• 隐私绝对安全：断网也能使用，数据不会外泄。

• 零成本：不花钱买Token，也不需要服务器。

• 体验流畅：不能因为模型运行而让浏览器卡顿。

我对WebAssembly不太了解，也没有做过模型量化。如果单靠自己手动配置，光是环境搭建就让我想退缩。所以，我把这个难题抛给了我的AI助手——文心快码（Comate）。

01｜架构设计

我没有急着写代码，而是先把我的想法告诉了Plan智能体。

只需点击对话窗口左下角，就能切换不同的子智能体⬆️

接着，我用自然语言表达了我的需求。

我想开发一个完全离线的AI会议助手，请给我一个可行的技术方案。

Plan智能体迅速变身为架构师，在一分钟内就为我提供了一份详尽的技术选型和可行性分析：

⬆️这份文档清晰地规划了：

• 核心引擎：建议使用Transformers.js，这是Hugging Face的JS版本，可以在浏览器端运行Whisper。

• 架构建议：为了防止AI推理阻塞主线程，必须使用Web Worker来实现多线程隔离。

• 模型选择：建议从whisper-tiny开始，验证流程后，再升级为whisper-small以提升中文的准确率。

这份报告让我省下了至少三天的调研和学习时间，瞬间理清了思路：这个项目可行，且步骤很明确。

02｜产品开发与功能迭代

我和Comate进行了五次互动，迭代出了三个版本。

🐒 初始版本：能运行，但“胡言乱语”

万事开头难，第一步是让浏览器“听懂”人类的语言。为了追求速度，我们使用了whisper-tiny模型。

请帮我搭建项目框架。我需要一个Web Worker脚本来独立运行whisper-tiny模型，主界面负责上传音频。Whisper模型对音频采样率的要求非常高，必须处理好。

Zulu智能体迅速生成了worker.js的核心逻辑，并特别实现了单例模式，防止因重复点击导致内存溢出。

在处理音频采样率这个“大坑”时，Comate自动编写了一段基于OfflineAudioContext的重采样代码，可以将任意格式的音频（MP3/M4A）强制转换为模型所需的16000Hz。

第一次运行时，我遇到了经典的“UI假死”问题，进度条也没动。

我直接用简单的语言向Code Review智能体提问：

界面没反应，控制台显示Cannot read properties of null该怎么办？

Code Review立刻发现问题，是因为我在更新状态时，不小心覆盖了进度条的DOM节点。它马上给出了修复方案，把文字和进度条的DOM结构分开。

whisper-tiny能够正常工作后，我让Zulu把模型升级为whisper-small，显著提高了中文转录的准确性。

到此为止，我的应用已经能把声音转成文字，虽然只是一大段纯文本。

🤯交互重构：实现音文同步

看到屏幕上密密麻麻的文字，我开始有了更高的期待。

现在的纯文本太难阅读了。我希望实现以下效果：

文字要按时间戳分段显示。

点击某一段文字，音频自动跳到对应位置播放。

播放时，文字要高亮跟随。

Comate重新设计了worker.js的返回数据结构，开启了return_timestamps: true选项，不仅返回文字，还返回了每句的[开始时间, 结束时间]。

接着，它重写了前端的渲染逻辑，生成了一个包含点击事件的列表。当我再次运行项目，上传一段测试录音时，看着文字随着声音逐行高亮，那种专业产品的质感立刻就显现出来了。

此外，针对“中英文混杂”的问题，Comate还建议我在代码中增加语言锁定的逻辑，防止模型误把中文翻译成英文。

使用体验如文章内视频所示👉https://mp.weixin.qq.com/s/jjuWFmMG0IJR3M8x-JPdqg

🔽小贴士：想让Comate帮你逐步讲解代码的含义，可以点击“代码解释”功能哦。

🤩注入灵魂：连接本地AI大脑

最后，我希望这个工具不仅能“听”，还能“思考”。

让AI助力你的项目！

我最近有个想法，想引入一个本地的大语言模型，来帮我自动整理会议记录和待办事项。其实，我希望这个模型中文能力要不错，而且使用的时候能按需加载，别一开始就占用几百兆的空间。

在这个过程中，Comate给我带来了全方位的提升：

1. 双模型调度：Comate对后台架构进行了调整，实现了听觉模型和大语言模型的独立加载，这样就不会影响性能。

2. Prompt 工程：它甚至为我内置了一套提示语，比如：“你是一个专业的会议秘书，请提取摘要和待办事项…”，即使是小模型也能给出很棒的结果。

3. 体验优化：为了避免因为大模型文件过大而导致进度条显示错误，Comate编写了防御性代码，还设计了一个优雅的“🧠 启用 AI 大脑”开关，让使用体验更加顺畅。

为了检验效果，我上传了一段开源的搞笑音频，没想到它竟然认真地为我总结出了“待办事项：了解景点背景”，而且通过正则清洗技术，完美去掉了输出中的乱码标签。

✨最后，大家一起来看看这个0代码、0设计稿、1小时内完成的小程序，效果到底如何：

🔗实测效果，请点击以下链接体验：https://chen-chen429.github.io/local-whisper-note/

03｜总结与思考

当我点击GitHub Pages的部署按钮时，我恍惚意识到：开发者的门槛正在发生变化。

在这个项目中，文心快码（Comate）不仅是个代码补全工具，它实际上扮演了多重角色：

• 产品经理：帮我理清“离线隐私”的产品方向。

• 架构师：设计了Web Worker的多线程架构。

• 资深前端：解决了AudioContext重采样和DOM操作的一些难题。

• AI工程师：搞定了模型量化加载和Prompt清洗的问题。

通过与Comate的深入合作，我把原本需要一周的调研和开发的“硬核技术需求”，压缩到了2小时的实际操作。

对开发者来说，我们不再需要精通每个领域的细节（比如WASM的内存管理），只需要有清晰的逻辑和准确的表达就够了。

未来，随着WebGPU算力的不断提升，这个网页完全有潜力进化成更强大的“第二大脑”——它不仅能支持实时声纹识别（区分说话者），甚至还能引入本地向量数据库，让用户随时和过去一年的会议记录进行对话……而这一切，依然无需上传任何数据到云端。

借助Comate的帮助，释放你的创造力，从此刻开始吧。

👇 别犹豫，快来实践你的创意！

一键下载Comate，把你的想法变成现实。

点我跳转：https://comate.baidu.com/zh/download

方式一：下载Comate AI IDE，享受流畅的开发体验。

方式二：在VS Code或Jetbrains IDE中搜索“文心快码”插件，直接安装使用。

如果你也有一个想实现的创意，

不妨下载文心快码，

让它成为你的“专属工程师”！

说不定，下一个热门应用就会在你的一次尝试中诞生～