前言

最近在尝试把 Claude Code 接入到日常使用更方便的消息平台中。相比每次打开终端直接操作，在微信里发送消息，让 Claude Code 帮忙执行一些开发、检索、配置类任务，会更接近一个随身 AI 助手的使用方式。

这次配置的目标主要有两个：

  • 使用 cc-connect 将 Claude Code 接入微信；
  • 给 Claude Code 配置额外的图片识别能力，使其在收到图片时可以调用视觉模型进行分析。

整个过程并不是简单的一条命令完成，中间也遇到了一些配置文件、后台进程、API Key 读取等问题，因此整理成这篇文章作为记录。

cc-connect 的安装与基本检查

cc-connect 是一个用于连接本地 AI 编程助手和消息平台的工具，支持 Claude Code、Codex、Gemini CLI 等智能体，也支持微信、飞书、钉钉、Telegram 等消息平台。

这里使用 npm 进行全局安装：

1
npm install -g cc-connect

安装完成后可以通过以下命令检查版本：

1
cc-connect --version

如果输出类似下面的内容，说明 cc-connect 已经可以正常调用：

1
cc-connect v1.3.2

需要注意的是，cc-connect 本身只是一个连接器，真正执行任务的仍然是本地安装的 Claude Code。因此在使用之前，还需要确保 Claude Code 本身已经安装并能够正常运行。

配置微信接入 Claude Code

cc-connect 接入个人微信时使用的是 weixin 平台配置。可以通过下面的命令进行扫码登录和项目初始化：

1
cc-connect weixin setup --project WechatAgent

执行命令后，终端会显示二维码。使用微信扫码完成登录后，cc-connect 会把对应的 token、account_id 等信息写入配置文件中。

cc-connect 默认配置文件位于：

1
C:\Users\Administrator\.cc-connect\config.toml

配置完成后，一个可用的项目结构大致如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
[[projects]]
name = "WechatAgent"

[projects.agent]
type = "claudecode"

[projects.agent.options]
work_dir = "G:\\node_modules\\cc-connect\\bin"
mode = "default"

[[projects.platforms]]
type = "weixin"

[projects.platforms.options]
token = "你的 weixin token"
base_url = "https://ilinkai.weixin.qq.com"
account_id = "你的 account_id"

这里的 work_dir 表示 Claude Code 启动时所在的工作目录，可以根据自己的实际项目位置修改。

解决 cc-connect 启动失败的问题

扫码配置完成后，我一开始直接启动 cc-connect：

1
cc-connect

结果发现并没有真正跑起来，日志中出现了类似下面的错误：

1
Error loading config: projects[0] needs at least one [[projects.platforms]]

这个错误的原因是：配置文件中存在多个 [[projects]] 项目块，其中有一个项目只配置了 agent，却没有配置任何消息平台。

cc-connect 要求每一个项目都必须至少配置一个平台，例如：

1
2
[[projects.platforms]]
type = "weixin"

因此解决方法有两个：

  • 删除无用的项目配置，只保留真正要使用的 WechatAgent；
  • 或者给每一个项目都补上对应的 [[projects.platforms]] 配置。

修复配置后，再次运行：

1
cc-connect

如果看到类似下面的日志，就说明服务已经启动成功：

1
2
3
platform ready
engine started
cc-connect is running

确认微信已经成功接入 Claude Code

cc-connect 启动成功后，需要保持终端窗口不要关闭。因为它是一个常驻进程，只有持续运行时才能接收微信消息。

可以通过查看进程确认它是否还在后台运行。Windows 下可以查看 node 进程的命令行，如果看到类似下面的内容，就说明 cc-connect 正在运行：

1
node ...\node_modules\cc-connect\run.js

另外，cc-connect 会在用户目录下生成运行缓存和会话记录，例如：

1
2
3
C:\Users\Administrator\.cc-connect\sessions
C:\Users\Administrator\.cc-connect\weixin
C:\Users\Administrator\.cc-connect\run

如果微信中已经能正常收到 Claude Code 的回复，说明以下几个环节都已经打通：

  • 微信扫码登录成功；
  • ilink 平台连接成功；
  • cc-connect 平台引擎启动成功；
  • Claude Code 能够被 cc-connect 调用；
  • 微信消息能够进入 Claude Code，并把回复发回微信。

到这一步，微信接入 Claude Code 的主流程就完成了。

配置 Claude Vision Skill 识图能力

Claude Code 本身在某些运行场景下并不能直接读取图片内容，因此我使用了一个额外的识图 Skill：claude-vision-skill。

这个 Skill 的核心思路很简单：

  1. 用户发送图片；
  2. Claude Code 发现需要识图；
  3. 调用本地的 vision.js；
  4. vision.js 将图片转成 base64；
  5. 请求支持视觉能力的模型；
  6. 把模型返回的图片描述交给 Claude Code 使用。

本地目录放在：

1
G:\claude-vision-skill

其中比较重要的文件包括：

