🎯 项目背景

作为内容创作者,我每天都在为微信公众号文章的发布流程烦恼:从内容创作、格式转换到图文排版、封面生成,每个环节都需要重复劳动。直到我发现了 WorkBuddy Claw —— 国内首个 IM 原生 AI Agent 平台。

✨ 核心亮点

WorkBuddy Claw 让我体验到了真正的"AI 助手":

  • 免部署·安装即用

     —— 无需配置环境,开箱即用

  • 预集成模型

     —— 无需自己搞定 API Key,直接开干

  • 本地+云端双模

     —— 即使关掉电脑,Agent 也能继续工作

  • 多 Agent 并行

     —— 同时开发、测试、部署,一人成军

📋 实战任务

目标:用 WorkBuddy Claw 构建一套完整的微信公众号自动化发布系统,包括:

  1. Markdown 转 HTML 格式转换

  2. 自动封面图生成(10种配色方案)

  3. 智能关键词提取

  4. 微信公众号 API 集成

  5. 一键发布到公众号

🛠️ 技术实现

第一步:需求分析与规划

我直接在企微中 @WorkBuddy Claw 发送:

帮我规划一个微信公众号自动化发布系统,需要支持 Markdown 转 HTML、自动封面生成、关键词提取和一键发布功能

WorkBuddy Claw 立即响应,分析需求并给出了完整的技术方案:

技术栈建议:
- Node.js:后端处理
- Markdown-it:Markdown 解析
- Sharp:图片处理(SVG→PNG)
- 微信公众号 API:文章发布

项目结构:
├── markdown-to-wechat.js  # 主转换器
├── generate_cover.js       # 封面生成
├── package.json           # 依赖管理
└── test-converter.js      # 测试脚本

第二步:代码生成

接着我让 WorkBuddy Claw 开始编写代码:

开始实现核心功能,先从 Markdown 转 HTML 和封面生成开始

WorkBuddy Claw 迅速生成了三个核心文件:

1. 封面生成器(generate_cover.js)

const sharp = require('sharp');
const crypto = require('crypto');

// 10 种渐变配色方案
const colorSchemes = [
  ['#667eea', '#764ba2'], // 紫蓝渐变
  ['#f093fb', '#f5576c'], // 粉紫渐变
  ['#4facfe', '#00f2fe'], // 蓝绿渐变
  ['#43e97b', '#38f9d7'], // 绿青渐变
  ['#fa709a', '#fee140'], // 粉黄渐变
  ['#a18cd1', '#fbc2eb'], // 青紫渐变
  ['#667eea', '#764ba2'], // 浅蓝粉
  ['#ff9a9e', '#fecfef'], // 浅粉
  ['#f6d365', '#fda085'], // 暖橙
  ['#ff0844', '#ffb199']  // 红蓝色
];

function generateSVGCover(title, outputFile) {
  // 根据标题哈希选择配色
  const hash = crypto.createHash('md5').update(title).digest('hex');
  const schemeIndex = parseInt(hash.substring(0, 2), 16) % colorSchemes.length;
  const [color1, color2] = colorSchemes[schemeIndex];

  // 自动换行处理
  const maxCharsPerLine = 12;
  const words = title.split('');
  let lines = [];
  let currentLine = '';

  for (let char of words) {
    if (currentLine.length >= maxCharsPerLine) {
      lines.push(currentLine);
      currentLine = char;
    } else {
      currentLine += char;
    }
  }
  if (currentLine) lines.push(currentLine);

  // 动态字体大小
  const fontSize = title.length < 30 ? 48 : title.length < 50 ? 36 : 28;
  const lineHeight = fontSize * 1.5;
  const startY = 200 - (lines.length * lineHeight) / 2 + (lines.length - 1) * lineHeight / 2;

  // 生成 SVG
  const svg = `
    <svg width="1000" height="400" xmlns="http://www.w3.org/2000/svg">
      <defs>
        <linearGradient id="grad" x1="0%" y1="0%" x2="100%" y2="100%">
          <stop offset="0%" style="stop-color:${color1};stop-opacity:1" />
          <stop offset="100%" style="stop-color:${color2};stop-opacity:1" />
        </linearGradient>
      </defs>
      <rect width="100%" height="100%" fill="url(#grad)" />

      <!-- 装饰圆圈 -->
      <circle cx="100" cy="100" r="80" fill="rgba(255,255,255,0.1)" />
      <circle cx="900" cy="300" r="120" fill="rgba(255,255,255,0.15)" />

      <!-- 文字 -->
      ${lines.map((line, i) => `
        <text x="500" y="${startY + i * lineHeight}"
              font-family="system-ui, sans-serif"
              font-size="${fontSize}"
              font-weight="bold"
              fill="white"
              text-anchor="middle">
          ${line}
        </text>
      `).join('')}
    </svg>
  `;

  // SVG 转 PNG
  return sharp(Buffer.from(svg))
    .png()
    .toFile(outputFile);
}

