Next AI Draw.io 如何部署到 Cloudflare Workers 并注册 workers.dev 子域名【免费下载链接】next-ai-draw-ioA next.js web application that integrates AI capabilities with draw.io diagrams. This app allows you to create, modify, and enhance diagrams through natural language commands and AI-assisted visualization.项目地址: https://gitcode.com/GitHub_Trending/ne/next-ai-draw-io把 Next AI Draw.io 发布到 Cloudflare Workers 上最终得到的是一个可通过https://worker-name.你的子域名.workers.dev访问的在线应用。整个流程依赖 OpenNext 适配器opennextjs/cloudflare把 Next.js 应用转换成 Worker再用 Wrangler 发布。开始前需要满足以下条件一个 Cloudflare 账户免费版即可完成基本部署只有启用 R2 做 ISR 缓存才需要绑定支付方式Node.js 18Wrangler CLI项目已将wrangler列入 devDependencies执行npm install后即可使用构建环境为 Linux 或 macOS。原生 Windows 上 OpenNext 和 Wrangler 不完全可靠WASM 文件路径问题可能导致构建失败文档建议使用 GitHub Codespaces 或 WSL (Linux)。完整的官方说明见 docs/en/cloudflare-deploy.md中文版本见 docs/cn/cloudflare-deploy.md。登录 Cloudflare 并安装依赖在仓库根目录安装依赖Wrangler CLI 会作为开发依赖一并安装npm install然后用 Wrangler 登录 Cloudflare 账户npx wrangler login登录成功后才能在后续步骤中上传静态资源并发布 Worker。配置环境变量Cloudflare 的本地测试与部署使用.dev.vars作为环境变量文件而常规 Next.js 开发使用.env.local。按文档要求两个文件都要创建# 用于 Cloudflare 本地调试 部署 cp env.example .dev.vars # 用于常规 Next.js 开发 cp env.example .env.local两个文件填入相同的值。env.example 中包含 AI Provider 配置项例如AI_PROVIDER默认bedrock、AI_MODEL必填可逗号分隔多个模型 ID第一个为默认模型以及各供应商的 API Key 等可选配置。应用能调用 AI 生成图表的前提是在这里填好对应的模型与密钥。选择部署类型不带 R2 或带 R2这一步决定两个配置文件的内容open-next.config.ts 和 wrangler.jsonc。主路径不带 R2免费、配置最简单如果不需要 ISR 缓存open-next.config.ts使用空配置即可import { defineCloudflareConfig } from opennextjs/cloudflare/config export default defineCloudflareConfig({})wrangler.jsonc中去掉r2_buckets字段{ $schema: node_modules/wrangler/config-schema.json, main: .open-next/worker.js, name: next-ai-draw-io-worker, compatibility_date: 2025-12-08, compatibility_flags: [nodejs_compat, global_fetch_strictly_public], assets: { directory: .open-next/assets, binding: ASSETS }, services: [ { binding: WORKER_SELF_REFERENCE, service: next-ai-draw-io-worker } ] }注意compatibility_date必须是当天或过去的日期仓库中的 wrangler.jsonc 里也有一条注释强调这一点。可选分支带 R2完整 ISR 支持R2 开启 Next.js 的增量静态再生ISR缓存需要在 Cloudflare 账户中绑定支付方式。在 Cloudflare 控制台创建 R2 存储桶进入Storage Databases → R2点击Create bucket命名为next-inc-cache。open-next.config.ts启用 R2 增量缓存import { defineCloudflareConfig } from opennextjs/cloudflare/config import r2IncrementalCache from opennextjs/cloudflare/overrides/incremental-cache/r2-incremental-cache export default defineCloudflareConfig({ incrementalCache: r2IncrementalCache, })wrangler.jsonc中加入r2_buckets段r2_buckets: [ { binding: NEXT_INC_CACHE_R2_BUCKET, bucket_name: next-inc-cache } ]bucket_name必须与控制台中创建的桶名完全一致。需要说明的是当前仓库中这两个文件正处于带 R2 的配置状态wrangler.jsonc 含r2_bucketsopen-next.config.ts 启用了r2IncrementalCache。如果你的账户没有启用 R2要么按上文切换到不带 R2 的配置要么先启用 R2否则部署时会报 R2 相关错误见后文排查章节。两种方案的差异如下摘自部署文档功能不使用 R2使用 R2成本免费需要绑定支付方式ISR 缓存无有静态页面支持支持API 路由支持支持配置复杂度简单中等文档的建议是测试或简单应用选不带 R2需要 ISR 缓存的生产应用选带 R2。注册 workers.dev 子域名仅首次部署需要首次部署前账户下必须有一个 workers.dev 子域名有两种注册方式方式一通过 Cloudflare 控制台推荐登录 Cloudflare 控制台进入Workers Pages → Overview → Set up a subdomain按提示完成注册。方式二在部署过程中注册运行npm run deploy时Wrangler 可能会提示Would you like to register a workers.dev subdomain? (Y/n)输入Y并选择子域名名称即可。注意在 CI/CD 或非交互式环境中这个提示不会出现这类环境应提前通过控制台注册子域名。执行部署并验证结果如果想在部署前先在本地预览 Worker可选npm run preview该脚本执行opennextjs-cloudflare build opennextjs-cloudflare preview。确认无误后执行正式部署npm run deploypackage.json 中该脚本对应opennextjs-cloudflare build opennextjs-cloudflare deploy一次完成四件事构建 Next.js 应用、通过 OpenNext 转换成 Cloudflare Worker、上传静态资源、发布 Worker。部署完成后应用可通过以下地址访问https://worker-name.your-subdomain.workers.dev使用默认配置时 worker 名为next-ai-draw-io-worker即https://next-ai-draw-io-worker.your-subdomain.workers.dev。浏览器打开该地址能看到应用页面即表示发布成功打不开时对照下面的报错表逐项检查。常见报错与修复部署文档列出了以下几种报错现象及对应处理You need to register a workers.dev subdomain账户下没有注册 workers.dev 子域名。到控制台的Workers Pages → Set up a subdomain注册后重新部署。Please enable R2 through the Cloudflare Dashboardwrangler.jsonc里配置了 R2但账户尚未启用该功能。要么在控制台启用 R2需要支付方式要么改用不带 R2 的配置。No R2 binding NEXT_INC_CACHE_R2_BUCKET foundwrangler.jsonc缺少r2_buckets配置。补上r2_buckets段或改用不带 R2 的配置。Cant set compatibility date in the futurecompatibility_date被设成了未来日期。改成当天或更早的日期。Windows 报错resvg.wasm?module(ENOENT)Windows 文件名不能包含?而某个 wasm 资源文件名中带有?module。在 Linux 环境WSL、Codespaces 或 CI上执行构建与部署。部署完成后的地址和限制就到此为止不带 R2 的部署是免费的但没有 ISR 缓存带 R2 的部署有 ISR 缓存前提是账户已启用 R2 且桶名与bucket_name完全一致。【免费下载链接】next-ai-draw-ioA next.js web application that integrates AI capabilities with draw.io diagrams. This app allows you to create, modify, and enhance diagrams through natural language commands and AI-assisted visualization.项目地址: https://gitcode.com/GitHub_Trending/ne/next-ai-draw-io创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Next AI Draw.io 如何部署到 Cloudflare Workers 并注册 workers.dev 子域名
Next AI Draw.io 如何部署到 Cloudflare Workers 并注册 workers.dev 子域名【免费下载链接】next-ai-draw-ioA next.js web application that integrates AI capabilities with draw.io diagrams. This app allows you to create, modify, and enhance diagrams through natural language commands and AI-assisted visualization.项目地址: https://gitcode.com/GitHub_Trending/ne/next-ai-draw-io把 Next AI Draw.io 发布到 Cloudflare Workers 上最终得到的是一个可通过https://worker-name.你的子域名.workers.dev访问的在线应用。整个流程依赖 OpenNext 适配器opennextjs/cloudflare把 Next.js 应用转换成 Worker再用 Wrangler 发布。开始前需要满足以下条件一个 Cloudflare 账户免费版即可完成基本部署只有启用 R2 做 ISR 缓存才需要绑定支付方式Node.js 18Wrangler CLI项目已将wrangler列入 devDependencies执行npm install后即可使用构建环境为 Linux 或 macOS。原生 Windows 上 OpenNext 和 Wrangler 不完全可靠WASM 文件路径问题可能导致构建失败文档建议使用 GitHub Codespaces 或 WSL (Linux)。完整的官方说明见 docs/en/cloudflare-deploy.md中文版本见 docs/cn/cloudflare-deploy.md。登录 Cloudflare 并安装依赖在仓库根目录安装依赖Wrangler CLI 会作为开发依赖一并安装npm install然后用 Wrangler 登录 Cloudflare 账户npx wrangler login登录成功后才能在后续步骤中上传静态资源并发布 Worker。配置环境变量Cloudflare 的本地测试与部署使用.dev.vars作为环境变量文件而常规 Next.js 开发使用.env.local。按文档要求两个文件都要创建# 用于 Cloudflare 本地调试 部署 cp env.example .dev.vars # 用于常规 Next.js 开发 cp env.example .env.local两个文件填入相同的值。env.example 中包含 AI Provider 配置项例如AI_PROVIDER默认bedrock、AI_MODEL必填可逗号分隔多个模型 ID第一个为默认模型以及各供应商的 API Key 等可选配置。应用能调用 AI 生成图表的前提是在这里填好对应的模型与密钥。选择部署类型不带 R2 或带 R2这一步决定两个配置文件的内容open-next.config.ts 和 wrangler.jsonc。主路径不带 R2免费、配置最简单如果不需要 ISR 缓存open-next.config.ts使用空配置即可import { defineCloudflareConfig } from opennextjs/cloudflare/config export default defineCloudflareConfig({})wrangler.jsonc中去掉r2_buckets字段{ $schema: node_modules/wrangler/config-schema.json, main: .open-next/worker.js, name: next-ai-draw-io-worker, compatibility_date: 2025-12-08, compatibility_flags: [nodejs_compat, global_fetch_strictly_public], assets: { directory: .open-next/assets, binding: ASSETS }, services: [ { binding: WORKER_SELF_REFERENCE, service: next-ai-draw-io-worker } ] }注意compatibility_date必须是当天或过去的日期仓库中的 wrangler.jsonc 里也有一条注释强调这一点。可选分支带 R2完整 ISR 支持R2 开启 Next.js 的增量静态再生ISR缓存需要在 Cloudflare 账户中绑定支付方式。在 Cloudflare 控制台创建 R2 存储桶进入Storage Databases → R2点击Create bucket命名为next-inc-cache。open-next.config.ts启用 R2 增量缓存import { defineCloudflareConfig } from opennextjs/cloudflare/config import r2IncrementalCache from opennextjs/cloudflare/overrides/incremental-cache/r2-incremental-cache export default defineCloudflareConfig({ incrementalCache: r2IncrementalCache, })wrangler.jsonc中加入r2_buckets段r2_buckets: [ { binding: NEXT_INC_CACHE_R2_BUCKET, bucket_name: next-inc-cache } ]bucket_name必须与控制台中创建的桶名完全一致。需要说明的是当前仓库中这两个文件正处于带 R2 的配置状态wrangler.jsonc 含r2_bucketsopen-next.config.ts 启用了r2IncrementalCache。如果你的账户没有启用 R2要么按上文切换到不带 R2 的配置要么先启用 R2否则部署时会报 R2 相关错误见后文排查章节。两种方案的差异如下摘自部署文档功能不使用 R2使用 R2成本免费需要绑定支付方式ISR 缓存无有静态页面支持支持API 路由支持支持配置复杂度简单中等文档的建议是测试或简单应用选不带 R2需要 ISR 缓存的生产应用选带 R2。注册 workers.dev 子域名仅首次部署需要首次部署前账户下必须有一个 workers.dev 子域名有两种注册方式方式一通过 Cloudflare 控制台推荐登录 Cloudflare 控制台进入Workers Pages → Overview → Set up a subdomain按提示完成注册。方式二在部署过程中注册运行npm run deploy时Wrangler 可能会提示Would you like to register a workers.dev subdomain? (Y/n)输入Y并选择子域名名称即可。注意在 CI/CD 或非交互式环境中这个提示不会出现这类环境应提前通过控制台注册子域名。执行部署并验证结果如果想在部署前先在本地预览 Worker可选npm run preview该脚本执行opennextjs-cloudflare build opennextjs-cloudflare preview。确认无误后执行正式部署npm run deploypackage.json 中该脚本对应opennextjs-cloudflare build opennextjs-cloudflare deploy一次完成四件事构建 Next.js 应用、通过 OpenNext 转换成 Cloudflare Worker、上传静态资源、发布 Worker。部署完成后应用可通过以下地址访问https://worker-name.your-subdomain.workers.dev使用默认配置时 worker 名为next-ai-draw-io-worker即https://next-ai-draw-io-worker.your-subdomain.workers.dev。浏览器打开该地址能看到应用页面即表示发布成功打不开时对照下面的报错表逐项检查。常见报错与修复部署文档列出了以下几种报错现象及对应处理You need to register a workers.dev subdomain账户下没有注册 workers.dev 子域名。到控制台的Workers Pages → Set up a subdomain注册后重新部署。Please enable R2 through the Cloudflare Dashboardwrangler.jsonc里配置了 R2但账户尚未启用该功能。要么在控制台启用 R2需要支付方式要么改用不带 R2 的配置。No R2 binding NEXT_INC_CACHE_R2_BUCKET foundwrangler.jsonc缺少r2_buckets配置。补上r2_buckets段或改用不带 R2 的配置。Cant set compatibility date in the futurecompatibility_date被设成了未来日期。改成当天或更早的日期。Windows 报错resvg.wasm?module(ENOENT)Windows 文件名不能包含?而某个 wasm 资源文件名中带有?module。在 Linux 环境WSL、Codespaces 或 CI上执行构建与部署。部署完成后的地址和限制就到此为止不带 R2 的部署是免费的但没有 ISR 缓存带 R2 的部署有 ISR 缓存前提是账户已启用 R2 且桶名与bucket_name完全一致。【免费下载链接】next-ai-draw-ioA next.js web application that integrates AI capabilities with draw.io diagrams. This app allows you to create, modify, and enhance diagrams through natural language commands and AI-assisted visualization.项目地址: https://gitcode.com/GitHub_Trending/ne/next-ai-draw-io创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考