多维表格自动生成小红书封面图:5000字详细教程

平时我写文章习惯在飞书文档来写,写完之后我会复制全部的内容给到AI,让AI帮我生成一个主标题和副标题,最后我会把这个主标题和副标题黏贴进我的一个图片模板里,用来做小红书的封面。

时间久了之后,我就想这几步操作,能否用自动化来提效。

用多维表格试了一下,还是可行的。

大概的操作简化成这样

配图

我只需要把我写好的飞书文档链接加进去,剩下的步骤就是点一点,人工审核一下就行。

今天的内容,我就来拆解下如何去实现和配置这样的自动化。

因为是教程,我们就多用几个工具,每个工具都来详细说明如何配置(飞书多维表格、飞书集成平台、n8n工作流)

跟着步骤操作就可以实现,还可以学习一下这些工具的详细用法。适用于学习多维表格和自动化工作流的朋友们。

话不多说,开始吧。

一、获取飞书云文档链接内容

需要实现的效果是,上传我的飞书云文档链接,然后点击获取内容按钮,就会自动将文档中的内容提取出来并写在多维表格行里的文章内容字段中。

配图

我用飞书集成平台的工作流能力,去获取到云文档中的内容,当然当我点击“获取内容”按钮的时候,需要触发集成平台工作流,这里的触发,可以借助多维表格的自动化来实现。

我们按步骤说一下怎么配置

(一)飞书集成平台工作流

这个工作流的核心目的在于,通过飞书云文档的链接,来获取到云文档中的内容。

大概思路是这几个步骤

实现到工作流里,就是这几个节点

配图

我们每个节点说明下:

1、获取多维表格的行id

因为我们只需要去获取到我点击按钮的那一行的文档内容,所以,我们需要通过行id,在多维表格官方叫record_id这个字段值(唯一值),来去获取

因为这个record_id,是通过多维表格自动化传过来的,其实在集成平台工作流这里并没有做获取的操作,我们只需要把这个值拿到就行(具体获取的步骤在多维表格自动化那里,我们后面讲)

从多维表格自动化传过来的值是这样:

{
  "headers": {
    "X-Rewrite-Url": "/anycross/trigger/callback/MGFkNTAxZTQ3ZjIxNmVmNTU0Y2E3M2E5NThjNzcxOWI4",
    "X-Request-Id": "5f8e5d65-6f06-44b0-98b2-089313afe84a",
    "Rpc-Persist-Inconsecutive-Detection": "1",
    "X-Forwarded-Protocol": "https",
    "User-Agent": "Go-http-client/2.0",
    "X-Forwarded-Proto": "https",
    "Ali-Tproxy-Urequest-Timeout": "60",
    "Ali-Swift-Ukeepalive-Timeout": "60",
    "Host": "open.feishu.cn",
    "Accept-Encoding": "gzip",
    "Ali-Swift-Urequest-Timeout": "60",
    "X-Tt-Logid": "02176386740090200000000000000000000ffffb1a4713caac604",
    "Via": "cn4465.l1",
    "X-Base-Automation-Ua": "automation/1.0.0",
    "Rpc-Persist-Lane-P-Real-Ip": "123.58.10.238",
    "X-Tt-Trace-Id": "00-00000000000000ffffb1a4713caac604-06E19B35119315EF-00",
    "X-Tlb-Server-Addr": "110.249.199.101",
    "X-Forwarded-For": "123.58.10.238, 218.11.11.26,fdbd:dc02:a:503::169",
    "X-Tt-Env": "prod",
    "Content-Length": "45",
    "X-Real-Ip": "123.58.10.238",
    "X-Pre-Backend": "lark.anycross.builtin_connector_web|default|prod|hl",
    "Content-Type": "application/json"
  },
  "path": "https://open.feishu.cn/anycross/trigger/callback/MGFkNTAxZTQ3ZjIxNmVmNTU0Y2E3M2E5NThjNzcxOWI4",
  "body_message": "{\n  \"triggered_record_id\": \"recv3kBTH6mA5J\"\n}",
  "method": "POST",
  "query": {},
  "body": {
    "triggered_record_id": "recv3kBTH6mA5J"
  },
  "content_length": 45
}

我们需要在这个里面拿到record_id值,也就是这个

配图

我们用动态脚本节点来获取(类似code节点,可以写js脚本)

配图

在配置这里,input,也就是上一个节点的output,我们选择body_message这个对象

code这里,我们写这样一个脚本