2. Markdown 转换器(markdown-to-wechat.js)

const MarkdownIt = require('markdown-it');
const fs = require('fs');
const path = require('path');
const { generateSVGCover } = require('./generate_cover');

class MarkdownToWeChat {
  constructor() {
    this.md = new MarkdownIt({
      html: true,
      linkify: true,
      typographer: true
    });
  }

  markdownToHTML(markdown, title, coverPath) {
    const htmlContent = this.md.render(markdown);

    return `<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>${title}</title>
  <style>
    body {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
      line-height: 1.8;
      max-width: 800px;
      margin: 0 auto;
      padding: 20px;
      background: #f5f5f5;
    }
    .content {
      background: white;
      padding: 40px;
      border-radius: 12px;
      box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    }
    .cover {
      width: 100%;
      height: auto;
      border-radius: 8px;
      margin-bottom: 30px;
    }
    h1 { color: #1a1a1a; font-size: 2em; margin-bottom: 0.5em; }
    h2 { color: #333; border-left: 4px solid #667eea; padding-left: 15px; margin: 1.5em 0 1em; }
    p { color: #555; margin: 1em 0; }
    pre { background: #f8f9fa; padding: 15px; border-radius: 6px; overflow-x: auto; }
    code { background: #f0f0f0; padding: 2px 6px; border-radius: 3px; }
    blockquote { border-left: 4px solid #ddd; padding-left: 20px; color: #666; margin: 1.5em 0; }
    table { width: 100%; border-collapse: collapse; margin: 1.5em 0; }
    th, td { border: 1px solid #ddd; padding: 12px; text-align: left; }
    th { background: #f8f9fa; font-weight: 600; }
  </style>
</head>
<body>
  <div class="content">
    <img src="${coverPath}" class="cover" alt="${title}">
    ${htmlContent}
  </div>
</body>
</html>`;
  }

  async convert(markdownPath, outputDir, customTitle) {
    const markdown = fs.readFileSync(markdownPath, 'utf-8');
    const title = customTitle || path.basename(markdownPath, '.md');

    // 生成封面
    const coverPath = path.join(outputDir, 'cover.png');
    await generateSVGCover(title, coverPath);

    // 生成 HTML
    const html = this.markdownToHTML(markdown, title, 'cover.png');
    const htmlPath = path.join(outputDir, 'article.html');
    fs.writeFileSync(htmlPath, html);

    console.log(`✅ 转换成功!`);
    console.log(`HTML: ${htmlPath}`);
    console.log(`封面: ${coverPath}`);

    return { html: htmlPath, cover: coverPath };
  }
}

module.exports = MarkdownToWeChat;

第三步:测试与优化

让 WorkBuddy Claw 运行测试:

测试一下转换功能,用项目中的 OpenClaw-Aras-N8N-Enterprise-Integration.md 文件

WorkBuddy Claw 自动执行测试,并发现了问题:

⚠️ 发现问题:长标题在封面图上显示不完整
💡 解决方案:实现智能换行算法,根据标题长度动态调整字体大小

快速修复后,效果完美!

第四步:微信公众号 API 集成

继续扩展功能:

帮我集成微信公众号 API,实现一键发布功能

WorkBuddy Claw 立即生成发布模块:

const axios = require('axios');

