Tap4 AI WebUI：开源轻量级AI工具导航项目

综合介绍

Tap4 AI WebUI 是一个开源的轻量级AI工具导航网站项目，旨在帮助用户轻松搭建自己的AI工具目录。该项目采用了Next.js和Supabase技术栈，支持多语言SEO优化，提供AI工具的分类筛选、搜索和详细展示功能，配合Tap4 AI Crawler项目支持自动化抓取网页。无论是AI爱好者还是开发者，都可以通过这个项目快速构建自己的AI工具导航网站。

功能列表

• AI工具列表展示：支持展示丰富的AI工具信息
• 分类筛选：支持按类别浏览AI工具
• 搜索功能：提供AI工具搜索功能
• 详情展示：支持展示AI工具的Markdown格式详细介绍
• SEO友好：支持多语言的SEO优化

使用帮助

安装流程

1. 部署Tap4 AI Crawler：
   • 首先需要部署 Tap4 AI Crawler 项目。部署完成后，可以使用平台域名或自定义域名作为生成AI工具网页内容的API接口。
   • Tap4.AI Crawler功能:网站自动截屏及上传到Cloudflare R2。支持爬取网站详细介绍，并通过AI生成网站的title、description及Markdown格式的具体介绍。
2. 创建Supabase数据库并执行SQL脚本：
   • 在 Supabase 注册并创建数据库，记录SUPABASE_URL和SUPABASE_ANON_KEY，用于后续Vercel环境变量配置。
   • 在Supabase后台执行项目db目录中的SQL文件：create_table.sql、insert_category_data.sql、insert_data.sql。
3. 在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"
     

1. 本地运行：
   • 克隆项目：git clone https://github.com/6677-ai/tap4-ai-webui.git
   • 安装依赖：Node NVM PNPM
   • 设置环境变量：在根目录创建.env.local文件，填入相应的环境变量值
   • 运行开发模式：pnpm dev
2. 内容更新：
   • 手动修改数据库：直接修改Supabase中的web_navigation表数据
   • 爬虫自动更新：如果爬虫失败，可以手动查询submit表，然后创建相关网站内容并插入web_navigation表