function handler(input) {
  // 从input中获取body_message
  const bodyMessage = input;

  try {
    // 解析body_message字符串为JSON对象
    const parsedBody = JSON.parse(bodyMessage);

    // 提取triggered_record_id并直接返回数组
    return [parsedBody.triggered_record_id];
  } catch (error) {
    // 如果解析失败,返回空数组
    return [];
  }
}

运行后,output就会输出里面的record_id

如下:

{
  "result": [
    "recv3kBTH6mA5J"
  ]
}

这里注意的是,result需要输出的是数组,因为我们后面获取多维表格记录的节点,格式要求的就是数组(因为可以批量获取记录)

2、获取当前行的行内容

这一步骤,我们需要获取到当前行的字段的内容,其中就包括飞书文档链接的文档id值。(这个id值的作用是为了获取文档里的内容)

我们添加一个多维表格的节点,选择“批量获取记录”操作

配图

入参这里,多维表格和数据表选择你当前需要编辑的。

重点是“记录ID列表”字段,这里的值实际上就是上一个节点“获取record_id”的output值。

配图

一开始可能会觉得比较抽象,你可以运行一下这个工作流,或者点一下调试

在日志这里,你看入参和出参值,其实就比较好理解了。

配图

入参:多维表格record_id

出参:根据record_id获取到的行记录

我们看这个出参,它实际上就是把当前行的内容获取到了

配图

这个文档token值就是我们需要的

配图

3、获取到token值

因为output出来的内容是一大推,但我们只需要里面的“token”

所以,我们还需要写一个脚本,只把token值取到就好

同样的我们用一个动态脚本节点

配图
function handler(input) {
  try {
    // 从records数组中获取第一个记录的飞书文档链接字段
    const records = input.records;

    if (records && records.length > 0) {
      const firstRecord = records[0];
      const docLinks = firstRecord.fields['飞书文档链接'];

      if (docLinks && docLinks.length > 0) {
        const firstDocLink = docLinks[0];
        // 直接返回token值
        return firstDocLink.token;
      }
    }

    // 如果没有找到token,返回空字符串
    return '';
  } catch (error) {
    // 如果解析失败,返回空字符串
    return '';
  }
}

通过这个脚本,我们把token值获取到了。

4、获取云文档内容

这一步,我们就需要通过token值,去把文档里的内容取到。

配图

在入参这,我们只需要在文档ID这里把上个节点的output配置到这里即可。

配图

运行节点后,就会看到,出参这里,我们已经把文档链接中的内容都获取到了。

配图

5、更新多维表格字段内容

这一步,就需要把获取到的内容更新到“文章内容”字段里

配图

添加一个多维表格节点,选择更新记录操作

配图

在配置项这里,我们选择对应的记录id值,然后在文章内容字段这里,我们选择上个节点获取到的文章内容的值

配图

这样运行之后,文档内容就自动更新到多维表格的“文章内容”字段里了。

以上就是飞书集成平台的这个工作流,实现了去获取文档内容并更新到多维表格里的一个效果。

你会发现飞书集成平台这个工作流实现起来会方便很多,因为很多飞书里的应用,比如多维表格,他都已经封装好了节点在里面,我们直接去选择就好,比如更新多维表格的操作,我们选择多维表格,配置好字段的数据来源就行。

其实我们用n8n,或者飞书多维表里的工作流,也是可以实现的

比如我一开始用多维表格工作流也可以配置好。

配图

但是,就有些麻烦。

尤其涉及到飞书里的功能的节点,它们并没有封装好让你直接可以选择,而是你自己得用http节点,去配置它的请求方法、url、参数等各种各样的值,非常麻烦。

(二)多维表格自动化,触发工作流

好了,获取文章内容的工作流已经完成了,但是还存在一个问题。

因为工作流是在集成平台里实现的,但是我们的操作是在多维表格,我如何在多维表格里通过某个动作,来触发集成平台的工作流?

相当于是不同两个产品间的一个交互。

这里就可以用到webhook节点。

1.webhook

这个是集成平台工作流的开始节点,叫“网址触发器”,你可以理解为它是一个监听器,或者说再等一个电话,这个电话响了后,它就会运行这个动作流。

配图

那么电话从哪打来呢? 这个就在多维表格里了。

2.多维表格

我们在多维表格配置一个自动化

配图

开始节点的动作是“点击按钮时”,也就是点击表格里的按钮时,这个自动化才会运行。

重点是最后一个发送HTTP请求的节点

配图

这里的请求地址,就是集成平台工作流开始节点的那个网址

配图

我们把这个网址复制过来到多维表格自动化的这个节点里来就好

请求体那里,我们把点击按钮的那一行的record_id获取到,并传给集成平台。

有点类似我打了个电话给集成平台,告诉你可以运行了,并且给你传了个信(record_id)

