### 前言

时间过得真快，转眼间我已经工作了半年多。悠闲自在的生活一去不复返了，忙碌的时间变得捉襟见肘，时不时感到一丝焦虑。

身为一名程序员，为了保持技术的敏感度以及对日常事物的了解，文章阅读是必不可少的。如何快速筛选优质内容并高效阅读，成为这段时间我难以忘怀的心病。

起初我尝试自我勉励，提高工作效率，这样可以实现早下班，抽时间学习。但是作为一个AI时代的人工智能开发者，压力已经很大了，不能再自我催泪了。

这段时间里，火星码、Cursor、Windsurf等多款AI代码生成工具如火如荼。看了一些小伙伴的实践后，我可能也能做出一款工具来改善现状，于是边查边学，就有了今天这个创意——谷歌网址内容总结插件。

当我真正开始制作这个插件时，才发现AI的进步已经开始超越我的想象，实现的过程简单程度也超出了我的预料。对于外行小白来说，AI的入门门槛还是很高的，特别是神经网络模型方面，自我体验下来有几分困难。后来转变了想法，做不了AI的推动者，可以做AI的应用者和实践者。

大家可以跟我一起体验一下用Coze和Windsurf做一个谷歌的插件有多简单和快乐（当时我制作这个插件时，大约是从晚上11点到凌晨1点左右，2个小时时间就实现了核心功能）。

不多啰嗦了，进入正题，今天的主角是Coze和Windsurf。

今天主要使用了 Coze 中的工作流模块。工作流是什么？

工作流支持通过可视化的方式，对插件、大语言模型、代码块等功能进行组合，从而实现复杂、稳定的业务流程编排。例如旅行规划、报告分析等。

官方的讲述可能有些抽象，其实就类似于面向过程的编程思想。将一个个流程链接起来，实现较为复杂的功能。其中每种流程可能会使用不同的方式进行实现，比如借助插件、大模型等。

下面是工作流的入口。点击右上角新建一个工作流，创建时要注意，工作流名称只能是字母和下划线，描述尽可能清晰地介绍工作流的作用。

完成创建工作流后，就可看到一个绘图界面。在左侧列有各种节点，它们可根据需要自由移动并连接在一起；右侧则是整个绘制区域，包含了输入节点与输出节点。这些元素共同构成了一个流畅的工作流程。

在上文中提到，工作流程构建的核心思想是面向过程。因此，实现一个内容提取的工作流程时，我们可以将这一过程分为几个步骤来理解：

1. 获取网址：作为工作流程的输入。

2. 根据网址获取网站内容。

3. 对内容进行总结。

4. 输出内容。

这四步构成了一种非常简单的流程。接下来，我们逐步搭建这个工作流程：

- 配置输入节点：确定如何将输入传递给工作流程。

- 输入参数：指定输入字段的名称，这里选择“article_url”。用户可以自由定义输入字段的名字，但建议使用统一的命名规则以提高可读性。

就这样，通过上述步骤，我们已经完成了工作流程的基本搭建。

以前，想要从网址获取内容，需要借助爬虫等手段。但在coze中，只需打开插件并添加LinkReaderPlugin，将其与工作流中的输入节点和链接节点相连接，即可轻松实现。

使用LinkReaderPlugin可以方便地在coze中直接读取网址内容，无需繁琐的编程操作。这一功能极大地提升了工作效率，并且提供了简洁易用的用户体验。

点击Link节点时，需要设定参数。这些参数有多种声明方式，一种是引用前面节点的输出值，另一种则是直接输入固定值。

对于参数中的`skip_cache`，我们需要跳过缓存以避免反复总结和浪费token。因此，设置为 `false`，不跳过缓存，确保每次搜索都能获得最新信息；`url` 则代表使用输入节点传入的`article_url`字段来定位目标文章。

通过设置这些参数，我们可以更精准地获取我们需要的信息。

内容总结功能可以帮助我们快速提炼和概括文档的关键信息。使用右侧的引入大模型节点时，需要根据具体需求来调整参数设置。

在进行内容总结时，请确保所选的大模型具备良好的准确性、相关性和丰富性，以提供准确且详尽的信息摘要。

1. 模型：Coze提供的多种大模型，包括豆包系列、kimi系列、通义和智谱等。我选择了豆包-pro 32K模型。

2. 输入：接受的输入值通过Link节点data中的content配置进行设置即可。

3. 系统提示词：可以理解为cos，你想让大模型完成什么行为就写明，逻辑通常是：

- 身份：您是一个xxx，能够xxx

- 任务：将xxx转换成xxx

- 结果：得到xxx

