跳至内容
WebViewGold 从 Vibe Coding 到 App Store
中文
获取 WebViewGold

Windsurf

Windsurf Cascade Web 应用转为 iOS 和 Android 应用:规则、工作流、Netlify 和 WebViewGold

如果您是在 Windsurf 中用 Cascade 构建的 Web 应用,那么离原生应用只差一次生产部署:WebViewGold 会把该 URL 加载到原生 iOS 和 Android 外壳中,由您提交到商店。2026 年有一处变化:Windsurf 现在叫 Devin Desktop,它的 Devin Local 代理取代了 Cascade。您的规则可以直接沿用;工作流和记忆需要稍作迁移。本指南两种情况都会讲到。

每个平台一次性 $109 起,或由我们的团队全程代劳,$698 起。

  • 审核通过保证 – 否则 14 天内退款
  • 无需编程
  • 一次性付费,免费更新
  • 7×24 小时人工支持
  • 2014 年起德国出品 · ISO 27001

目标:同一个 Web 应用,两个原生应用

WebViewGold 为您提供一个原生 Xcode 项目和一个 Android Studio 项目,它们的主界面在 WKWebView 或 Android WebView 中加载您的生产 URL,还附带推送通知、离线页面和分享面板等原生功能。您的 Windsurf 项目仍是唯一的代码库,每次部署都会同时出现在两个应用中。

代理的任务是让 Web 应用作为一个应用通过审核:移动端布局、法律页面、账户删除、没有死胡同,以及至少一项原生能力,让应用不只是一个网站(准则 4.2)。这套技术栈与工具相关的基础知识,请见Windsurf 上架 App Store 页面。

一条让每次代理运行都符合商店要求的工作区规则

如果您仍在使用 Cascade(旧版 Windsurf 或 JetBrains 插件),请保存为 .windsurf/rules/native-app.md;在 Devin Desktop 中则保存为 .devin/rules/native-app.md。两者使用相同的 trigger front matter,always_on 会让规则在每个会话中加载。Windsurf 把规则文件限制在 12,000 个字符以内,所以请保持精简。

markdown
---
trigger: always_on
---

# Native app context
- This project is published as iOS and Android apps with WebViewGold, which loads
  https://app.example.com in a native WebView. Every deploy is live in both apps.
- There is no separate mobile codebase. Do not propose React Native, Flutter or Capacitor.
- Detect the app with isNativeApp() in src/lib/platform.ts (user agent contains
  "MyAppNative", set in WebViewGold). No other user agent checks.
