应用界面

“非程序员也想开发应用!”带着这样的想法,笔者尝试利用生成式AI进行自制应用开发(即“振动编码”),但在“发布壁垒”面前陷入困境。

于是,笔者向日本国家GMO互联网集团的现役工程师石丸智辉先生请教。在Google AI Studio中打造前端,应用命名为“AiLA”,随后将开发环境转移至Claude Code。经过多次排除故障,最终完成了在本地环境运行的威士忌应用,并通过AI进行发布前的功能和安全检查。

这是一段业余与专业携手合作,充满泥泞却真实的开发纪录……

此前文章链接:

前文链接

这次,我们终于将仅在自己电脑中运行的应用,部署到外部可访问的“阶段环境”。这是从“开发”迈向“发布”的关键一步。

理解“本地”、“阶段环境”和“生产环境”的区别

首先回顾一下开发环境。

笔者之前一直在自己电脑上的“本地环境”运行应用,而实际用户使用的“生产环境”则完全不同。

“生产环境与开发环境的最大区别在于,应用是在个人电脑上运行,还是在Google服务器上运行。后端架构也不同,之前用的是模拟器,现在要切换到真正的Firebase。此外,API密钥的管理也很关键,之前直接从本地读取,现在需要转移到服务器上的安全管理机制,让应用能安全访问。”(石丸先生)

本地与生产环境差异巨大,直接在生产环境上线容易出错。

因此,介于两者之间设置了“阶段环境”,它的架构与生产环境几乎相同,方便测试和验证。

“阶段环境就是与生产环境相同的测试环境。”(石丸先生)

这次主要是调整Firebase配置,将本地代码迁移到阶段环境,虽然工作枯燥,但部分配置文件的生成可以交给AI完成。

简单无数据库的应用部署较为简单,像本次带有数据库和认证功能的应用则需要更多准备。

在Firebase中准备数据库和存储

首先检查Firebase设置。

关键是选择计费方案。为了安全管理API密钥,需要使用“Cloud Functions”服务,该服务不支持免费“Spark计划”,必须切换到按量付费的“Blaze计划”。

虽然按量付费听起来令人担忧,但只要设置预算提醒,达到设定金额时会收到邮件通知,避免超支。

Firebase计费设置

接着在Firebase控制台配置数据库和存储。

使用Firestore数据库,选择适合日本用户的东京区域。存储服务的设置类似,均以生产环境模式启动。

Firebase控制台

“这些配置界面称为控制台。可以通过图形界面或命令行两种方式设置,初学者建议使用图形界面。”(石丸先生)

完成认证、数据库、存储和应用配置的准备工作。

同时获取连接Firebase的配置参数,这些参数虽包含项目ID等信息,但设计上允许公开在客户端代码中,不会直接导致安全问题。为避免泄露,阶段环境的配置文件不会上传到GitHub,已从版本控制中排除。

接下来回到Visual Studio Code(VS Code),让Claude Code协助连接和配置。

石丸先生预先准备了简化专业术语的提示语,模仿非程序员的自然表达,让AI理解需求。

“我想将本地运行的Firebase应用部署到阶段环境。请告诉我需要准备什么?如何获取Firebase配置参数?如何切换本地与阶段环境?”

Claude Code界面

Claude Code给出了整体流程和步骤,包括创建环境文件、排除版本控制、设置阶段环境引用、配置托管等六个步骤。此时AI仅提供方案,尚未执行。

步骤说明

按照步骤制作阶段环境配置文件,笔者只需复制粘贴。Claude Code提供模板,逐条填入Firebase配置。

遇到是否添加引号等细节问题时,Claude Code会给出准确指导。

配置文件编辑

API密钥需手动通过终端注册

这是本次关键环节。

AI过早尝试部署,但Gemini API密钥和Google登录配置尚未完成,部署后应用无法正常运行。

“Claude Code急于部署,但由于登录和API密钥问题,当前不宜继续。”(石丸先生)

原因是未提前告知AI“需要安全管理Gemini API密钥”的需求,导致AI误判流程。

笔者学到两点:一是提前向AI说明整体需求,二是AI跑偏时可补充信息纠正。

“我想安全管理Gemini API密钥,且希望尽量在Firebase内完成。”

Claude Code建议结合Cloud Functions和Secret Manager实现。

“Cloud Functions在服务器端安全执行代码,Secret Manager存储API密钥。避免密钥直接嵌入应用。”(石丸先生)

实现交给Claude Code,但API密钥的注册必须手动在终端完成。

“秘密信息不应直接输入AI界面,密钥注册由我手动完成,其他由Claude Code处理。”(石丸先生)

这对非程序员来说是难点——“终端”。

之前一直通过VS Code与Claude Code对话,突然被要求在终端执行命令,许多非程序员会卡壳。

但必须克服,打开VS Code内置终端,执行命令,输入密钥,完成注册。

“完成后告诉AI,AI继续后续操作。”

终端操作

云端应用默认公开,需额外防护

终于部署阶段环境,但Claude Code提示无法完成Google Cloud操作,因缺少gcloud CLI工具。

之前Firebase环境已配置好,Google Cloud操作首次执行。

Claude Code主动帮忙安装配置,但认证需用户完成。

gcloud CLI配置

阶段环境部署完成,VS Code显示任务成功。

打开阶段环境URL,应用正常显示,Google登录功能正常,应用从本地走向外网,手机访问也无问题。

应用运行

石丸先生提醒,阶段环境已对全世界开放。

“虽然需要Google登录,公开访问无大碍,但不希望被Google搜索引擎收录,需设置排除搜索。”(石丸先生)

网页若被外部链接或URL曝光,搜索引擎爬虫会抓取并显示,可能增加Firebase费用。

Claude Code协助设置搜索排除。

搜索排除设置

石丸先生还介绍了更严密的保护措施,如基本认证(访问需ID密码)和IP限制,仅允许特定IP访问。

“开发阶段可能存在权限漏洞或敏感信息泄露风险,访问限制能多一道防线。”(石丸先生)

考虑到阶段环境为测试且强制Google登录,暂时不启用额外限制,正式运营时再评估。

最后完善登录和数据库功能。

本地环境继续用ID密码登录和环境文件管理密钥,阶段和生产环境使用Google登录和Cloud Functions安全读取密钥。

Claude Code完成了切换实现。

部署初期无用户,连管理员都没有,Claude Code帮忙将笔者账号设为管理员。

测试时遇到图像解析功能故障,因Google Cloud配置已完成,Claude Code查看服务器日志,定位错误并提出修正方案。

错误日志分析

至此,阶段环境部署、基本功能测试及Google账号迁移完成,目标更近一步。

这次学习了本地、阶段和生产环境的区别,了解到全权交给AI发布虽方便但不一定安全,API密钥和认证必须手动操作,云端应用默认公开,需额外防护。

此外,因规格变更,AI指令文件CLAUDE.md也大幅更新,自动记录变更,最后提交保存。

下一回合是最终章,将阶段环境应用部署到生产环境,同时强化安全措施,完善使用条款和隐私政策。振动编码打造的应用即将正式上线。

(未完待续)

作者简介:柳谷智宣

IT与商业领域作家,拥有26年职业经验,涉猎数字设备、网络服务、消费品及企业产品。近年来专注AI、SaaS和数字化转型领域。日常撰写大量稿件,已离不开生成式AI辅助工作。

作者照片