那么,以上,我们就完成了获取文档内容的整个过程。

在多维表格点击按钮 – 触发多维表格自动化 – 在自动化中,触发集成平台的工作流 – 获取到文档内容并更新到表格里。

二、制作封面图

有了文章内容,我们通过AI,从文章内容提取出来小红书的标题和副标题

然后,我们把这个标题和副标题,制作成一个小红书的封面图。

操作的步骤是,我们点击获取封面图的按钮,然后在封面图,自动生成一张小红书封面图的图片,图片里的内容就是”XHS主标题“和”XHS副标题“

配图

同样的,我们具体看看怎么来实现。

(一)n8n自动化工作流

本着教程的初衷,尽量用不同的方法或工具来实现,所以,我们试试用n8n自动化工作流的方式来实现。

它和上面我们说的集成平台工作流很像,区别就是n8n对飞书里的功能支持和封装的不够好,关于飞书的东西配置起来就比较麻烦,好处就是,n8n对飞书以外的功能支持的很好,用起来非常方便。

如果n8n里能够把飞书的功能都集成好的话,那就不得了了。

好,接下来说说n8n的配置

配图

1.webhook

n8n流程的开始节点,设置为一个webhook节点

这里的原理和上面集成平台工作流是一样的

webhook的地址后面要复制到多维表格自动化里面

2.获取多维表格内容

首先我们要获取到多维表格字段的内容,主要是这两个字段:“XHS主标题”,“XHS副标题”

当然n8n里没有封装好的飞书节点,不像集成平台里,一个节点拖拽几下就搞定。

n8n里面我们需要用http节点,根据飞书多维表格接口规范自己来配置

这里要配置两个节点,一个是获取token ,另一个是获取记录的节点,要用两个接口来实现

配图

(1)获取token

直接说节点的配置项

Method post
URL https://open.feishu.cn/open-apis/auth/v3/tenant_access_token/internal
Authentication none
Header name:Content-Type
value:application/json; charset=utf-8
body app_id:你创建的应用的app_id
app_secret:你创建的应用的app_secret

(2)获取记录

Method post
URL https://open.feishu.cn/open-apis/bitable/v1/apps/{表格的token}/tables/{表格的table_id}/records/batch_get
Authentication none
Header ①name:Authorization
value:Bearer {{ \$json.tenant_access_token }}
②name:Content-Type
value:application/json; charset=utf-8
注:{{ \$json.tenant_access_token }}就是上个节点获取到的token值
body 类型选择json
{
“record_ids”: [
“{{ \$(‘Webhook’).item.json.body.triggered_record_id }}”
]
}
注:{{ \$(‘Webhook’).item.json.body.triggered_record_id }}这个就是webhook从多维表格传过来的record_id值

通过这两个节点,我们获取到多维表格对应的行的字段值。

我们再来一个变量节点

配图

主要是单独把这两个字段变成变量拎出来。

配图

3.生成图片的HTML

好,这一步就是核心啦

我们其实是把图片,用前端代码写出来了。

这样的好处是精准,灵活,比直接用AI生成稳定很多

当然是适用于有固定模板的封面图片

比如这个图片就是上面一个大标题,底下是一个副标题

这种固定模式的,我们调好代码,后面批量生成也就很容易了

我们先用最简单的样式,讲一下原理

我们添加一个code节点

然后在里面写好图片的html和css代码

const title = $input.first().json.title || "默认标题";
const content = $input.first().json.content || "默认内容";

// HTML结构(不含<style>)
const html = `
<div class="container">
  <div class="title">${title}</div>
  <div class="content">${content}</div>
</div>
`;

// CSS单独放
const css = `
body, html {
  width: 1080px;
  height: 1920px;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #FAFAFA;
  font-family: "Arial", sans-serif;
}

.container {
  width: 80%;
  text-align: center;
}

.title {
  font-size: 72px;
  font-weight: 700;
  color: #111;
  margin-bottom: 40px;
}

.content {
  font-size: 44px;
  color: #666;
  line-height: 1.5;
}
`;

return {
  html,
  css
};

里面有html也有css,我们单独放

最后输出的是这样一段内容

配图

接下来我们要把这段内容变为图片

4.HTML/CSS转图片

转图片的话,其实工具很多

我们直接在n8n节点里来搜索

配图

当然这个服务不是免费的,它提供了试用额度,就拿它为例。

我们需要提前去官网注册账号,然后获取接口的api key,在认证那里连接好

接着就是把html content字段 和 css content字段,设置成上个节点输出的内容

图片的宽高也设置好

配图

运行即可。

运行后,输出了一个图片的地址

