我要投稿

打造自定义专属 DeepSeek 助手，只需一杯咖啡的时间：Cursor 和 Chrome 扩展开发实践

发布日期：2025-02-09 05:33:04 浏览次数： 2339 作者：AI 启蒙小伙伴

为什么大家需要浏览器扩展？

日常使用 DeepSeek/ChatGPT 等 AI 助手时，除了常规的问答和文档解析需求，经常还会有总结网页、针对网页中内容问答等需求，比如快速读取新闻、博客等，这时 Chrome 的浏览器扩展是一个很好的选择，它能直接获取网页的内容，还能和浏览器在一个界面里很直观的互动，很适合大家日常办公和生活中使用。

我可以做一个自己专属的浏览器扩展吗？

当然可以！AI 编程助手的发展，让 AI 应用开发不再专属于程序员，每个人都能开发专属自己的 AI 应用！

今天咱们用到的 AI 编程助手是 Cursor（https://cursor.com/）

1. 下载安装完成后，先打开一个文件夹，作为后面程序文件默认可以存放的目录。打开后按 cmd/win + L 键打开右侧的 AI 助手窗口，有 CHAT 和 COMPOSER 两种模式，其中 COMPOSER 具备 Agent 能力，在上下文选择等方面有自主判断，对于初学者来说，可以先从 CHAT 模式开始，它和 AI 助手的使用方式很接近。

2. 对于 Chrome 扩展来说，创建的 Prompt 也很简单，我提供一个最简单的示例，大家可以根据自己的需要定义“请为我创建一个 Chrome 扩展，它固定在浏览器右侧，具备总结网页内容和追问的能力。”

3. 输入 Prompt，可以选择自己想要的 LLM，可以选择 Deepseek-r1，或 GPT、Claude 等模型，实现这个简单的扩展都没问题。（备注：这里甚至可以免费用 DeepSeek R1 等模型做非开发类的问答）选择后让 AI 助手开始工作，对 Chrome 扩展的场景，会生成这样的文件结构

your-extension-folder/├── manifest.json├── popup.html└── popup.js

4. 每个文件都生成了对应的内容，创建对应文件拷贝内容就可以了（如果大家对 Cursor 熟悉了，使用 COMPOSER 模式可以自行创建文件目录，连手动拷贝内容都可以省略）

5. 默认生成的程序可以直接运行吗？不行，因为 AI 需要模型对应的 API Key 才能使用，对国内用户来说，申请国内 AI 模型更容易，比如 DeepSeek、Kimi、Doubao、GLM 等，大家可以到对应官网的开发者平台申请，目前这几个都有免费的 API Key 可以用。

- DeepSeek-R1: 开工了，DeepSeek 还没恢复！给大家推荐几个可以用 DeepSeek 的薅羊毛渠道 ??

- Kimi: https://platform.moonshot.cn/

- Doubao: https://www.volcengine.com/product/doubao/

- GLM: https://bigmodel.cn/

6. 申请到 API Key 后，不知道怎么编写调用代码怎么办，没关系，继续让 Cursor 完成就好，只需要把对应开发者平台的调用示例代码贴给 Cursor，让它替换刚刚生成的 AI 模型调用代码，再把 API Key 对应替换进去就可以了，下面是 DeepSeek R1 的 Node.JS 接入示例，可以输入 Cursor，告诉它用 Javascript 语言在刚刚的文件中修改调整。

// Please install OpenAI SDK first: `npm install openai`
import OpenAI from "openai";
const openai = new OpenAI({        baseURL: 'https://api.deepseek.com',        apiKey: '<DeepSeek API Key>'});
async function main() {  const completion = await openai.chat.completions.create({    messages: [{ role: "system", content: "You are a helpful assistant." }],    model: "deepseek-chat",  });
  console.log(completion.choices[0].message.content);}
main();