开源 Tap4 AI Web 用户界面

这是一个来自 Tap4 AI 工具目录的开源 AI 工具目录项目。我们的目标是让每个人都能轻松拥有自己的 AI 工具目录，收集自己喜欢的 AI 工具产品。这个项目非常轻量级且易于维护，适合对 AI 导航网站感兴趣的个人开发者，也适合对 NextJs 感兴趣的学习者。欢迎大家 fork 和 star。

简体中文 | 英文

在 Product Hunt 上支持 Tap4 AI

2.0.0 版本更新说明

AI 网站数据使用 supabase 数据库存储。
与 Tap4 AI 爬虫项目对接，支持全自动提交和采集。
支持简单的分类和搜索。

注意：如果您不熟悉数据库，或担心与 1.0.0 版本的兼容性问题，请点击切换到 1.0.0 版本分支。

技术栈说明

使用 NEXT 14 和 app 路由（React 服务器组件）。
Supabase 无服务器数据库。
国际化。
SEO 友好（支持国际化）。
动态 sitemap.xml（支持国际化）。
Tailwind CSS。

前端页面截图

tap4-ai

关注和支持链接

请关注我们的 Twitter：https://x.com/tap4ai

如果您觉得项目有帮助，请考虑给我买杯咖啡：

如果您对项目感兴趣，请添加我的微信：helloleo2023，备注："tap4 ai 开源"

部署说明

部署 Tap4 AI 爬虫

详见 Tap4 AI 爬虫。部署后，可以使用平台域名或自定义域名作为生成 AI 工具网页内容的 API 接口（如 https://{crawler_domain}/site/crawl，其中 {crawler_domain} 为您的具体域名）。

需要在 CRAWLER_API 环境变量中配置。

创建 Supabase 数据库并执行 SQL 脚本

在 Supabase 注册，创建数据库，记录 SUPABASE_URL 和 SUPABASE_ANON_KEY，用于后续 Vercel 环境变量部署。
在 Supabase 后台执行项目 db 目录下的 SQL 文件：create_table.sql、insert_category_data.sql、insert_data.sql。

注意：如需修改数据，可以参考 SQL 文件或直接在 Supabase 后台编辑。

在 Vercel 上部署（不要忘记设置环境变量）

环境参数如下：注意：所有 key 都需要，NEXT_PUBLIC_SITE_URL、NEXT_PUBLIC_SUPABASE_URL、NEXT_PUBLIC_SUPABASE_ANON_KEY 的值需要填写正确

# 您的域名
NEXT_PUBLIC_SITE_URL="https://tap4.ai"

# Google 跟踪 ID 和广告 URL
GOOGLE_TRACKING_ID="G-XXXXXXX" GOOGLE_ADSENSE_URL="https://xxxx.googlesyndication.com/xxxxx/xxxxx"

# 底部联系邮箱
CONTACT_US_EMAIL="contact@tap4.ai"

# Supabase 数据库 URL 和密钥
NEXT_PUBLIC_SUPABASE_URL="https://xxxyyyzzz.supabase.co"
NEXT_PUBLIC_SUPABASE_ANON_KEY="XXX.YYY.ZZZ"

# 网页爬虫 API 接口
CRAWLER_API="https://{crawler_domain}/site/crawl_async"

# 爬虫接口验证密钥
CRAWLER_API_KEY="xxxx"

# 自定义接口验证密钥
CRON_AUTH_KEY="keyxxxx"

# 提交 API 验证密钥
SUBMIT_AUTH_KEY="xxxx"

注意：此版本使用 Vercel 的定时任务自动读取和提交网站并生成网站结果。

Vercel 免费版：每天只支持一次调用，可以手动调用 {domain}/api/cron，使用 POST，Header：{"Authorization":"Bearer auth_key"}，其中 auth_key 为自定义配置的环境变量。
Vercel Pro 版：可以参考此文档配置 Vercel Cron Jobs。

本地运行

安装

Node
NVM
PNPM

设置

克隆此项目

git clone https://github.com/6677-ai/tap4-ai-webui.git

创建 Supabase 数据库并执行 SQL 脚本

在Supabase上注册，创建一个数据库，并记录SUPABASE_URL和SUPABASE_ANON_KEY，以便后续在Vercel环境变量中部署。在Supabase后端执行项目db目录中的SQL文件：create_table.sql、insert_category_data.sql、insert_data.sql。

注意：如果需要修改数据，可以参考SQL文件或直接在Supabase后端进行编辑。

设置环境变量

在根目录创建一个.env.local文件，并填入具体值，如下所示：

注意：所有键都是必需的，包括NEXT_PUBLIC_SITE_URL、NEXT_PUBLIC_SUPABASE_URL、NEXT_PUBLIC_SUPABASE_ANON_KEY在内的值需要填写正确

# 你的域名
NEXT_PUBLIC_SITE_URL="https://tap4.ai"

# Google跟踪ID和广告URL
GOOGLE_TRACKING_ID="G-XXXXXXX"
GOOGLE_ADSENSE_URL="https://xxxx.googlesyndication.com/xxxxx/xxxxx"

# 底部联系邮箱
CONTACT_US_EMAIL="contact@tap4.ai"

# Supabase数据库URL和密钥
NEXT_PUBLIC_SUPABASE_URL="https://xxxyyyzzz.supabase.co"
NEXT_PUBLIC_SUPABASE_ANON_KEY="XXX.YYY.ZZZ"

# 网络爬虫API接口
CRAWLER_API="https://craw_domain/site/crawl_async"

# 爬虫接口验证密钥
CRAWLER_API_KEY="xxxx"

# 自定义接口验证密钥
CRON_AUTH_KEY="keyxxxx"

# 提交API验证密钥
SUBMIT_AUTH_KEY="xxxx"