综合介绍
Tap4 AI WebUI 是一个开源的轻量级AI工具导航网站项目,旨在帮助用户轻松搭建自己的AI工具目录。该项目采用了Next.js和Supabase技术栈,支持多语言SEO优化,提供AI工具的分类筛选、搜索和详细展示功能,配合Tap4 AI Crawler项目支持自动化抓取网页。无论是AI爱好者还是开发者,都可以通过这个项目快速构建自己的AI工具导航网站。
功能列表
- AI工具列表展示:支持展示丰富的AI工具信息
- 分类筛选:支持按类别浏览AI工具
- 搜索功能:提供AI工具搜索功能
- 详情展示:支持展示AI工具的Markdown格式详细介绍
- SEO友好:支持多语言的SEO优化
使用帮助
安装流程
- 部署Tap4 AI Crawler:
- 首先需要部署 Tap4 AI Crawler 项目。部署完成后,可以使用平台域名或自定义域名作为生成AI工具网页内容的API接口。
- Tap4.AI Crawler功能:网站自动截屏及上传到Cloudflare R2。支持爬取网站详细介绍,并通过AI生成网站的title、description及Markdown格式的具体介绍。
- 创建Supabase数据库并执行SQL脚本:
- 在 Supabase 注册并创建数据库,记录SUPABASE_URL和SUPABASE_ANON_KEY,用于后续Vercel环境变量配置。
- 在Supabase后台执行项目db目录中的SQL文件:create_table.sql、insert_category_data.sql、insert_data.sql。
- 在Vercel上部署:
- 点击此处,按照提示进行部署。注意:不要忘记设置环境变量!
- 环境变量配置示例:
NEXT_PUBLIC_SITE_URL="https://tap4.ai" GOOGLE_TRACKING_ID="G-XXXXXXX" GOOGLE_ADSENSE_URL="https://xxxx.googlesyndication.com/xxxxx/xxxxx" CONTACT_US_EMAIL="contact@tap4.ai" NEXT_PUBLIC_SUPABASE_URL="https://xxxyyyzzz.supabase.co" NEXT_PUBLIC_SUPABASE_ANON_KEY="XXX.YYY.ZZZ" CRAWLER_API="https://{crawler_domain}/site/crawl_async" CRAWLER_API_KEY="xxxx" CRON_AUTH_KEY="keyxxxx" SUBMIT_AUTH_KEY="xxxx"
- 本地运行:
- 克隆项目:
git clone https://github.com/6677-ai/tap4-ai-webui.git
- 安装依赖:
Node NVM PNPM
- 设置环境变量:在根目录创建
.env.local
文件,填入相应的环境变量值 - 运行开发模式:
pnpm dev
- 克隆项目:
- 内容更新:
- 手动修改数据库:直接修改Supabase中的web_navigation表数据
- 爬虫自动更新:如果爬虫失败,可以手动查询submit表,然后创建相关网站内容并插入web_navigation表