vibe coding 的我，遇到了些尴尬事

最近失业后就一直在各种捣鼓 vibe coding，首先得感叹一下，自从 computer use 这个功能越来越完善后，再配上 Chrome 端的 AI 插件，以及 Mac 上面可以使用 iPhone 镜像（iPhone Mirroring）控制手机，这就直接打通了手机端、电脑端都能使用上高级的 AI。

电脑端和手机端，AI 现在都能自己动手

说实话，让 AI 通过 iPhone 镜像控制手机的效果是真的不错，不光可以帮你操作手机上面的软件，打开 BOSS 直聘投投简历，更重要的是它还可以直接帮你在手机上面测试你在开发的应用。

让 AI 自己开浏览器跑测试

众所周知现在无论是 ChatGPT 还是 Claude 的桌面应用都自带了浏览器，AI 可以自行对正在开发的 Web 应用做测试。我自己在 vibe coding 的过程中首先让 AI 写了完整的测试用例，然后它会自行打开内置的浏览器，在真实的浏览器环境下把用例跑一遍。

我发现这一套流程下来，功能上面的实现几乎是没有什么 BUG 的。之前我提到过我开发了一个辅助学习英语的应用，帮助我读英文书，这个应用我开发完后自己在使用过程中几乎没有遇到什么致命的 BUG，剩下的那一小部分问题多数也都是界面样式上的。可以说我自己纯手写开发这么一个应用，不可能拥有这么少的 BUG 量。

难的不是做出来，是上线

这篇文章聊的就是这个。我在开发了这个学习英语的应用后，非常想将它发布出来，作为一个正式的应用进行上线，之前的文章中也提到了我不久就会将它发布出来，但是我在发布的过程中，遇到了一些成本上的问题。

我没有想到的是，现在独立开发做程序最简单的居然是应用实现，而实现后真正要上线才是令人头痛的部分。这里我就逐步说一下我遇到的头痛的事情，以及为什么这个应用我迟迟没有进行发布。

这个应用具体是做什么的

首先，我这个应用核心功能是：通过 AI 生成雅思题，然后不停地刷题进行训练，题源源不断，只要是想要做题就能直接生成；然后是英文书阅读，通过上传 PDF 和 epub 等格式，如果上传的是 PDF，那么 AI 会一页一页地解析，将它转换成文字，如果是 epub，它本来就是文字格式，就不用转换直接用；同时在阅读的时候还可以直接勾选出不懂的地方，发给 AI，让 AI 进行讲解。

就这么一个功能，而我想把它发布出来遇到了哪些麻烦。

第一个麻烦：AI 的钱谁来出

由于我自身是用的我的 Claude 订阅下面的 Claude Agent，这个是直接与我的 Claude 账号绑定的，一旦要发布我不能用这个方式，因为第一个是因为它贵，第二个是因为别人如果用完了用量我就没得用了。

于是我想到的解决方式就是接入所有 AI，然后用户自己选择用哪个，填上 API Key 就行了。

但是我想到可能很多人都不知道 API Key 是什么、从哪儿获取，这对于普通用户来说是一个非常大的门槛，于是我想到我主动接入 AI 模型，例如便宜一点的 DeepSeek。

但是问题又来了，我主动接入的话就涉及到产品定价、产品充值，不能做亏本买卖，无限免费使用噻，本来就不富裕又要雪上加霜。

那势必就会带出一个问题，如何充值！如果要充值就涉及到如何登录，这又是一个大头。

要接入国内的充值系统其实是非常麻烦的，要各种认证。这一点翻一下官方文档就很直观：微信支付的 PC 网站支付，接入指引里写明能申请的主体只有个体工商户、企业，以及党政机关、事业单位、民办非企业、社会团体、基金会这几类，每一类都要提交营业执照的彩色扫描件或数码照片，而且它只支持已经完成域名 ICP 备案的网站接入支付功能。费率跟经营类目走，一般在 0.6% 到 1% 之间。换句话说，一个个人开发者想收第一笔钱，先要有一个营业执照和一个备案好的域名。

如果要接入国外的充值系统，问题是面向中文用户的网站很多人都不买账，如果没有微信、支付宝那可能直接就不用了。

再一个就是定价如何定，是按条数定还是按 token 定。我自己调用 API 是按 token 计费的，而且同一个模型内部的价差就已经很夸张了，拿 DeepSeek 的 flash 举例，缓存命中的输入价是每百万 token 0.007 美元，缓存未命中是 0.22 美元，差了三十倍。同样一道题，用户是接着上一轮的上下文继续问，还是开一个新会话重新问，成本完全不是一回事。定价太高或太低都不合适。