4. 输出：规定大模型输出的内容，这里大模型会根据描述将其映射到撰写的变量中。

5. 输出内容

输出节点简单地输入大模型的返回值，并在回答方式选择区约定输出格式。

试运行

将所有节点串联起来，就能创建一个简单的大型模型。只需点击右上角的"试运行"按钮，就可以进行测试：

在试运行结束后，只需点击“发布”，你就能拥有一个用于自动提取网址内容的工作流程。输入网址后，程序即可获取所需信息。

发布完成之后，可以通过 API 进行调用，以当前的工作流程作为服务端，使用谷歌插件将 URL 传入 API，从而实现内容的自动化提取。

在官方文档中提供了以下示例，需要两个核心参数：授权令牌密钥和工作流 ID。

授权令牌密钥获取：

现在进入了刚刚创建的工作流。在URL中，query部分包含了工作流的ID。

Windsurf编写谷歌插件

Windsurf是由Codeium团队推出的一款AI编辑工具，与Cursor和Marscode类似。它目前提供免费服务，并且在互联网上有大量用户评价和比较分析。

目前我喜欢 windsurf 这个项目，主要是以下两点原因：

第一是右侧的 cascade 支持 write 和 chat 两种模式。write 模式专注于代码生成，而 chat 则负责自然语言交互。这样一来，windsurf 就能更好地满足这两种需求。

第二是这个项目暂时免费使用，而且用下来感觉代码生成的效果还是不错的。

既然选择了使用 AI 助手进行编程，希望实现的不仅仅是简单地把事情办了，还能让大脑不用动太多。更不用说自己去写代码，只需开口说话就能完成任务。因此，核心的问题是如何说明白，即如何书写提示词。

在这个模块中，可以使用 cursor 或者 Marscode 进行代码生成，但不一定要使用 windsurf。

在 `popup.html` 中需要添加一个按钮，点击后能获取当前页面的 URL。以下是示例代码：

```html

Hello, Chrome Extension!

Get Current URL

现在，还需要在 `manifest.json` 文件中开启 `"tabs"` 权限。

{

"manifest_version": 3,

"name": "My Chrome Extension",

"version": "1.0",

"description": "A simple Chrome extension example.",

"action": {

"default_popup": "popup.html",

"default_icon": "icon.png"

},

"permissions": ["tabs"]

}

```

可以在 windsurf 中找到没有给出的请求方法和事件触发方法。然而，在此过程中需要注意到一个细节：在 coze 工作流中，输入数据项为 article_url。因此，当发送请求时，请确保传递的数据与 coze 的输入参数一致。

Step4: 使用 chrome 加载当前插件

由于 windsurf 生成的 JavaScript 文件嵌入在 `popup.html` 中，当引入该文件时，点击图标可能会出现错误。

在 windsurf 中，错误直接复制到 chrome 扩展程序时遇到了问题。原因是 Chrome 扩展程序的内容安全策略（CSP）限制了内联脚本的执行。

接下来是步骤五：初步测试。选择一篇文章，点击“总结内容”按钮后，得到了文章的总结和评分。

在这个过程中简化了一些样式调整的交互。

步骤6：在popup区域的点击操作较为繁琐。下一步考虑的是添加一个悬浮球，当用户点击该悬浮球时，会自动显示总结的内容。这样可以更直观地展示关键信息。

在这一过程中，我们遇到了一些困难。wind surfing 提供了不准确的方法，主要原因是提示词没有足够具体。经过多次修改后，我们得到了以下的结果：

从头到尾，这个插件大概耗时两个小时左右。虽然最后的功能优化空间很大，但基础功能已经实现了。通过这个插件，我们可以快速筛选和阅读文章。

在这次过程中，我也学到了不少东西。对于AI时代的编程，一些看似困难的事情其实并不难，就像那句话说的，“种树最好是在十年前”。另外，这次开发谷歌插件的过程中，我使用了Windsurf这个工具，迅速成功地实现了一个可用的插件。

希望通过本文的分享，能够激发大家对AI的兴趣，加入到AI实践者和应用者的行列中。

接下来，我们总结一下本次插件搭建的一些新的收获：

1. **coze工作流搭建**：其实并不高大上，只要提前理清步骤并使用对应的节点，就可以搭建起一些较为简单的项目。

2. **文本内容处理**：通过coze工作流可以作为日常开发应用的服务端，利用coze API来实现复杂逻辑。

3. **精进提示词编写能力**：清晰、具体和多学习套路是关键点。编写AI编程助手的能力超乎想象，有想法后可以很快实现。

这些收获都让我对AI编程有了更深的理解和信心，也希望能够帮助到更多的人加入到这个领域。