class WeChatPublisher {
  constructor(appId, appSecret) {
    this.appId = appId;
    this.appSecret = appSecret;
    this.accessToken = null;
  }

  async getAccessToken() {
    const url = `https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=${this.appId}&secret=${this.appSecret}`;
    const response = await axios.get(url);
    this.accessToken = response.data.access_token;
    return this.accessToken;
  }

  async uploadMedia(filePath, type = 'thumb') {
    const token = await this.getAccessToken();
    const url = `https://api.weixin.qq.com/cgi-bin/material/add_material?access_token=${token}&type=${type}`;

    const form = new FormData();
    form.append('media', fs.createReadStream(filePath));

    const response = await axios.post(url, form, {
      headers: form.getHeaders()
    });

    return response.data.media_id;
  }

  async publishArticle(title, content, thumbMediaId) {
    const token = await this.getAccessToken();
    const url = `https://api.weixin.qq.com/cgi-bin/draft/add?access_token=${token}`;

    const data = {
      articles: [{
        title,
        author: 'OpenClaw',
        digest: content.substring(0, 120) + '...',
        content,
        thumb_media_id: thumbMediaId,
        show_cover_pic: 1,
        need_open_comment: 1,
        only_fans_can_comment: 0
      }]
    };

    const response = await axios.post(url, data);
    return response.data;
  }
}

第五步:一键发布

最后整合所有功能:

# 一键发布
node publish.js OpenClaw-Aras-N8N-Enterprise-Integration.md

结果:

  • ✅ Markdown 自动转换成 HTML

  • ✅ 封面图自动生成(渐变配色很漂亮!)

  • ✅ 上传到微信公众号素材库

  • ✅ 自动保存为草稿

  • ✅ 只需一键确认即可发布

🎉 实战效果

效率提升

  • 过去

    :手动排版 1 篇文章需要 30-60 分钟

  • 现在

    :自动化发布只需 5 分钟

  • 提升

    6-12 倍效率

质量提升

  • 封面图自动生成,配色专业美观

  • HTML 格式规范,响应式设计

  • 一键发布,避免人工操作失误

体验提升

  • 在企微里 @WorkBuddy Claw 就能工作

  • 代码质量高,注释完整

  • 遇到问题 AI 自动排查修复

💡 WorkBuddy Claw 核心优势体验

1. IM 一键派活

无需打开 IDE,在企微里直接发指令,Agent 全自动完成任务。这种体验真的太爽了!

2. 本地+云端双模

关掉电脑 Agent 也能继续运行,国内独家功能。再也不用担心长时间任务中断了。

3. 多 Agent 并行

同时让多个 Agent 并行工作:

  • Agent 1:生成封面

  • Agent 2:转换 HTML

  • Agent 3:测试 API

  • Agent 4:写文档

效率直接翻倍!

4. 免部署·安装即用

下载安装就能用,无需配置环境。预集成模型,不用自己申请 API Key,省心省力。

🚀 总结

这次实战让我深刻体会到 WorkBuddy Claw 的强大:

  1. 真正的 AI 助手

    :不是聊天机器人,而是能执行任务的 Agent

  2. IM 原生体验

    :在企微/飞书/钉钉里直接 @ 一下,Agent 自动接活、执行、交付

  3. 开发效率爆炸

    :一人成军不再是梦

  4. 安全可靠

    :腾讯级网关护航,数据安全有保障

如果你也需要提升工作效率,强烈推荐试试 WorkBuddy Claw!


📚 完整代码

完整项目代码已开源,欢迎 Star:

  • GitHub:https://github.com/andyy1976/workbuddy-claw-wechat-publisher

  • 演示视频: [你的视频地址]

🔗 相关链接

  • WorkBuddy Claw 官网:https://www.codebuddy.cn/work/

  • 产品文档:https://www.codebuddy.cn/docs/workbuddy/Overview

  • 活动链接:https://wj.qq.com/s2/25894124/ua4u


作者:OpenClaw 开发者
标签:#WorkBuddyClaw实战 #百万Credits悬赏 #腾讯版小龙虾
发布时间:2026年3月22日

Logo

AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。

更多推荐