1. 从 Language Server 到 InlineCompletionItemProviderAI 补全链路到底该谁管VS Code 插件里做 AI 代码提示最容易踩的坑不是模型效果而是职责没分清。我见过不少项目把补全逻辑全塞进InlineCompletionItemProvider结果 LSP 那边也在发CompletionItem两边抢着往编辑器里塞内容用户看到的就是候选列表里既有静态片段又有模型生成顺序还乱。这一篇接着上篇的 LSP 补全思路往下走重点解决一件事把模型请求收敛到统一 Key/API 通道让插件里不再散落多家密钥。先说清楚两个角色的边界。Language Server 负责的是语言层面的补全语法结构、符号表、静态片段、诊断信息。它的connection.onCompletion返回的是CompletionItem[]走的是 VS Code 原生补全 UI触发时机由triggerCharacters和用户输入决定。而InlineCompletionItemProvider是 VS Code 1.68 之后引入的 API专门给灰色幽灵文本用的它的provideInlineCompletionItems返回InlineCompletionItem渲染在光标后方按 Tab 接受。两者不是替代关系是分工关系。我的做法是静态片段、导入补全、React Hooks 模板这类确定性内容继续留在 LSP 的onCompletion里模型生成的、需要看上下文的、跨行甚至跨文件的补全走InlineCompletionItemProvider。这样职责清晰调试的时候也容易定位——候选列表不对就查 LSP幽灵文本不对就查 Inline Provider。那模型请求放哪答案是抽一个独立的AiClient模块插件里所有需要调模型的地方都走它。这个模块只认三个东西Base URL、API Key、Model ID。Base URL 指向 TaoToken 的 API 地址https://taotoken.net/apiKey 从配置里读Model ID 按场景选。这样做的直接好处是换模型、换通道、加限流、加缓存都只改一个文件不用满项目搜apiKey。为什么强调统一 Key因为插件开发里密钥泄露是真实风险。如果你在package.json的contributes.configuration里让用户填 Key那还好但如果你在代码里硬编码或者每个 Provider 各读各的环境变量一旦插件发布反编译就能拿到。统一到一个模块至少能保证读取路径唯一方便做加密存储和权限校验。TaoToken 这边的好处是它本身就是一个聚合入口你不需要在插件里维护OpenAI 一个 Key、Claude 一个 Key、国产模型一个 Key的映射表一个 Key 走通模型切换只改 Model ID。再补一个工程上的点InlineCompletionItemProvider的调用频率很高用户每敲一个字符都可能触发。如果你在里面直接fetch模型网络抖动和 token 消耗都会失控。所以AiClient里必须做三件事防抖debounce、取消AbortController、缓存相同前缀不重复请求。这三件事和 Key 统一是正交的但只有 Key 统一了你才能在一个地方统一加这些策略。这一节的核心结论就一句LSP 管静态Inline Provider 管生成AiClient 管通道。三者解耦插件才可维护。下面进入具体配置。2. TaoToken 前置Base URL、API Key 与 Model ID 三件套怎么备齐在写代码之前先把通道准备好。TaoToken 的定位是统一模型入口你不需要分别去各家申请 Key只需要一个账号拿到一个 Key然后在请求里指定 Model ID 就行。官网入口是https://taotoken.net/?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content注册登录后进控制台。第一步拿 API Key。进控制台后找 API Keys 页面路径是https://taotoken.net/console/api-keys带上归因参数就是https://taotoken.net/console/api-keys?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content。新建一个 Key复制出来。注意这个 Key 只在创建时完整显示一次后面只能看到前缀所以先存到安全的地方。如果你只是本地插件调试可以先用环境变量存别写进代码。第二步确认 Base URL。TaoToken 的 API 根地址是https://taotoken.net/api注意这个地址不加 UTM 参数它是给程序调用的。你的插件里所有请求都拼在这个地址后面。比如对话补全的路径是/v1/chat/completions那完整 URL 就是https://taotoken.net/api/v1/chat/completions。如果你的插件用的是 OpenAI SDK那baseURL就填https://taotoken.net/api/v1SDK 会自动拼后面的路径。第三步选 Model ID。这一步很多人会卡住因为不知道有哪些模型可用。你可以进模型对话页面https://taotoken.net/chat?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content先手动试几个模型看看哪个响应速度和代码质量符合你的预期。代码补全场景我一般选响应快的因为用户等不了代码分析场景可以选推理强一点的。Model ID 的格式通常是厂商/模型名具体以控制台或文档里列的为准。文档入口是https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content。如果你打算长期做编码类插件或者要接 Agent 工作流可以看一下 Coding Plan 页面https://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content它针对编码场景有专门的通道和额度设计比按量调用更适合高频补全。三件套备齐后先在终端验证一下通道通不通。用 curl 发一个最小请求curl https://taotoken.net/api/v1/chat/completions \ -H Content-Type: application/json \ -H Authorization: Bearer $TAOTOKEN_API_KEY \ -d { model: 你的ModelID, messages: [{role: user, content: 用一行代码实现数组去重}], max_tokens: 64 }如果返回里有choices[0].message.content说明通道没问题。如果返回 401检查 Key 有没有复制全、有没有多余空格如果返回 404检查 Base URL 有没有拼错注意/api后面要跟/v1。这一步过了再进插件代码能省很多调试时间。3. 可复制配置package.json 贡献点与 AiClient 请求封装这一节给可直接粘贴的配置。先看package.json里需要声明的贡献点。AI 补全插件通常需要三个配置项API Key、Base URL、Model ID。把它们放到contributes.configuration里用户可以在设置里改也方便你做多环境切换。{ contributes: { configuration: { title: AI Code Completion, properties: { aiCompletion.apiKey: { type: string, default: , description: TaoToken API Key从控制台 API Keys 页面获取, markdownDescription: 在 [API Keys](https://taotoken.net/console/api-keys?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content) 页面创建 }, aiCompletion.baseUrl: { type: string, default: https://taotoken.net/api/v1, description: TaoToken API 根地址 }, aiCompletion.modelId: { type: string, default: 你的默认ModelID, description: 补全使用的模型 ID }, aiCompletion.enableInline: { type: boolean, default: true, description: 是否启用内联幽灵文本补全 } } }, commands: [ { command: aiCompletion.testConnection, title: AI Completion: 测试通道连通性 } ] } }注意baseUrl默认值我写的是https://taotoken.net/api/v1因为后面用 OpenAI SDK 风格调用时SDK 会在这个基础上拼/chat/completions。如果你手写 fetch那就填https://taotoken.net/api然后自己拼/v1/chat/completions。两种都行关键是别重复拼/v1。接下来是AiClient的封装。这个文件是整个插件的模型出口所有请求都从这里走。我用 TypeScript 写核心是三个方法complete做一次性补全stream做流式可选abort取消进行中的请求。import * as vscode from vscode; export interface AiCompletionRequest { prefix: string; suffix: string; languageId: string; maxTokens?: number; } export class AiClient { private abortController: AbortController | null null; private getConfig() { const cfg vscode.workspace.getConfiguration(aiCompletion); return { apiKey: cfg.getstring(apiKey, ), baseUrl: cfg.getstring(baseUrl, https://taotoken.net/api/v1), modelId: cfg.getstring(modelId, ), }; } async complete(req: AiCompletionRequest): Promisestring { const { apiKey, baseUrl, modelId } this.getConfig(); if (!apiKey) { throw new Error(未配置 aiCompletion.apiKey请在设置中填写); } if (!modelId) { throw new Error(未配置 aiCompletion.modelId); } this.abortController?.abort(); this.abortController new AbortController(); const body { model: modelId, messages: [ { role: system, content: 你是代码补全引擎。根据用户提供的前缀和后缀只输出需要插入的代码不要解释不要 markdown 代码块。语言${req.languageId}, }, { role: user, content: 前缀\n${req.prefix}\n\n后缀\n${req.suffix}, }, ], max_tokens: req.maxTokens ?? 128, temperature: 0.2, stream: false, }; const resp await fetch(${baseUrl}/chat/completions, { method: POST, headers: { Content-Type: application/json, Authorization: Bearer ${apiKey}, }, body: JSON.stringify(body), signal: this.abortController.signal, }); if (!resp.ok) { const text await resp.text(); throw new Error(TaoToken 请求失败 ${resp.status}: ${text}); } const data await resp.json(); const content data?.choices?.[0]?.message?.content ?? ; return content.trim(); } abort() { this.abortController?.abort(); this.abortController null; } }这段代码有几个细节值得说。第一abortController是实例级的每次新请求先取消上一个避免旧响应覆盖新结果。第二system prompt 里明确要求只输出代码否则模型容易返回解释文字插到编辑器里就乱了。第三temperature设 0.2补全场景要稳定不要发散。第四错误信息里带上状态码和响应体方便排查 401 和 404。然后是InlineCompletionItemProvider的注册。这个 Provider 负责把AiClient的结果转成 VS Code 能渲染的幽灵文本。import * as vscode from vscode; import { AiClient } from ./aiClient; export class AiInlineProvider implements vscode.InlineCompletionItemProvider { private client new AiClient(); private debounceTimer: NodeJS.Timeout | null null; async provideInlineCompletionItems( document: vscode.TextDocument, position: vscode.Position, context: vscode.InlineCompletionContext, token: vscode.CancellationToken ): Promisevscode.InlineCompletionItem[] { const cfg vscode.workspace.getConfiguration(aiCompletion); if (!cfg.getboolean(enableInline, true)) { return []; } const prefix document.getText( new vscode.Range(new vscode.Position(0, 0), position) ); const suffix document.getText( new vscode.Range(position, document.positionAt(document.getText().length)) ); if (prefix.trim().length 3) { return []; } try { const text await this.client.complete({ prefix: prefix.slice(-2000), suffix: suffix.slice(0, 1000), languageId: document.languageId, }); if (!text || token.isCancellationRequested) { return []; } return [ new vscode.InlineCompletionItem( text, new vscode.Range(position, position) ), ]; } catch (err) { console.error([AI Completion], err); return []; } } }注册的时候在activate里绑定export function activate(context: vscode.ExtensionContext) { const provider new AiInlineProvider(); context.subscriptions.push( vscode.languages.registerInlineCompletionItemProvider( { pattern: ** }, provider ) ); context.subscriptions.push( vscode.commands.registerCommand(aiCompletion.testConnection, async () { const client new AiClient(); try { const out await client.complete({ prefix: function add(a, b) {, suffix: \n}, languageId: javascript, }); vscode.window.showInformationMessage(通道正常返回${out.slice(0, 50)}); } catch (e: any) { vscode.window.showErrorMessage(通道异常${e.message}); } }) ); }这里{ pattern: ** }表示对所有文件生效你也可以按语言过滤比如只对typescript和javascript开。prefix.slice(-2000)是防止上下文过长补全场景不需要整个文件取光标前 2000 字符足够。suffix.slice(0, 1000)同理。如果你用的是 Claude Code 或者类似的 Agent 工具做插件开发辅助配置方式略有不同需要写settings.json或者auth.json。以 Claude Code 为例它的配置里需要指定ANTHROPIC_BASE_URL和ANTHROPIC_API_KEYBase URL 同样指向 TaoToken 的 API 地址Key 用同一个。具体路径参考文档https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content。Codex 的话是auth.json里面填base_url和api_keyModel ID 在请求时指定。不管哪种工具三件套的逻辑是一样的Base URL 指向https://taotoken.net/apiKey 用控制台拿的那个Model ID 按场景选。4. 验证请求从补全触发到结果渲染的完整闭环配置写完怎么确认它真的跑通了我一般分三步验证命令测试、内联触发、日志观察。第一步用命令测试通道。按CtrlShiftP打开命令面板输入AI Completion: 测试通道连通性回车。如果配置正确右下角会弹出通道正常返回...。如果弹通道异常未配置 aiCompletion.apiKey就去设置里搜aiCompletion.apiKey填上。如果弹 401说明 Key 不对弹 404说明 Base URL 拼错了。这一步把通道问题和插件逻辑问题分开非常关键。第二步触发内联补全。新建一个.ts文件输入function debounce(fn, delay) { }把光标放在空行停一下。如果一切正常你会看到灰色的幽灵文本出现比如let timer null; return function(...args) { clearTimeout(timer); timer setTimeout(() fn.apply(this, args), delay); }。按 Tab 接受文本变成实色插入。如果没出现先检查enableInline是不是 false再检查prefix.trim().length 3这个门槛——你输入的内容太短它不触发。第三步看日志。VS Code 的输出面板里选扩展宿主或者你插件自己的 OutputChannel。我在AiClient里用console.error打错误正常请求不打日志避免刷屏。如果你想看每次请求的耗时和 token 数可以在complete方法里加console.log但记得发布前去掉或者改成可配置的 debug 开关。验证的时候有个细节InlineCompletionItem的 range 我传的是new vscode.Range(position, position)表示在光标处插入。如果你想让幽灵文本替换掉当前行的一部分range 的 start 和 end 要相应调整。上篇 excerpt 里提到的completeConfigList就是在做这件事——根据textDocPosition动态算 range。内联补全这边同理如果你发现幽灵文本位置不对先查 range。还有一个常见现象幽灵文本出现了但按 Tab 没反应。这通常是因为InlineCompletionItem没有设置command或者和别的快捷键冲突。VS Code 默认 Tab 接受内联补全但如果你装了其他补全插件比如 Copilot、Tabnine它们可能抢了 Tab。排查方法是禁用其他补全插件再试。这也是为什么我建议在插件里加一个enableInline开关方便用户做冲突隔离。如果你想更直观地看请求内容可以在AiClient里加一个可选的 debug 模式把body打到 OutputChannel。但注意别把 API Key 打出来。我一般只打model、prefix长度、suffix长度、响应耗时这四个字段足够定位问题。验证通过后你可以进一步测边界情况空文件、超长文件、非代码文件比如 markdown、多光标。这些场景下 Provider 应该优雅返回空数组而不是抛异常。我在provideInlineCompletionItems里用 try/catch 包住catch 里返回[]保证插件不会因为一次请求失败就崩掉。5. 本篇常见错排查401、local proxy failed、reading choices、OAuth这一节列几个真实会遇到的报错以及对应的排查路径。这些错我都踩过按顺序查基本能解决。401 Unauthorized。这是最常见的。原因通常有三个Key 没填、Key 填错、Key 前面多了Bearer又重复加了。检查aiCompletion.apiKey的值确保是纯 Key不带前缀。代码里Authorization: Bearer ${apiKey}已经加了Bearer所以配置里不要再加。另外注意 Key 有没有过期或者被删除去控制台https://taotoken.net/console/api-keys?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content确认一下。local proxy failed。这个报错通常出现在你本地开了代理工具但代理规则没覆盖taotoken.net或者代理进程挂了。先检查系统代理设置确认taotoken.net走直连或者走正确的规则。如果你在插件里用了fetchNode 环境下的fetch会读环境变量HTTP_PROXY/HTTPS_PROXY检查这两个变量有没有指向一个不可用的地址。最简排查在终端curl https://taotoken.net/api/v1/chat/completions看通不通如果 curl 通但插件不通那就是插件进程的环境变量问题。reading choices。这个报错是data.choices为 undefined 时访问[0]导致的。根因是响应结构和你预期的不一样。可能情况请求返回了错误对象比如{ error: { message: ... } }但你的代码直接读choices。修复方法是在读choices前先判断if (!data || !Array.isArray(data.choices) || data.choices.length 0) { throw new Error(响应结构异常${JSON.stringify(data).slice(0, 200)}); }这样报错信息会告诉你实际返回了什么而不是一个模糊的reading choices。另外检查 Model ID 是否正确有些模型名拼错会返回错误对象而不是补全结果。OAuth 相关报错。如果你用的是 Claude Code 或者 Codex 这类工具它们可能默认走 OAuth 登录而不是 API Key。报错里出现OAuth、token exchange failed、invalid_grant这类字样说明它在尝试走账号授权流程。解决办法是切到 API Key 模式。Claude Code 里设置ANTHROPIC_API_KEY环境变量并且确保ANTHROPIC_BASE_URL指向https://taotoken.net/api。Codex 里改auth.json把api_key字段填上去掉 OAuth 相关的 token 字段。具体配置参考文档https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content。补全不触发。不是报错但很常见。排查顺序enableInline是否为 trueprefix.trim().length是否小于 3当前文件语言是否被registerInlineCompletionItemProvider的 pattern 排除是否有其他补全插件抢了 TabprovideInlineCompletionItems是否被 VS Code 调用了加日志确认。我遇到过一种情况是document.getText()在超大文件上耗时过长导致 Provider 超时返回空。解决办法是限制 prefix 和 suffix 的长度别对整个文件做getText。请求超时。补全场景对延迟敏感如果模型响应超过 2 秒用户体验就很差。可以在AiClient里加AbortSignal.timeout(3000)超时直接返回空让用户继续打字。同时检查 Model ID 是不是选了一个推理型的大模型补全场景应该选轻量快速的。如果经常超时考虑换模型或者上 Coding Plan 的专用通道。Key 泄露风险。如果你把 Key 写在了package.json的 default 值里发布后所有人都能看到。正确做法是 default 留空让用户自己填。如果你要做团队共享配置用 VS Code 的settings.json同步或者环境变量别硬编码。TaoToken 的 Key 可以在控制台随时吊销重建万一泄露了第一时间去https://taotoken.net/console/api-keys?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content删掉旧的。6. 把补全链路收口到统一通道之后走到这里你的插件应该已经能跑通触发补全 → 请求 TaoToken → 渲染幽灵文本 → Tab 接受这个闭环了。回头看最值得坚持的设计决策就是那个AiClient收口。它让插件里所有模型请求只有一个出口Key 只读一处Base URL 只配一处Model ID 只改一处。后面你要加缓存、加限流、加多模型路由、加请求日志都在这一个文件里做不会牵一发动全身。如果你还想继续往下做有几个方向可以试。一是把AiClient的complete改成流式用 SSE 逐 token 返回幽灵文本边生成边渲染体验会更接近 Copilot。二是加一个简单的 LRU 缓存key 用prefix suffix的哈希相同上下文不重复请求省 token 也省延迟。三是把代码分析也接进来比如用同一个通道做解释选中代码或者生成单元测试命令注册和AiClient复用不用再配一套 Key。通道这边如果你只是偶尔调试用 API Keys 页面拿的 Key 就够如果要做长期编码插件或者 Agent 工作流Coding Plan 的额度模型更适合高频调用。模型对话页面可以用来快速试模型找到适合补全的那个 Model ID 再写进配置。文档里有各语言的调用示例和错误码说明遇到不确定的路径先去文档确认比在代码里猜快得多。最后留一个我自己的习惯每次改完AiClient或者 Provider先跑一遍测试通道连通性命令再手动触发一次补全最后看 OutputChannel 有没有异常。这三步花不了一分钟但能挡住大部分低级错误。插件开发里可观测性比功能多更重要——你能看到请求发出去、响应回来、文本渲染出来才敢说这条链路是通的。