https://generated-image.s3.ap-south-1.amazonaws.com/images/fe39df7d-8b58-441b-8ec5-62a11f24f5f1.png

可以直接点开看

配图

说明是跑的通的,最后我们在html和css里调样式就行(样式后面再调,我们先把流程跑通)

5.下载图片

只有地址还不行,我们得把图片下载下来,然后要上传到飞书里面才行。

所以我们要先下载图片

直接用http节点就行

配图

注意Response的格式要选择file

最后输出的样子是这样的,说明是没问题的

配图

6.上传图片

然后我们要上传图片到飞书,不然飞书服务器里是没有这个图片的。

上传图片,我们就使用多维表格的上传素材接口

同样的我们用http节点来实现

Method post
URL https://open.feishu.cn/open-apis/drive/v1/medias/upload_all
Authentication none
Header ①name:Authorization
value:Bearer {{ \$(‘获取token’).item.json.tenant_access_token }}
②name:Content-Type
value:multipart/form-data; boundary=—7MA4YWxkTrZu0gW
body Body Content Type要选Form-Data
参数配置如下:
①name:file
value:imageFile
注意file这个type要选n8n Binary File
②name:size
value:{{ \$json.real_size }}
注:size这里,我们需要在前面加一个code节点来处理一下,因为这里默认是KB格式的,但飞书要求是字节格式,所以得做处理。
③name:file_name
value:demo.png
④name:parent_type
value:bitable_image
⑤name:parent_node
value:{多维表格的token}

这个节点运行后,我们就会得到一个文件的token

配图

好,我们在说说处理文件大小的节点

配图

我们在n8n获取到的文件大小都是KB的

配图

但是飞书要求要用字节的格式

所以我们得用code节点,把文件大小处理一下


// 获取二进制数据
const binaryData = items[0].binary.imageFile;

if (binaryData) {
  const base64String = binaryData.data;

  // 通过 Base64 长度计算精确的字节大小
  // 公式:(Base64字符长度 / 4) * 3 - 填充字符长度
  let padding = 0;
  if (base64String.endsWith('==')) padding = 2;
  else if (base64String.endsWith('=')) padding = 1;

  const exactSize = (base64String.length / 4) * 3 - padding;

  // 将精确大小写入到 JSON 数据中,供下一步使用
  items[0].json.real_size = exactSize;
}

return items;

处理后,我们就得到了文件精确的字节大小

配图

7.更新多维表格

最后,我们把这个封面图更新到多维表格里去

同样的加一个http节点,调飞书多维表格的更新记录的接口

Method put
URL https://open.feishu.cn/open-apis/bitable/v1/apps/RTnbbVoapaEDOEsaseCcVWxDnyg/tables/tblRcG1oWLm9shsa/records/{{ \$(‘获取表格内容’).item.json.data.records[0].record_id }}
Authentication none
Header ①name:Authorization
value:Bearer {{ \$(‘获取token’).item.json.tenant_access_token }}
②name:Content-Type
value:application/json; charset=utf-8
body Body Content Type选择json
配置如下:
{
“fields”: {
“封面图”: [
{
“file_token”: “{{ \$json.data.file_token }}”
}
]
}
}

好了,到这里,n8n的流程就配置完成了。

(二)多维表格自动化

我们需要有一个动作触发这个工作流

参考获取文档链接的配置,我们同样在多维表格自动化这里来实现

新建一个自动化,选择点击按钮触发

配图

唯一不同的是http请求节点,把url换成n8n开始节点webhook里的链接就好

配图

好的,完成以上的配置,我们整体的效果就实现了。

简单回顾一下,我们在多维表格上传了一个云文档的链接,然后点击获取按钮内容,就会把文档里的内容都同步到多维表格里,接着用ai字段,自动为我们生成小红书的主标题和副标题,最后再点击生成封面图的按钮,自动帮我们生成小红书的封面图并上传到飞书多维表格里。


📋 这套封面图相关模板,我整理成模板了

跟着上面步骤搭要花点时间。想直接拿现成的改,加我微信备注「封面图」,我发你。

🤔 卡在某一步了?

搭建过程里如果哪一步卡住了,如果你照着做没跑通,或者你们公司情况不太一样,可以找我聊聊,我免费帮你看看怎么调。不合适我也会直说。

加吨师傅微信咨询飞书多维表格搭建

扫码加我,备注「封面图」领模板

想看更多这类方案,我都整理在 吨师傅工具箱 里了:客户管理、进销存、工单报修……按场景分好类,可以直接抄。

发表评论

您的邮箱地址不会被公开。 必填项已用 * 标注

滚动至顶部