拓冰网站定制 
TinyFish Cookbook部署Vercel完整指南环境变量管理、API密钥安全与常见坑位排查【免费下载链接】tinyfish-cookbookA collection of sample apps and recipes built with the TinyFish web agent. Open-source examples for you to learn build!项目地址: https://gitcode.com/gh_mirrors/ti/tinyfish-cookbookTinyFish Cookbook 是基于 TinyFish Web Agent网页智能体构建的开源示例应用合集收录了 30 个可直接运行的 Next.js 项目。本指南带你完整走一遍Vercel 部署流程从克隆仓库、配置环境变量到 API 密钥安全管理以及长任务超时等常见坑位排查帮助新手快速把任一样例应用到线上。部署前准备3 个先决条件准备项说明Node.js 18本地调试npm run dev需要Vercel 账号用于部署与托管环境变量TinyFish API 密钥Search / Fetch 端点免费开放无需信用卡每个示例项目都是独立文件夹一个独立 Next.js 工程部署时只部署你需要的那一个目录而不是整个仓库。项目总览与所有示例清单见 README.md。一键部署步骤从克隆到上线第 1 步克隆仓库git clone https://gitcode.com/gh_mirrors/ti/tinyfish-cookbook第 2 步本地先跑通推荐以 viet-bike-scout越南摩托车租赁比价工具为例cd viet-bike-scout npm install npm run dev # 打开 http://localhost:3000第 3 步导入 Vercel在 Vercel 控制台点击Add New Project导入仓库后Framework Preset 会自动识别为 Next.js关键动作只有一个在Root Directory中指定你选中的子目录如viet-bike-scout然后在 Environment Variables 页面粘贴密钥即可部署。环境变量管理.env.example 是最佳地图每个项目根目录都提供了环境变量模板文件先读它再配置是最快的上手方式viet-bike-scout/.env.example — 只需TINYFISH_API_KEYtinyskills/.env.local.example — 需要TINYFISH_API_KEYOPENAI_API_KEY或OPENROUTER_API_KEYresearch-sentry/.env.example — TinyFish OpenAIWhisper 语音转写worldcup-briefing/README.md — 最复杂数据库、加密密钥、多个第三方服务本地与线上的对应关系场景操作本地开发cp .env.example .env.local填入密钥Vercel 线上Project → Settings →Environment Variables逐条粘贴两个容易踩的细节Vercel 的环境变量要区分环境Production / Preview / Development。调试预览分支报缺密钥往往是因为只在 Production 勾了配置。.env.local已被 .gitignore 默认忽略本地密钥不会误提交但这也意味着线上密钥只能在 Vercel 控制台配置——忘了这一步是新手第一大坑。API 密钥安全3 条铁律铁律一密钥只放服务端环境变量。TINYFISH_API_KEY只在 API Route 中使用绝不能出现在前端代码里。带NEXT_PUBLIC_前缀的变量会被打包进浏览器代码对任何人都可见——所以这类前缀只用于真正要公开的变量如 worldcup-briefing/README.md 中的NEXT_PUBLIC_BASE_URL。铁律二启动时校验快速失败。viet-bike-scout 用 Zod 在 viet-bike-scout/src/lib/env.ts 中做校验密钥缺失时抛出清晰错误列出具体缺哪个变量而不是等到调用 API 时才收到 401。这是仓库内值得照抄的模式。铁律三需要保管用户密钥时必须加密存储。worldcup-briefing 允许用户在界面里填自己的 TinyFish / VideoDB 密钥源码用 AES-256-GCM 加密后才写入数据库并用 32 字节十六进制ENCRYPTION_SECRET作为加密主密钥——详见其 README 的环境变量清单。长任务坑位maxDuration 与流式输出Cookbook 里大量应用会并行派出多个浏览器 Agent单次请求可能持续几十秒到几分钟。Vercel 默认函数超时时间很短不配置必超时。仓库给了两套标准解法解法 A路由文件内声明Next.js 原生viet-bike-scout/src/app/api/search/route.ts 开头两行export const runtime nodejs; export const maxDuration 800;解法 Bvercel.json 集中配置多路由场景research-sentry/vercel.json 为语音/文本搜索路由设了 300 秒摘要路由 120 秒按需分级。配合 SSE 流式返回Agent 每完成一个站点就推送一条 Server-Sent Event界面立刻刷新局部结果——用户体感远快于等最慢的一个也不会撞上超时墙。这正是 viet-bike-scout 的 src/app/api/search/route.ts 的设计。 注意maxDuration超过免费版上限的路由需要升级 Vercel 套餐。部署后如出现Function invoked time exceeded错误优先检查这里。常见坑位排查清单 症状大概率原因排查方法API 返回 500提示TINYFISH_API_KEY is requiredVercel 没配环境变量或只配在了 DevelopmentSettings → Environment Variables 核对三档勾选本地正常、线上 401密钥复制不完整 / 前后有空格引号用curl直接带密钥打一次 Search 端点验证time exceeded超时未配置maxDuration或套餐不够对照上一节两个解法前端报TINYFISH_API_KEY未定义误以为本地.env会被部署带走本地.env.local不会上线只认控制台配置导入仓库后构建失败Root Directory 指向了仓库根目录多个 package.json 冲突Root Directory 改为具体子目录如tinyskills流式结果整页卡死最后一次性出现代理/中间层缓冲了 SSE确认路由返回的是ReadableStream且未开启响应压缩部署完成后的验证清单 ✅打开线上页面执行一次核心搜索如选城市触发比价浏览器 DevTools → Network 中确认/api/*返回 200 且 SSE 事件持续流入Vercel 控制台 → Deployments → 查看函数日志确认无Missing or invalid environment variables预览环境Preview URL也测一遍确保多环境密钥配置无误。按以上流程你可以把仓库里任意一个 Next.js 样例比价工具、AI 问答、技能生成器等在 15 分钟内部署上线并建立起一套可复用的密钥管理与超时排查习惯。更多样例的部署说明可直接阅读对应目录下的 README如 silicon-signal/README.md、research-sentry/README.md。【免费下载链接】tinyfish-cookbookA collection of sample apps and recipes built with the TinyFish web agent. Open-source examples for you to learn build!项目地址: https://gitcode.com/gh_mirrors/ti/tinyfish-cookbook创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 TinyFish Cookbook部署Vercel完整指南：环境变量管理、API密钥安全与常见坑位排查
TinyFish Cookbook部署Vercel完整指南环境变量管理、API密钥安全与常见坑位排查【免费下载链接】tinyfish-cookbookA collection of sample apps and recipes built with the TinyFish web agent. Open-source examples for you to learn build!项目地址: https://gitcode.com/gh_mirrors/ti/tinyfish-cookbookTinyFish Cookbook 是基于 TinyFish Web Agent网页智能体构建的开源示例应用合集收录了 30 个可直接运行的 Next.js 项目。本指南带你完整走一遍Vercel 部署流程从克隆仓库、配置环境变量到 API 密钥安全管理以及长任务超时等常见坑位排查帮助新手快速把任一样例应用到线上。部署前准备3 个先决条件准备项说明Node.js 18本地调试npm run dev需要Vercel 账号用于部署与托管环境变量TinyFish API 密钥Search / Fetch 端点免费开放无需信用卡每个示例项目都是独立文件夹一个独立 Next.js 工程部署时只部署你需要的那一个目录而不是整个仓库。项目总览与所有示例清单见 README.md。一键部署步骤从克隆到上线第 1 步克隆仓库git clone https://gitcode.com/gh_mirrors/ti/tinyfish-cookbook第 2 步本地先跑通推荐以 viet-bike-scout越南摩托车租赁比价工具为例cd viet-bike-scout npm install npm run dev # 打开 http://localhost:3000第 3 步导入 Vercel在 Vercel 控制台点击Add New Project导入仓库后Framework Preset 会自动识别为 Next.js关键动作只有一个在Root Directory中指定你选中的子目录如viet-bike-scout然后在 Environment Variables 页面粘贴密钥即可部署。环境变量管理.env.example 是最佳地图每个项目根目录都提供了环境变量模板文件先读它再配置是最快的上手方式viet-bike-scout/.env.example — 只需TINYFISH_API_KEYtinyskills/.env.local.example — 需要TINYFISH_API_KEYOPENAI_API_KEY或OPENROUTER_API_KEYresearch-sentry/.env.example — TinyFish OpenAIWhisper 语音转写worldcup-briefing/README.md — 最复杂数据库、加密密钥、多个第三方服务本地与线上的对应关系场景操作本地开发cp .env.example .env.local填入密钥Vercel 线上Project → Settings →Environment Variables逐条粘贴两个容易踩的细节Vercel 的环境变量要区分环境Production / Preview / Development。调试预览分支报缺密钥往往是因为只在 Production 勾了配置。.env.local已被 .gitignore 默认忽略本地密钥不会误提交但这也意味着线上密钥只能在 Vercel 控制台配置——忘了这一步是新手第一大坑。API 密钥安全3 条铁律铁律一密钥只放服务端环境变量。TINYFISH_API_KEY只在 API Route 中使用绝不能出现在前端代码里。带NEXT_PUBLIC_前缀的变量会被打包进浏览器代码对任何人都可见——所以这类前缀只用于真正要公开的变量如 worldcup-briefing/README.md 中的NEXT_PUBLIC_BASE_URL。铁律二启动时校验快速失败。viet-bike-scout 用 Zod 在 viet-bike-scout/src/lib/env.ts 中做校验密钥缺失时抛出清晰错误列出具体缺哪个变量而不是等到调用 API 时才收到 401。这是仓库内值得照抄的模式。铁律三需要保管用户密钥时必须加密存储。worldcup-briefing 允许用户在界面里填自己的 TinyFish / VideoDB 密钥源码用 AES-256-GCM 加密后才写入数据库并用 32 字节十六进制ENCRYPTION_SECRET作为加密主密钥——详见其 README 的环境变量清单。长任务坑位maxDuration 与流式输出Cookbook 里大量应用会并行派出多个浏览器 Agent单次请求可能持续几十秒到几分钟。Vercel 默认函数超时时间很短不配置必超时。仓库给了两套标准解法解法 A路由文件内声明Next.js 原生viet-bike-scout/src/app/api/search/route.ts 开头两行export const runtime nodejs; export const maxDuration 800;解法 Bvercel.json 集中配置多路由场景research-sentry/vercel.json 为语音/文本搜索路由设了 300 秒摘要路由 120 秒按需分级。配合 SSE 流式返回Agent 每完成一个站点就推送一条 Server-Sent Event界面立刻刷新局部结果——用户体感远快于等最慢的一个也不会撞上超时墙。这正是 viet-bike-scout 的 src/app/api/search/route.ts 的设计。 注意maxDuration超过免费版上限的路由需要升级 Vercel 套餐。部署后如出现Function invoked time exceeded错误优先检查这里。常见坑位排查清单 症状大概率原因排查方法API 返回 500提示TINYFISH_API_KEY is requiredVercel 没配环境变量或只配在了 DevelopmentSettings → Environment Variables 核对三档勾选本地正常、线上 401密钥复制不完整 / 前后有空格引号用curl直接带密钥打一次 Search 端点验证time exceeded超时未配置maxDuration或套餐不够对照上一节两个解法前端报TINYFISH_API_KEY未定义误以为本地.env会被部署带走本地.env.local不会上线只认控制台配置导入仓库后构建失败Root Directory 指向了仓库根目录多个 package.json 冲突Root Directory 改为具体子目录如tinyskills流式结果整页卡死最后一次性出现代理/中间层缓冲了 SSE确认路由返回的是ReadableStream且未开启响应压缩部署完成后的验证清单 ✅打开线上页面执行一次核心搜索如选城市触发比价浏览器 DevTools → Network 中确认/api/*返回 200 且 SSE 事件持续流入Vercel 控制台 → Deployments → 查看函数日志确认无Missing or invalid environment variables预览环境Preview URL也测一遍确保多环境密钥配置无误。按以上流程你可以把仓库里任意一个 Next.js 样例比价工具、AI 问答、技能生成器等在 15 分钟内部署上线并建立起一套可复用的密钥管理与超时排查习惯。更多样例的部署说明可直接阅读对应目录下的 README如 silicon-signal/README.md、research-sentry/README.md。【免费下载链接】tinyfish-cookbookA collection of sample apps and recipes built with the TinyFish web agent. Open-source examples for you to learn build!项目地址: https://gitcode.com/gh_mirrors/ti/tinyfish-cookbook创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考