文件作用
vision.js核心识图脚本，负责读取图片并调用视觉模型
.env存放 API Key、模型名等配置
CLAUDE.md告诉 Claude Code 遇到图片时如何使用这个脚本

为了让 Claude Code 能把它当成一个全局 Skill 使用，可以将该目录链接到 Claude 的 skills 目录中：

1
C:\Users\Administrator\.claude\skills\claude-vision-skill

配置完成后，Claude Code 在后续任务中遇到图片路径、附件图片或用户要求分析图片时，就可以调用这个 Skill。

配置阿里云百炼 API Key 和识图模型

这次识图服务使用的是阿里云百炼的视觉模型。.env 文件可以这样配置：

1
2
DASHSCOPE_API_KEY=sk-xxx
VISION_MODEL=qwen3.5-omni-plus

这里不要把真实 API Key 写入博客或公开仓库，示例中使用 sk-xxx 代替。

阿里云百炼的 OpenAI 兼容模式接口地址一般为：

1
https://dashscope.aliyuncs.com/compatible-mode/v1

如果使用的是其他地域，需要根据 API Key 所属地域调整 Base URL。例如：

地域Base URL
华北 2（北京）https://dashscope.aliyuncs.com/compatible-mode/v1
新加坡https://dashscope-intl.aliyuncs.com/compatible-mode/v1
美国（弗吉尼亚）https://dashscope-us.aliyuncs.com/compatible-mode/v1

模型方面，可以使用支持视觉输入的模型，例如：

  • qwen3.5-omni-plus
  • qwen-vl-max
  • qwen-vl-plus

如果接口返回权限错误，需要先到阿里云百炼控制台确认模型服务是否已经开通。

解决 vision.js 无法读取 .env 的问题

测试识图时，一开始遇到了一个比较容易误判的问题：接口返回 401，提示 API Key 不正确。

错误信息类似：

1
Incorrect API key provided

一开始以为是 API Key 没开通或者模型权限有问题。后来直接使用 curl 调用 qwen-turbo 测试，发现 API Key 本身是可以正常使用的。因此问题不在 Key，而在本地脚本没有正确读取 .env。

原始的 vision.js 依赖 dotenv 读取环境变量：

1
try { require("dotenv").config(); } catch {}

但当前目录没有安装 dotenv，导致 .env 实际上没有被加载，脚本仍然在使用代码里的占位 Key。

解决方法有两个：

  • 安装依赖：npm install dotenv；
  • 或者改造 vision.js，使用 Node.js 原生能力读取 .env。

为了减少依赖，我选择了第二种方式。大致逻辑如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function loadEnvFile(file) {
  if (!fs.existsSync(file)) return;
  const lines = fs.readFileSync(file, "utf8").split(/\r?\n/);
  for (const line of lines) {
    const trimmed = line.trim();
    if (!trimmed || trimmed.startsWith("#")) continue;
    const index = trimmed.indexOf("=");
    if (index === -1) continue;
    const key = trimmed.slice(0, index).trim();
    const value = trimmed.slice(index + 1).trim();
    if (!process.env[key]) process.env[key] = value;
  }
}

loadEnvFile(path.resolve(process.cwd(), ".env"));
loadEnvFile(path.resolve(__dirname, ".env"));

这样即使没有安装额外 npm 包，vision.js 也能正常读取 .env 中的 API Key 和模型配置。

测试图片识别效果

配置完成后，可以使用下面的命令测试图片识别：

1
2
cd G:\claude-vision-skill
node vision.js "0e6f94a533d20e6cb65e91b1176cca70.jpg" "用中文详细描述这张图片的内容"

测试时，模型成功识别出图片中的主要内容，包括：

  • 白色电脑桌；
  • 显示器、键盘、鼠标和鼠标垫；
  • 椅子上的水瓶、耳机和杂物；
  • 右侧木质置物架；
  • 电热水壶、排插、数据线；
  • 下方的电脑主机和生活物品。

这说明图片已经被正确读取，并且视觉模型能够返回较完整的中文描述。

总结

这次配置主要完成了两件事：

第一，使用 cc-connect 将 Claude Code 接入微信。这样以后可以直接在微信里向 Claude Code 发送消息，让它帮忙处理开发、配置、检索等任务。

第二，通过 Claude Vision Skill 给 Claude Code 增加图片识别能力。它的本质并不是让原模型直接“看图”，而是把图片交给支持视觉能力的模型，再把图片描述返回给 Claude Code 使用。

整个过程中比较关键的坑有三个：

  • cc-connect 的每一个项目都必须配置至少一个消息平台；
  • cc-connect 必须保持运行，微信消息才能被持续接收；
  • vision.js 必须确保真正读取到 .env 中的 API Key，否则容易误判为模型权限或 Key 错误。

配置完成后，这套方案就可以形成一个比较顺手的个人 AI 工作流：微信负责入口，cc-connect 负责消息桥接，Claude Code 负责执行任务，Vision Skill 负责补足图片理解能力。