第二个麻烦：服务器

由于我是直接用 Next.js 搭建的项目，前后端一体的，就需要 Node.js 环境再去运行这个项目。Node.js 是十分吃服务器资源的，一个 Next.js 项目可能需要 2G 的服务器才能支撑得住，甚至可能要 4G 的服务器，并且我这个项目用了服务端渲染，就更加吃配置一些。

我也想过使用 Vercel 直接云端部署的方式，但问题又来了，项目里面有一个功能是上传，这个又非常吃服务器的硬盘，如果上传完毕存进数据库，那压力又到数据库上面去了。

何况就算硬盘的问题能解决，规则这一关也过不去：Vercel 官方文档里写着 Hobby 计划只限非商业的个人用途，所有商业用途都需要 Pro 或 Enterprise 计划。而它对商业用途的定义相当宽，只要这个部署是为了让参与项目生产的任何一方获得经济收益就算，官方举的例子包括以任何方式向访问者请求或处理付款、为创建更新或托管站点收取报酬、投放广告，甚至连接受捐赠都被明确划进商业用途。也就是说我前面刚说完要做充值，这条路自动就断了。Pro 的开发者席位是每人每月 20 美元起。

就算不谈收费，Hobby 的量也不算宽裕。Vercel 在合理使用指引里给出的 Hobby 月度参考区间是快速数据传输 100 GB、函数调用 100 万次、活跃 CPU 4 个 CPU 小时、预置内存 360 GB 小时；而超出用量限制之后，多数情况下要等满 30 天才能重新使用该功能。

第三个麻烦：数据库

最开始我是全方面的本地存储的，因为这个项目跑在我本地，所以没有其它的任何压力，但是一旦要开放，这个数据库就需要放入云端，导致的结果就是对服务器的内存是一个极大的需求。

当然也有托管式的数据库，还是那个问题：大多数免费的、类似 Vercel 那种托管数据库都是国外服务器，而很多中文用户都来自于国内，所以这个可能不会买账，并且这也是一大资源的消耗。何况前面那条非商业限制是针对整个部署的，一旦这个项目开始收钱，配套的免费托管存储同样不能继续用。

目前我觉得最好的解法是退回纯前端

我现在觉得独立开发真正写代码的成本可能不是大头，因为我现在 100 刀的套餐基本上用不完，真正的成本压力是后续的上线以及运营。我遇到的问题就是，我需要在这个项目完全不确定的情况下就先给它一笔投入，到底划不划算。

其中我想了很多其它的方法，比如完全使用浏览器的数据库存储，做一个纯前端应用，完全不需要提供后端，用户自己输入 AI 的 Key，然后数据全部存到用户本地，这样用户也不用担心 API Key 泄露给我。

容量上其实很宽松。按 MDN 的说明，Chrome 系浏览器单个源最多能用到磁盘总容量的 60%，所有源加起来不超过 80%；Safari 在 macOS 14、iOS 17 之后也是单个源约 60%，但如果是嵌在其它 App 里的 WebView，就降到约 15%。存几本书的解析结果绰绰有余。

我个人觉得这是目前为止最好的解决方案，唯一的缺点就是数据不能同步，换浏览器、清除缓存等都会导致已有的数据失效。

这个缺点还有一层，是浏览器会主动删数据。这类数据默认是「尽力保存」的，磁盘紧张时浏览器会按最近最少使用的顺序整源删除，一删还是全删，IndexedDB、Cache API 这些一起清掉，不会只删一部分。虽然可以调用 navigator.storage.persist 申请转成持久化，但 Chrome 和 Safari 是根据用户的交互历史自动判定的，不弹窗问用户，申请也不一定批。

Safari 那边还有一条更硬的规则。WebKit 在讲全面拦截第三方 Cookie 的那篇官方博客里说明过，脚本写入的存储，包括 IndexedDB、LocalStorage、SessionStorage、媒体密钥以及 Service Worker 的注册和缓存，如果站点在七天的 Safari 使用时间里没有得到用户交互，就会被整体删除。这个七天算的是浏览器的使用天数而不是自然日，用户点一下就重新计时，加到主屏幕的 Web App 另有一套计数。

不过反过来说，如果真的这样做，对我的成本几乎就是 0，我可能会尝试这样做试试。虽然代码上面的改动量很大，但是在现在这个时代，改动代码的成本已经非常低了。如果这个项目效果好，再做后端服务器以及注册充值都不迟。