什么是小程序?

构建模块和兼容性

小程序是小型的(通常为 2-4 MB)应用程序,需要超级应用才能运行。它们共同的特点是,无论超级应用如何,它们都是使用 HTML、CSS 和 JavaScript 等 Web 技术(或其“方言”)构建的。小程序的运行时是超级应用中的 WebView,而不是底层操作系统,这使得小程序具有跨平台性。同一个小程序可以在同一个超级应用中运行,无论该超级应用是在 Android、iOS 还是其他操作系统上运行。然而,并非所有小程序都能在所有超级应用中运行,更多信息请参见后续内容

发现

小程序通常通过品牌化的二维码进行临时发现,这解决了重要的线下到线上的挑战,例如,从实体餐厅菜单到支付小程序,或从实体电动滑板车到租赁小程序。下图显示了 微信的演示小程序的品牌化二维码示例。当使用微信超级应用扫描该代码时,小程序会直接启动。其他超级应用通常无法识别该二维码。

WeChat-branded 2d barcode.
使用微信应用扫描此二维码会启动一个演示小程序。

小程序也可以通过超级应用中的常规应用内搜索、在聊天消息中分享或作为新闻提要中的新闻项目被发现。一些超级应用具有可以包含小程序在其个人资料中的已验证帐户的概念。当小程序在物理地理位置上接近时(例如,用户站在其前面的企业的的小程序),或者在虚拟位置上接近时(例如,当用户在超级应用中显示的地图上获得方向时),可以突出显示小程序。常用的小程序可以在应用抽屉中找到,在许多超级应用中,可以通过向下滑动手势或通过超级应用菜单中的特殊部分访问应用抽屉。

用户体验

所有超级应用对于小程序都具有或多或少相同的用户界面。一个可主题化的顶部栏,显示小程序的名称,以及在屏幕的右上角,一个关闭按钮,最右侧是一个操作菜单,该菜单提供对常用功能的访问,例如共享应用、将其添加到收藏夹列表或主屏幕、报告滥用应用、提供反馈和设置。下面的屏幕截图显示了一个在支付宝超级应用上下文中运行的购物小程序,操作菜单已打开。

The Alipay super app running a shopping mini app with highlighted top bar, action menu button, and close button. The action menu is opened.
在支付宝超级应用中运行的购物小程序的已打开操作菜单。

UI 范例

通常有一个底部标签栏用于小程序的主要导航。大多数超级应用提供商提供组件,以帮助开发者快速实现常见的 UI 范例,例如轮播图、手风琴、进度条、微调器、开关、地图等等。这也有助于使不同小程序之间的用户体验保持一致,这受到微信小程序设计指南的鼓励。这类似于 Apple 通过其 Apple 人机界面指南 和 Google 通过其 Android 设计 建议所激励的内容。

The Douyin demo mini app showcasing the Douyin slider (carousel) component with toggles for auto-advance, dot indicators, etc.
抖音的带有各种选项的滑块(轮播图)组件。

服务

小程序不是像常规 Web 应用那样以单独的资源分段提供,而是作为加密的打包应用提供,即作为仅在一个文件中包含所有资源的存档。与常规 Web 应用不同,它们也不是从小程序创建者的特定来源提供,而是直接从超级应用提供商提供。它们仍然可以访问来自小程序创建者服务器的 API,但核心资源(通常称为应用外壳)必须从超级应用提供商提供。小程序必须声明它们从中请求额外数据的来源。

缓存、更新和深度链接

小程序保存在超级应用的缓存中,因此用户下次启动缓存的小程序时,它几乎可以立即加载。如果有更新,则会加载新的应用包。版本号可以是启动 URI 的一部分(请参阅发现),因此超级应用可以尽早知道本地缓存的版本是否仍然是最新版本。启动 URI 还可以选择性地包含小程序所需的页面,因此可以深度链接到小程序的特定页面。通过站点地图,小程序可以声明其哪些页面应可由超级应用提供商的小程序爬虫索引。

