
一、前期准备飞书文档AI助手浏览器插件开发飞书MCP体验核心目标为复刻腾讯文档小助手核心功能文档总结、精读、思维导图、对话开发为飞书适配的浏览器插件学习飞书开放平台API调用、AI辅助写代码的方法体验飞书MCP的配置与使用了解MCP未来发展趋势。插件开发成果可用于文档类产品面试/项目参考同时熟悉飞书MCP生态。二、核心开发目标飞书文档AI助手插件功能插件为浏览器侧边栏side bar形式仅在飞书文档页面生效非飞书文档页面弹窗提示“插件不可用”核心功能与腾讯文档小助手对标包含文档内容获取调用飞书开放平台API获取飞书文档的Markdown格式内容保留超链接、表格、样式总结功能含概要快速提炼文档核心、精读详细解析文档内容、思维导图可视化文档结构三个子功能均支持流式响应对话功能以文档内容为常驻上下文支持用户任意提问、多轮对话流式返回答案权限合规仅获取用户有访问权限的飞书文档内容通过飞书APP ID/Secret鉴权非爬虫抓取飞书文档做了反爬和实时加载限制。三、前置知识与工具准备一基础工具浏览器推荐Chrome浏览器插件开发通用环境代码开发工具可选用Cursor、Cloud Code、Trae国产AI编程工具、豆包Seed Code飞书开放平台飞书开放平台用于创建应用、获取API凭证、调用云文档APIAI大模型支持API调用的大模型用于实现总结、对话、思维导图功能直播中用AI辅助生成代码实现插件核心能力终端工具任意终端用于飞书MCP的安装、配置命令执行。二核心前置知识零基础可边学边做基础的浏览器插件开发常识了解插件的侧边栏形式、manifest配置文件作用API调用基础知道“请求-返回”逻辑、TOKEN/鉴权的意义Markdown格式认知飞书新版文档为Markdown格式需了解其基本语法标题、表格、超链接AI提示词基础会写清晰的功能描述提示词让AI辅助生成代码。四、飞书文档AI助手插件开发全流程步骤1了解飞书文档的反爬限制与内容获取方式飞书文档为防止信息泄露做了反爬和实时加载限制禁止爬虫直接抓取页面内容核心限制点内容边浏览边加载页面仅渲染用户当前可见内容未滑动的部分不会在控制台显示权限管控严格无复制权限的文档手动/工具复制成本极高常规网页的内容采集方法检查/网络面板对飞书文档无效仅能通过飞书开放平台官方API获取内容。步骤2飞书开放平台API选型与调试核心关键需在飞书开放平台调用云文档相关API获取内容直播中对比了2种API最终选用获取云文档内容Markdown格式零基础学员按以下步骤操作2.1 飞书开放平台入口进入飞书开放平台-云文档API重点看服务端API客户端API为网页形式服务端API更适配插件开发。2.2 API选型对比API类型可获取内容优点缺点适用场景获取文档纯文本内容仅纯文字无格式、无表格、无超链接调用简单返回数据量小丢失关键信息链接/表格仅需文字总结的简单场景获取云文档内容Markdown格式完整Markdown内容保留标题、表格、超链接、样式信息完整适配插件的总结/对话功能仅支持飞书新版文档地址含wiki原Docs/Sheet已升级插件开发核心选用2.3 新版飞书文档识别飞书新版文档地址统一为wiki开头原Docs文档、Sheet表格、Database多维表格均已升级为wiki后缀文档ID不变识别示例旧版xxx.feishu.cn/docs/xxxxxxx新版xxx.feishu.cn/wiki/xxxxxxx2.4 API调试步骤零基础友好平台自带调试台进入获取云文档内容API页面找到API调试台飞书开放平台自带无需本地代码准备2个核心参数doc_token飞书文档的ID在文档地址栏中获取新版wiki地址后一串22~27位的字符access_token接口调用凭证后续通过飞书自建应用获取步骤3讲解配置调试参数type选markdown仅支持该格式language选0默认中文1为英文其他参数默认点击调试成功后可在返回结果中看到data.content即文档的完整Markdown内容含表格、超链接。步骤3飞书自建应用创建与鉴权凭证获取调用飞书API需要鉴权凭证APP ID/APP Secret/access_token需在飞书开放平台创建自建应用零基础按以下步骤操作全程免费非企业版也可使用3.1 创建自建应用飞书开放平台点击控制台-创建应用-自建应用填写应用名称如“飞书文档助手插件”随意选择应用图标点击创建创建后进入应用详情页可直接看到APP ID和APP Secret后续配置到插件中需妥善保存避免泄露。3.2 应用权限配置插件需要云文档的访问权限需为应用开通权限步骤应用详情页点击权限管理-云文档开通所有云文档相关权限零基础直接全选自己使用无风险权限开通后必须将应用添加到需要访问的飞书文档中打开飞书文档-分享-添加应用选择刚创建的自建应用否则应用无文档访问权限。3.3 access_token获取2种类型插件开发选tenant_access_token飞书提供2种access_token直播中因user_access_token需频繁刷新30分钟失效插件开发选用tenant_access_token应用身份一次获取长期有效对比token类型身份有效期优点缺点适用场景tenant_access_token应用身份自建应用长期有效除非应用信息修改无需刷新调用简单需为应用开通文档权限并添加到文档插件开发示例场景user_access_token用户身份飞书登录用户30分钟失效需刷新权限更高用户有权限的文档均可访问需先获取授权码5分钟有效再换token流程复杂正式商用产品3.4 tenant_access_token获取在飞书开放平台API调试台调用获取tenant_access_token接口输入APP ID和APP Secret直接调试即可获取该token为插件调用云文档API的核心凭证。步骤4用AI辅助生成插件代码零基础核心技巧零基础无需手动写大量代码通过清晰的提示词让AICloud Code/Trae/豆包Seed Code辅助生成直播中实操的提示词编写逻辑为功能交互API调用逻辑参数零基础学员直接套用以下提示词模板稍作修改即可4.1 核心提示词模板直接复制使用标注[]的部分需替换Plain Text写一个Chrome浏览器插件仅在飞书文档页面地址含[你的飞书文档域名].feishu.cn/wiki生效非该页面弹窗提示“插件不可用”插件以side bar侧边栏形式呈现核心功能如下1. 核心逻辑1从飞书文档地址栏获取doc_token22~27位字符2调用飞书tenant_access_token[你的token]调用飞书云文档API地址https://open.feishu.cn/document/server-docs/docs/drive-v1/file/raw_content参数typemarkdownlanguage0获取文档Markdown内容3以API返回的Markdown内容为上下文调用大模型API完成后续功能大模型API key[你的大模型key]2. 功能模块1对话功能以文档内容为常驻上下文支持用户任意提问、多轮对话流式响应答案2总结功能含概要、精读、思维导图三个子标签切换总结标签默认显示概要均支持流式响应① 概要快速提炼文档核心观点3-5条② 精读详细解析文档重点内容分点说明③ 思维导图将文档内容提炼为可视化思维导图用Markup开源库实现流式嵌入侧边栏3. 交互设计1插件以侧边栏形式展示顶部为“飞书文档AI助手”标题下方分“对话”和“总结”两个主标签2总结标签下嵌套“概要”“精读”“思维导图”子标签点击切换3所有功能均为流式响应边生成边显示不等待全部结果4. 配置页面提供插件配置页面支持用户输入飞书APP ID、APP Secret、大模型API key无需硬编码到代码中5. 开发要求1使用JavaScript开发代码结构清晰标注注释2兼容Chrome浏览器插件可正常导入、启用3处理API调用失败、无文档权限的异常弹窗提示用户。4.2 AI编程工具使用技巧零基础友好选用Cloud Code/Trae/豆包Seed Code国产AI编程工具对中文提示词支持更好有免费额度工具中开启coding模式编程模式将上述提示词直接粘贴AI会自动生成插件的全部代码含manifest配置文件、侧边栏页面、API调用逻辑若AI生成的代码有报错直接将报错信息粘贴给AI让AI自动修复直播中多次用此方法解决报错。步骤5插件代码的调整与修复直播实操踩坑要点AI生成的代码会存在小问题/报错零基础学员无需手动修改直接按以下方法处理直播中常见报错及解决5.1 常见报错类型ES6模块导出错误AI使用了ES6语法浏览器插件不兼容让AI将代码改为普通JavaScript语法正则表达式错误识别飞书文档地址的正则写的不规范让AI修正正则匹配含wiki的飞书文档地址CSP安全策略错误浏览器禁止插件加载外部资源让AI在manifest文件中添加CSP配置允许加载外部资源思维导图库导入错误Markup开源库导入失败让AI直接将库的代码内嵌到插件中避免外部导入配置页面入口缺失AI未开发配置页面让AI补充配置页面的代码支持用户输入APP ID/Secret/大模型key。5.2 核心修复技巧将浏览器控制台的报错信息插件的功能问题如配置按钮无反应、侧边栏不显示直接粘贴给AIAI会自动定位问题并修复代码零基础无需理解报错原理。步骤6插件的导入与测试6.1 Chrome浏览器插件导入步骤打开Chrome浏览器输入地址chrome://extensions/进入扩展程序页面开启右上角开发者模式点击加载已解压的扩展程序选择AI生成的插件代码文件夹点击确认插件即可导入插件导入后会在浏览器右上角显示图标钉住图标方便使用。6.2 插件测试打开任意飞书新版文档地址含wiki点击插件图标调出侧边栏在插件配置页面输入飞书APP ID/APP Secret/大模型API key测试核心功能点击“总结-概要”看是否能生成文档概要在对话框提问看是否能基于文档内容回答若功能无响应打开浏览器开发者工具F12-控制台复制报错信息给AI让AI修复。步骤7插件的优化与延伸可选零基础学员完成核心功能后可根据需求让AI优化插件直播中建议的延伸方向适配WPS/Notion/腾讯文档开发通用的文档助手插件增加文档翻译/内容提取提取表格/链接功能优化思维导图的样式让其更贴合腾讯文档的思维导图效果增加预设问题如“文档的核心观点是什么”“文档的结构是什么”提升使用体验。五、飞书MCP配置与体验全流程5.1 飞书MCP是什么MCP即API文档的MCP化是飞书推出的生态能力将飞书所有开放API封装为MCP工具开发者可直接在AI工具如Trae/Cursor中调用MCP无需手动编写API调用代码未来大概率会成为开放平台的主流趋势以Agent为核心的开发模式直接调用MCP即可实现功能。核心优势无需封装API直接在AI中调用飞书的所有能力创建文档、发送消息、获取通讯录等适配AI开发场景若想入职字节/飞书需重点掌握飞书MCP。5.2 飞书MCP配置步骤零基础友好全程实操飞书MCP分为云端版和本地版云端版暂未完全开放无权限可申请直播中实操本地版步骤如下步骤1准备飞书自建应用复用插件开发的应用或重新创建若已创建插件开发的自建应用直接使用若未创建按四、步骤3重新创建名称如“飞书MCP体验”为应用开通更多权限根据需求直播中开通了云文档消息通讯录权限步骤应用详情页-权限管理-全选所需权限点击保存。步骤2应用安全配置与发布重定向URL配置应用详情页-安全设置-重定向URL添加本地地址如http://localhost:3000用于用户授权获取凭证创建应用版本并发布应用详情页-版本管理-创建版本如0.0.1填写更新说明点击发布自建应用发布免审核直接生效重置密钥若APP Secret泄露如直播中展示点击重置APP Secret保证应用安全。步骤3本地安装并配置飞书MCP打开终端工具执行飞书MCP安装命令直播中使用Trae的内置终端零基础直接复制命令Plain Textnpm install larksuite/mcp-cli -g执行登录命令配置飞书自建应用的APP ID和APP SecretPlain Textlark-mcp login --app-id [你的APP ID] --app-secret [你的APP Secret]执行后会弹出飞书授权页面扫码授权授权成功后本地MCP即配置完成。步骤4在AI工具中调用飞书MCP直播中使用Trae调用飞书MCP步骤打开Trae进入MCP配置页面添加飞书MCP工具选择需要调用的MCP能力如创建飞书文档、发送飞书消息、获取文档内容在Trae的对话框中输入指令如“创建一个飞书文档保存插件开发的总结内容”AI会自动调用飞书MCP实现功能。5.3 飞书MCP实操踩坑要点零基础重点注意权限问题调用MCP的某功能时若提示“无权限”需回到飞书开放平台为自建应用开通对应权限并重新创建版本发布权限开通后必须发布新版本才生效文档创建问题MCP创建飞书文档后仅生成文档ID未自动写入内容需让AI补充“将内容写入创建的文档”的指令身份问题MCP默认以应用身份创建文档普通用户无访问权限需将应用添加到文档中或改用用户身份user_access_token工具调用错误AI会错误调用MCP工具如创建多维表格而非文档需明确指令如“使用document相关MCP工具创建飞书文档docx”。5.4 飞书MCP的核心能力与延伸飞书MCP已封装飞书所有开放API核心能力包括云文档创建/编辑/获取文档、表格、多维表格内容消息发送单聊/群聊消息、批量发消息、撤回消息通讯录获取部门/用户信息、组织架构工作台调用飞书工作台的应用能力。零基础学员可尝试用MCP实现简单功能如“给飞书群发送一条插件开发的通知消息”“获取某文档的内容并总结”熟悉MCP的调用逻辑。六、零基础学习关键技巧与注意事项6.1 核心技巧零基础高效上手AI辅助开发为主无需手动写代码重点练提示词编写能力功能描述越清晰AI生成的代码越准确报错直接甩给AI浏览器/终端的报错信息直接粘贴给AI让AI自动修复无需理解报错原理复用飞书自建应用插件开发和MCP体验可复用同一个自建应用减少重复配置优先使用调试台飞书开放平台的API调试台可直接测试接口无需本地代码零基础先在调试台验证API可用再让AI开发。6.2 重要注意事项凭证安全飞书APP ID/APP Secret、大模型API key、access_token为核心凭证切勿泄露若泄露立即重置飞书文档版本插件开发的API仅支持新版飞书文档地址含wiki旧版文档需先升级AI工具选择国产AI编程工具Cloud Code/Trae/豆包Seed Code对中文提示词支持更好零基础优先选用开发者模式Chrome浏览器导入插件时必须开启开发者模式否则无法加载解压的扩展程序流式响应插件的所有功能均要求流式响应提示词中必须明确标注否则AI生成的代码为“等待全部结果后显示”体验差。七、学习延伸与后续规划插件优化将插件适配为WPS/Notion/腾讯文档的通用版本丰富功能翻译、内容提取、批量处理MCP深入学习尝试用飞书MCP开发简单的Agent应用如“飞书文档智能助手”自动总结新创建的文档文档类产品拆解按直播原计划拆解腾讯文档/WPS/Notion的核心功能锻炼产品思维为文档类产品面试做准备个人知识库开发直播中提到的进阶项目将插件升级为个人知识库支持多文档整合、检索、总结适合有一定基础后学习预计12月后讲解。八、问题解决与答疑常见问题1飞书开放平台创建应用后无云文档权限选项答进入应用详情页点击权限管理-添加权限在云文档分类下全选权限点击保存即可。常见问题2AI生成的插件导入后侧边栏不显示答1. 检查飞书文档是否为新版含wiki2. 打开浏览器控制台F12复制报错信息给AI让AI修复3. 确认插件的manifest文件中匹配的飞书文档地址正确。常见问题3调用飞书API时提示“access_token无效”答1. 检查access_token是否为tenant_access_token2. 确认自建应用已添加到飞书文档中3. 重新调用“获取tenant_access_token”接口获取新的token。常见问题4飞书MCP配置后无法创建文档答1. 检查应用是否开通云文档-创建文档权限并发布了新版本2. 确认指令中明确“使用document相关MCP工具”3. 授权后重新执行login命令刷新MCP配置。常见问题5零基础没有编程基础能学会吗答可以本次开发全程AI辅助写代码零基础仅需掌握提示词编写和步骤执行无需手动写代码重点练“把功能说清楚”的能力即可。九、配套资源飞书开放平台官网https://open.feishu.cn/飞书云文档API文档https://open.feishu.cn/document/server-docs/docs/drive-v1/飞书MCP官方文档https://open.feishu.cn/document/server-docs/docs/mcp/Markup思维导图开源库直播中提及的开源库可直接让AI内嵌到插件中无需手动下载。