用n8n做AI工作流驱动网站出海赚美金2:网站截图与写 SEO友好的介绍

2 评论 1606 浏览 3 收藏 11 分钟
🔗 产品经理的职业发展路径主要有四个方向:专业线、管理线、项目线和自主创业。管理线是指转向管理岗位,带一个团队..

在数字化出海的浪潮中,AI工作流正成为提升效率、降低成本的利器。本文作者通过n8n搭建了一个AI驱动的工作流,用于帮助网站出海并赚取美金。在第一部分介绍了如何连接Supabase数据库后,本文继续深入探讨如何实现网站截图以及生成SEO友好的介绍信息。

书接上回:用n8n做AI工作流驱动网站出海赚美金1:连接Supabase数据库

年初的时候我做了一个AI编程工具的导航网站,打算流量上来后就可以接谷歌广告赚美金:

https://www.aicoding.help/cn

设想是根据AI编程开发的流程来推荐每个阶段的效率工具:灵感与想法、原型与设计、编程开发、数据库与存储、部署上线、扩展能力、数据分析、内容管理、协作与运营

这是整个网站的后端处理逻辑:

需求描述

今天来解决第二个阶段:

  • 1. 把submit表中待处理的网站,逐个处理
  • 2. 打开网站截图
  • 3. AI生成seo偏好的详情信息存放数据库

效果是这样:

每个网站的截图作为卡片封面,网站自带的标题作为卡片标题,同时生成短描述

每个卡片点进去后就是一个详情描述,这里也是希望谷歌收录的信息,所以需要SEO友好

网站截图

这个需求的核心就是网站截图,有 3种方式

1. 第一种是 本地部署python跑

例如tap4ai自带的后端就是用的pyppeteer,相当于调用Chrome去访问网址后,截图,核心代码

2. 第二种 是调用别人现成的API

目前测下来效果比较好、且免费的是 urlscan

这是它的文档地址https://urlscan.io/docs/api/

能顺利截reddit的图,示例:https://urlscan.io/liveshot/?width=600&height=400&url=https://www.reddit.com/

结构就是 https://urlscan.io/liveshot/?width=【宽度】&height=【高度】&url=【网址】

但测了几个网站,语言都是德语。如上图还会有一些遮挡,应该是设备设置的问题。

其他的,要么是被禁了,要么要付费。

例如用wordpress的预览功能,会限制被禁止,应该是因为服务器在国内的原因

https://s0.wp.com/mshots/v1/https://www.reddit.com/?w=600&h=400

其他的,例如 https://gugudata.com/,就要付费,效果未知,pass

3. 第三种,就是docker部署一个无头浏览器,通过端口的形式供n8n调用

具体参考:https://community.n8n.io/t/automate-screenshots-pdfs-and-more-integrating-n8n-with-self-hosted-browserless-playwright-changedetection-io/53351

这种,说实话还是很麻烦,尝试了一下没成功,就先放弃了。

看下来效果最好的还是第一种方法,但工作流平台都有一个通病:无法运行复杂的 python 脚本。

所以解决方案是把第一种,也就是tap4ai原本就有的python调用playwright截图功能封装成api,供n8n调用。

这个也是我解决很多复杂功能的方案:先在 Cursor完成单独模块的开发,再打包成 fastapi,通过宝塔面板部署到服务器上,再打开端口权限给 n8n 调用 。

参考 cursor 的提示词:请新建一个脚本,然后帮我把@website_crawler.py中的网页截图的相关能力,单独写到一个脚本里,如果涉及到调用其他的脚本也把代码一起放进去这是网页截图的核心部分,你需要去分析还需要哪些:…调用`sequentialthinking`MCP工具去一步一步思考处理,确保不要影响到其他的功能代码

继续把代码封装成 fastapi 接口:继续优化把@website_screenshot.py 封装成fastapi接口,用户传入一个网址后,返回截图的url,包括云存储url、缩略图url