- Native features are URL schemes (registerpush://, shareapp://message?=TEXT&url=URL,
  bioauth://, qrcode://). Look up the exact syntax in
  https://www.webviewgold.com/llms-full.txt, call them only inside the app,
  and keep a web fallback.

# Never
- Use a preview or *.windsurf.build URL as the app URL.
- Open OAuth in popups or new windows (the Social Login Helper handles Google).
- Sell digital goods through Stripe links inside the iOS app.
- Ship placeholder text, "coming soon" buttons or dead links.

# Always
- /privacy, /terms and an in-app Delete account (server-side) exist and work.
- Sign in with Apple appears wherever Google or another social login appears.
- Layout works at 320 px; fixed bars pad env(safe-area-inset-top/bottom);
  tap targets are at least 44 px.
- Loading, empty and error states for every fetch.

出色的工作!无需任何编码就能轻松完成。简单快捷!创作者也提供了大力帮助!

卢卡斯·杜波依斯(Lucas Dubois) · CodeCanyon

把就绪检查做成工作流或技能

Cascade 工作流是 .windsurf/workflows/ 中的 Markdown 文件,您通过以文件名命名的斜杠命令来启动它;Cascade 从不自行运行工作流。在 Devin Desktop 中,同样的步骤变成一个技能:一个包含下面这个 SKILL.md 的文件夹 .devin/skills/store-readiness/。输入 /store-readiness,或者当您的请求与描述相符时,代理会自动调用它。如果是 Cascade 工作流,请把编号步骤保存为 .windsurf/workflows/store-readiness.md,front matter 中只保留 description。

markdown
---
name: store-readiness
description: Audit and fix this web app for App Store and Google Play review before a WebViewGold build
---

1. Read the native-app rule. List the routes and the auth, payment and analytics code.
2. Mobile: open every main route in the Preview at 390 px and 320 px. Fix horizontal
   overflow, tap targets under 44 px, inputs under 16 px font size and fixed bars
   without safe-area padding.
3. Legal: make /privacy and /terms real (based on what the code collects) and link
   them from the footer and the settings screen.
4. Accounts: if sign-up exists, add Delete account in settings (server-side deletion,
   sign out, confirmation) and a public /delete-account page.
5. Sign-in: add Sign in with Apple next to any other social login.
6. States: loading, empty and error-with-retry for every fetch; a friendly 404.
7. App mode: hide store badges, install prompts and builder badges when isNativeApp().
8. Payments: list where digital goods are sold. Report only, change nothing.
9. Run lint, tests and build. Summarize the changes and what I must test on a phone.

规则、工作流、记忆、AGENTS.md:各自放什么

规则:硬性规则

提交到代码仓库,与所有人共享,按各自的 trigger 加载。商店规则属于这里,因为它们必须对今后的每一次改动都成立,而不只是今天的任务。

工作流和技能:操作流程

可重复执行的多步骤工作,比如这次就绪检查、发布检查清单或拒审分诊。需要时再运行。

记忆:个人笔记

Cascade 会自行创建记忆。它们属于创建时所在的工作区,并保存在您的机器上,所以队友和其他工具永远看不到。商店规则绝不能依赖记忆;请让代理把它写进规则里。

AGENTS.md:跨工具通用的文件

Devin Desktop 会把根目录和子文件夹中的 AGENTS.md 当作始终生效的规则来读取,Cursor、Codex 和 GitHub Copilot 也是如此。如果您混用多个工具,就把原生应用章节在这里写一次(指令文件对比)。

从 Windsurf 项目到提交商店

同样的顺序适用于 Cascade 和 Devin Local。

  1. 添加规则和技能

    提交这两个文件。开启一个新对话,让代理总结它所遵循的规则;回答中应该包含 native-app 规则。

  2. 执行就绪检查

    输入 /store-readiness(在 Cascade 中则输入工作流名称)。在 diff 中审阅每处改动,在 Preview 中检查各个路由,然后再用手机浏览器检查。

  3. 在 Netlify 上部署生产版本

    Cascade 的 App Deploys 会发布到 name.windsurf.build 地址,用途是预览,并会写入一个包含项目信息的 windsurf_deployment.yaml。对于应用,请把站点认领到您自己的 Netlify 账户,或者把 Git 代码仓库连接到 Netlify,然后添加您的域名(为什么域名很重要)。在 Devin Desktop 中请直接用 Netlify 部署,因为 Devin Local 无法使用 App Deploys。

  4. 配置 WebViewGold

    Config.swift:host、webviewurl、useragent_iphone、useragent_ipad。Config.java:HOST、HOME_URL、USER_AGENT。如果使用 Google 登录,请设置 Social Login Helper 触发规则;如果需要通知,请选择一个推送服务提供商(OneSignal、Firebase 或 Pushwoosh)。Android 设置文档列出了每一个配置项。

  5. 构建

    有 Mac 的话,在 Xcode 中归档;在 Android Studio 中构建一个已签名的 App Bundle。如果您更愿意把这部分交出去,Full Service 团队会在 72 小时内为您配置并构建两个应用。

  6. 提交并持续迭代

    让代理根据代码起草隐私政策、商店描述和审核备注;由您来提交。Web 端的改动随每次部署上线,只有原生外壳的改动才需要新的构建版本。

提示词:生产部署加上架检查

如果您更喜欢一次有引导的运行而不是技能,或者只需要部署部分,就用它。它会在 Netlify 设置完成后停下,方便您先检查构建。

粘贴到 Cascade 或 Devin Local
我们正在用 WebViewGold 把这个 Web 应用发布为原生 iOS 和 Android 应用,WebViewGold 会在原生 WebView 中加载我们的生产 URL。请遵循 native-app 规则。按以下顺序工作,完成第 2 步后停下来等我确认。

1. 生产构建:确保“npm run build”在干净的 checkout 中能正常运行,并在 .env.example 中记录每一个环境变量(只写名称,不写值)。
2. Netlify:为这个框架添加一个包含构建命令和发布目录的 netlify.toml。如果这是单页应用,请添加一条指向 /index.html、状态码为 200 的通配重定向,让 /privacy、/terms 和 /delete-account 可以直接加载。列出我必须在 Netlify 控制台中添加的环境变量。不要用 App Deploys 部署生产环境。
3. 原生辅助函数:添加 src/lib/platform.ts,其中包含 isNativeApp(),用于检查 User-Agent 中是否包含 "MyAppNative"。
4. 运行 store-readiness 技能(或工作流),并修复它发现的问题。
5. 编写 docs/store/review-notes.md(用英文撰写,供审核人员阅读):应用做什么、演示账户的占位符,以及审核人员可以试用的原生功能。
6. 总结所有改动,并给我一份手机测试计划:注册、用 Google 和 Apple 登录、删除账户、飞行模式、直接打开 /privacy。

提交前的检查清单

  • Config.swift 和 Config.java 中的 URL 是您在 Netlify 上的自有域名,而不是 windsurf.build 或部署预览的 URL。
  • 直接加载 /privacy 和 /delete-account 会返回页面,而不是 404。
  • 在全新的对话中,代理能把 native-app 规则复述给您。
  • 如果您已迁移到 Devin Desktop,您依赖的工作流都已转为技能。
  • 飞行模式下显示 WebViewGold 的离线页面。
  • 您的生产域名能通过免费的App Store 就绪检查,没有红色警告。

常见的坑

  • 把 windsurf.build 预览地址发布出去:它是用于预览的,部署后子域名无法更改,而且 URL 会被编译进应用。
  • Netlify 上的单页应用没有通配重定向:您在 App Store Connect 中填写的隐私政策 URL 会对审核人员返回 404。
  • 把规则寄托在记忆上:记忆不会同步给队友、其他工作区或其他工具。
  • 旧的 .windsurfrules 和新的 .devin/rules 互相矛盾。两者都会加载,所以请合并整理。
  • 两个全局规则文件:如果 .devin/global_rules.md 和 .windsurf/global_rules.md 同时存在,只有第一个会加载。
  • 只在编辑器的 Preview 中测试。原生 WebView 在 OAuth、文件上传和安全区域方面有所不同;请在手机上测试构建好的应用。

常见问题

Windsurf 停止服务了吗?

没有。Windsurf 在 2026 年 6 月更名为 Devin Desktop。它还是同一个编辑器,设置和扩展都相同,适用于 JetBrains IDE 的 Windsurf 插件也仍在提供。

我还能用 Cascade 吗?

在 Devin Desktop 中,新对话会以 Devin Local 开始,那里已无法再开启 Cascade 对话。Cascade 仍保留在适用于 JetBrains 的 Windsurf 插件中。本指南中的规则两个代理都适用;Cascade 用工作流,Devin Local 用技能。

我的 .windsurfrules 还有效吗?

有效。Devin Desktop 默认会导入 .windsurfrules、.windsurf/rules/*.md 和 .windsurf/global_rules.md。新规则应放在 .devin/rules/ 中,两者同时存在时它的优先级更高。

我能在应用中使用 windsurf.build 的 URL 吗?

能加载,但不要这样做。App Deploys 是用于预览的,子域名日后无法更改,而且 URL 会被编译进您的应用。请使用您在 Netlify 或其他托管平台上的自有域名。

我需要 Mac 吗?

要在 Xcode 中手动构建 iOS 版本的话,需要。WebViewGold Cloud Builder 会在浏览器中构建并上传两个应用,Full Service 团队也可以替您完成配置和构建。

让您的应用上架商店的三种方式

结果相同,只是您需要投入的工作量不同。三种方式都附带审核通过保证和 7×24 小时人工支持。

自己动手

$109 每个平台,一次性付费

WebViewGold 许可证:一个现成的 Xcode 或 Android Studio 项目。粘贴您的 URL,设置名称和图标,开启所需功能,构建并提交。永久免费更新。

在主页查看方案

Cloud Builder

$349 每个许可证,一次性附加购买

无需 Mac、Xcode 或 Android Studio:在浏览器中完成配置,我们在云端构建两个应用,并将其交付到 App Store Connect 和 Play Console。

Cloud Builder 如何运作 试用免费演示

Full Service

$698 每个平台 $798

把您的 URL 和图标发给我们。我们的团队在 72 小时内完成配置、构建并交付您的应用,白标,附源码项目。两个平台共 $1,158。

Full Service 详情 服务提供方: WeSetupYourWebViewApp

冬季特惠价格有效期至 2026年12月31日。

准备好发布您的应用了吗?

App Store & Google Play 审核通过保证 – 否则 14 天内退款

想直接交给我们?Full Service:我们在 72 小时内完成配置、构建并交付,每个平台 $698 起。有疑问?通过 7×24 小时在线聊天联系我们。

退款依据我们 FAQ 中列出的条件:应用因非内容原因被 Apple 和/或 Google 拒审,并在购买后 14 天内提出申请。