macOS Finder showing a folder containing cached WeChat mini app `.wxapkg` files.
小程序被缓存为加密的打包应用。

安全性和权限

小程序由超级应用提供商审核,这意味着用户认为它们比 Web 应用更安全。它们需要在清单或小程序配置文件中预先声明其可能需要的权限,对于某些提供商,还需要解释为什么需要每个权限。小程序当然仍然可以撒谎,但它们很难证明为什么它们要尝试访问运动传感器而没有对用户显而易见的原因。与 Web 相比,指纹识别用户的动机明显降低,因为用户通常已经登录到超级应用(请参阅身份、支付和社交关系)。

每当小程序执行需要特殊权限的操作时,都会向用户显示提示,如果平台强制执行,该提示还会包括开发者声明的使用理由。下面的屏幕截图显示了 抖音演示小程序,因为它要求用户允许共享其位置。在某些超级应用中,还有一个命令式 API,小程序可以利用它来请求权限,而无需立即使用它们,或者仅检查权限的状态。这甚至可能包括一个 API 来打开中央超级应用权限设置,这对应于 Chrome 的站点设置。小程序还必须预先声明它们可能从中请求数据的所有服务器的来源。

The Douyin demo mini app showing a geolocation prompt with two options: 'Not Allowed' and 'Allowed'.
抖音演示小程序请求地理位置权限。

访问强大的功能

托管超级应用通过 JavaScript 桥提供对强大 API 的访问,该桥被注入到超级应用提供的 WebView 中(请参阅构建模块和兼容性)。此 JavaScript 桥提供了操作系统 API 的挂钩。例如,小程序 JavaScript 函数(如 getConnectedWifi())—小程序获取当前活动 Wi-Fi 网络名称的功能—在底层是通过 Android 的 getConnectionInfo() API 或 iOS 的 CNCopyCurrentNetworkInfo() API 来实现的。常见超级应用中公开的其他强大设备 API 的示例包括蓝牙、NFC、iBeacon、GPS、系统剪贴板、方向传感器、电池信息、日历访问、电话簿访问、屏幕亮度控制、文件系统访问、物理反馈振动硬件、相机和麦克风访问、屏幕录制和屏幕截图创建、网络状态、UDP 套接字、条形码扫描、设备内存信息等等。

The WeChat demo mini app showing a slider that controls the screen brightness of the device moved all the way to the maximum.
微信演示小程序将设备屏幕亮度设置为最大。

访问云服务

许多超级应用还提供对超级应用提供商的云服务的“无服务器”访问,除了原始云计算和云存储外,还经常包括更高级别的任务,如文本翻译、图像中的对象检测或内容分类、语音识别或其他机器学习任务。小程序可以通过广告获利,这些广告通常由超级应用提供商提供。超级应用平台通常还提供云分析数据,因此小程序开发者可以更好地了解用户如何与其应用互动。

身份、支付、社交关系

小程序的一个非常重要的功能是从超级应用共享的身份和社交关系信息。像抖音或微信这样的超级应用最初是作为最广泛意义上的社交网站而起步的,用户拥有(有时甚至是政府验证的)身份、朋友或关注者网络,并且经常还存储了支付数据。例如,购物小程序可以(或有时甚至必须)直接通过超级应用的支付 API 处理任何付款,并且在用户同意后,可以获取用户数据,如他们的送货地址、电话号码和全名,所有这些都无需强迫用户痛苦地填写表格。在下面,您可以看到在微信中运行的沃尔玛小程序,首次打开时,它用熟悉的面孔向我问好。

The Walmart mini app showing the author's face and name on the 'Me' tab.
沃尔玛小程序在首次访问时具有个性化的“我”视图。

小程序可以通过让人们分享他们在游戏中的高分等成就,并通过状态更新挑战他们的联系人来变得非常受欢迎。然后小程序只需点击一下即可,因此用户可以毫无摩擦地进入竞争,从而扩大了小程序的覆盖范围。

致谢

本文由 Joe MedleyKayce BasquesMilica MihajlijaAlan Kent 和 Keith Gu 审阅。