同时,我还让 cursor 写了一个 api 测试脚本,测完没问题,我才部署:

上传到宝塔面板,部署成API

插句题外话,部署服务器很推荐用宝塔面板,通过面板来操作,能省不少事。包括 n8n、dify 等的部署基本上都很丝滑。

1. 在宝塔面板新建文件夹

把关键文件,包括代码脚本、.env环境配置、requirements.txt等一起上传进去

2. 新建Python项目

在下图位置,填好信息即可。

3. 查看日志确保服务启动

4. 在线调试

fastapi 有自带一个接口文档同时还能在上面调试很方便:

例如我部署在3333端口,文档就在 http://ip:3333/docs

找到接口函数,点Try it out,并修改下面的请求参数

点Execute,下面Curl就是自动生成好的请求

下面Response boy我们看到返回200,数据正常

调通了,最后才是到 n8n 新建 HTTP Request 节点,确保能正常返回网站的截图信息:

至此,我们最麻烦的一步就解决了。

n8n工作流

接下来,就可以着手去新建工作流。

方便起见,我们继续沿用上次的工作流,在提交网站后,直接就把提交的信息拿来抓网站截图和写介绍。

如图,上面的就是上次的工作流,解决的是从用户的输入中解析出网址,并提交到数据库,等待爬取。

不同的是,我补充了一个提取多个网站信息的节点,方便用户同时提交多个网站,甚至是把一个多网站介绍的文章放进去,也能直接全部录入了。

下面的是这次新增的工作流,解决的是把用户提交的网站进行截图、生成SEO友好的详情。

对于网站截图,上一小节已经说了通过把python脚本部署成API后,新建http请求。

接下来看写网页详情的这个节点:

测试一下录入网站:https://www.reddit.com

数据库有了:

前端也有了:

详情页也写好了:

感兴趣可以进去看看:

https://www.aicoding.help/ai/Reddit

因为我服务器在海外,通过这样的形式,对于风控较高的Reddit也能正常截图,并不会出现拦截之类的。这也是为什么我要「多此一举」部署到线上的其中一个原因。

本文由人人都是产品经理作者【饼干哥哥】,微信公众号:【饼干哥哥AGI】,原创/授权 发布于人人都是产品经理,未经许可,禁止转载。

题图来自Unsplash,基于 CC0 协议。

更多精彩内容,请关注人人都是产品经理微信公众号或下载App
评论
评论请登录
  1. 文章技术干货满满,从截图到 SEO 生成有清晰思路,对出海建站很有启发。

    来自广东 回复
  2. AI技术太牛了,竟能把网站出海流程搞得这么高效!n8n搭建工作流、自动生成SEO介绍,这效率简直让人惊叹,博主的技术实力也太强了吧。

    来自山东 回复
专题
14144人已学习13篇文章
广告是互联网的最大的商业模式,已经逐步形成一个巨大的行业,整个互联网广告也在持续增长中。本专题的文章分享了关于对互联网广告的思考与分析
专题
12923人已学习12篇文章
随着互联网在大众生活中的不断普及与深入发展,互联网医疗这一全新的医疗健康服务业态发展趋势向好。本专题的文章分享了互联网医疗行业分析和竞品分析报告。
专题
35740人已学习18篇文章
借用别人家的经典案例,来扒一扒社交电商。
专题
14461人已学习13篇文章
本专题的文章分析了用户运营策略的案例,为如何做用户运营策略提供了思路。
专题
10310人已学习21篇文章
本专题的文章聚焦鸿蒙操作系统应用开发实践,通过典型案例解析开发流程与技巧。内容涉及ArkTS/JS语言特性、UI框架使用、设备协同等关键技术点,并包含性能优化与多设备适配等进阶知识,帮助开发者快速构建全场景智能应用。
专题
18000人已学习13篇文章
本专题的文章对整个商业模式进行了一个清晰的梳理和设计,并说明了商业模式如何变成可执行的路径。