Reflex AI Builder 的 Anthropic 集成为你的 Web App 接入 Claude 模型【免费下载链接】reflex️ Web apps in pure Python 项目地址: https://gitcode.com/GitHub_Trending/re/reflexReflex AI Builder 内置了 Anthropic 集成让你的 App 可以直接调用 Anthropic 的 Claude 系列模型用于文本生成、内容摘要、推理分析等高级 AI 能力。本文基于当前仓库中的集成文档完整讲解从获取 API Key、在 App 中配置集成到安全使用凭据的完整链路并补充仓库中 Secrets 机制与外部 API 调用的最佳实践帮助你快速搭建一个可安全调用 Claude 的应用。集成概览Anthropic 在 Reflex AI Builder 中的定位Anthropic 集成属于 Reflex AI Builder 的First Class Integrations一等集成之一。从当前仓库的文档导航源码可以看到该集成被收录在 First Class Integrations 分组中与 AWS、Google Auth、OpenAI、Gemini 等并列导航定义源码 中通过ai_builder.integrations.anthropic引用了本集成页面集成文档本体位于 packages/integrations-docs/src/integrations_docs/docs/anthropic.md归类为AI标签描述为“将你的 App 连接到 Anthropic 的 Claude 模型以获取高级 AI 能力”。这意味着该集成并非 Reflex 核心框架的一部分而是 AI Builder即 Reflex 的 AI 原生应用构建平台内建的服务接入能力。完成配置后你可以在以下场景直接使用 Claude工作流Workflows在应用的后台逻辑中调用 Claude 处理文本UI 动作UI actions由用户点击、表单提交等前端事件触发模型调用自动化触发器Automated triggers在定时任务或事件驱动的流程中自动调用。Step 1获取 Anthropic API Key在配置集成之前你需要一个有效的 Anthropic API Key。按照官方控制台流程操作打开Anthropic ConsoleAnthropic 官方控制台进入账号设置中的API Keys页面点击Create Key创建新密钥并给它一个有辨识度的名称例如AI Builder便于日后在多个 Key 中区分用途复制生成的密钥。生成的密钥形如sk-ant-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx⚠️密钥只在创建时完整显示一次请立即保存到安全位置之后无法再次查看完整值。Step 2在 App 中配置 Anthropic 集成拿到 API Key 后在 Reflex AI Builder 中完成连接进入你的 App 设置找到Integrations → Add Anthropic在输入框中粘贴你的Anthropic API Key点击Connect平台会校验并保存该集成。连接成功后你的 App 便可以在工作流和组件中使用 Claude 实现 AI 功能。关于集成凭证的存放位置仓库中的 Integrations 文档 明确了一个重要原则集成凭证应填写在集成表单的 secret 字段中而不是放进通用 Secrets 或其他位置。同时Secrets 文档 也强调不要将 API Key 粘贴到对话chat、知识库knowledge、源码或截图中。正确的做法是让 Builder 按名称引用环境变量而值只存在于集成的加密存储中。Step 3连接后如何在代码中使用集成建立后凭据会以环境变量的形式在运行时注入到你的 App 中。后端 Python 代码可以通过os.environ读取import os # 读取 Anthropic API Key值由平台注入不要硬编码 anthropic_api_key os.environ[ANTHROPIC_API_KEY]之后你可以使用该 Key 通过 Anthropic 的 API 发起请求。典型调用路径是前端事件如按钮点击、表单提交→ 后端事件处理器 → 使用 Key 调用 Claude → 将结果写回 State 并渲染到界面。关键约束凭据只能用于后端仓库的 Secrets 文档 明确警告Do not read a secret in browser-executed code or send it to the frontend.即不要在浏览器端执行的代码中读取密钥也不要把密钥发送到前端。所有使用 Claude 的请求必须发生在服务端backend code前端只接收最终结果。否则密钥会暴露在客户端任何人都可以从浏览器网络面板中提取。如果你希望由 AI Builder 的 Agent 自动生成调用逻辑可以在提示词中这样描述只提变量名、不给值Use the ANTHROPIC_API_KEY environment variable for server-side Anthropic calls. Do not expose it in client-side code or logs.安全要点与最佳实践原文档在 Step 3 的 Notes 中给出了三条安全准则这里结合仓库的 Secrets 文档 与 Integrations 文档 展开说明1. 密钥绝不硬编码不要把 Anthropic API Key 直接写进公开代码仓库、rxconfig.py或组件源码中。密钥泄漏后可能被他人盗用产生费用且难以追踪。集成表单和 Secrets 存储就是为了避免硬编码而设计的。2. 按环境区分密钥为开发dev、预发布staging、生产production环境分别使用不同的 Key有助于隔离各环境的调用量与费用单独吊销某一环境的密钥而不影响其他环境限制生产密钥的暴露面。3. 安全地调用 API调用放在后端密钥允许 App 与 Anthropic 端点安全交互但只应在服务端发起不要记录敏感数据不要在日志中输出 Key、Token 或敏感响应内容验证输入对用户可控的输入先做校验再发送给模型测试后再上生产先使用测试数据确认集成行为正确再切换生产凭证。密钥的更新、轮换与删除仓库的 Secrets 文档 还说明了后续维护方式轮换打开密钥的操作菜单选择Edit替换值即可完成轮换轮换后应到 Anthropic 控制台吊销旧 Key删除选择Delete从当前作用域移除删除前先确认哪些 App 依赖它避免认证中断原始编辑器Raw editor管理多个NAMEVALUE键值对时使用每行一对保存时会整体替换该作用域的全部密钥请逐行检查后再保存。作用域项目级 vs App 级作用域管理位置适用场景项目级 Secrets项目侧边栏的Secrets多个 App 共享的开发凭证App 级 SecretsApp 更多菜单中的Secrets需要与其他 App 不同的值同名冲突时App 级值覆盖项目级值。Anthropic 集成凭证属于集成表单范畴不属于上述两个通用作用域。与其他机制的配合使用自定义集成Custom Integration如果你的场景不只是调用 Claude而是需要组合多个服务可以在项目设置中创建自定义集成把服务说明、认证方式按名称引用密钥与可选 Secrets 组织在一起让 Builder 在生成 App 时自动遵守这些约定。详见 Integrations 文档。直接调用外部 API当服务只有 HTTP API 而没有现成集成时可以直接使用 外部 API 调用指南 中的方法先在 Secrets 中保存凭据在提示词中只引用环境变量名并描述端点、触发条件、预期结果与失败行为。Anthropic 的 Claude 模型 API 同样遵循这一模式——把ANTHROPIC_API_KEY存入 Secrets后端按名称读取并调用。仅启用需要的集成仓库 Integrations 文档 建议只启用 App 实际需要的集成这样能保持 Builder 上下文聚焦并限制不必要的访问。对于 Anthropic 集成如果某个 App 并不使用 Claude就不要为它开启。总结在 Reflex AI Builder 中接入 Anthropic Claude 只需三步获取 API Key → 在Integrations中完成连接 → 在后端通过环境变量安全调用。整个流程的关键不在于“连上”而在于凭证安全密钥放在集成表单或 Secrets 中、只按名称引用、只在服务端使用、按环境隔离。遵循这些约束你的 App 就能稳定、安全地获得 Claude 的文本生成、摘要与推理能力并可与自定义集成、外部 API 调用等其他机制组合构建更复杂的 AI 工作流。【免费下载链接】reflex️ Web apps in pure Python 项目地址: https://gitcode.com/GitHub_Trending/re/reflex创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考