URL 协议处理演示 - 将 PWA 注册为 URL 处理器
配置 manifest 中的 url_handlers,演示 PWA 如何打开特定格式的链接。
UD5工具箱
配置 manifest 中的 url_handlers,演示 PWA 如何打开特定格式的链接。
设置 launch_handler 并模拟不同启动方式,体验单窗口与多窗口模式。
注册一个周期性后台同步,模拟触发并显示更新数据。
配置 manifest 中的 share_target 字段,模拟接收来自其他应用的分享数据。
粘贴 assetlinks.json 内容,检查是否符合 TWA 打包要求,帮助将 PWA 上架应用商店。
注册一个后台同步任务,展示如何在网络恢复后自动同步表单提交等操作。
通过表单选择预缓存、运行时缓存规则,生成 workbox-config.js,简化 PWA 缓存配置。
读取当前域下 Service Worker 缓存的所有条目,展示 URL、大小和时间,便于调试离线策略。
填写 Manifest、Service Worker、HTTPS 等实施情况,计算 PWA 完备度分数并给出改进建议。
模拟 Service Worker 从安装到激活的完整生命周期,理解更新机制。
通过分步表单填写应用名称、图标、主题色等,生成完整的 manifest.json 文件。
设置capture_links清单字段,让浏览器在点击链接时自动打开PWA而不是新标签页。
演示如何拦截和自定义 beforeinstallprompt 事件,控制 PWA 安装 UI。
在开发环境中模拟 periodicSync 事件,触发后查看 SW 中的处理逻辑和网络请求。
粘贴manifest.json,检查其必要字段、图标尺寸和主题色是否符合标准。
注册Periodic Background Sync,让应用在后台定期获取最新数据并更新缓存。
在PWA环境中设置和清除应用图标上的数字角标,演示Badging API的简单用法。
将网页内容添加到浏览器的离线内容索引中,便于用户在下载页面查看。
演示如何注册为分享目标,接收来自其他应用的分享内容(需PWA安装)。
设计无网络连接时显示的页面样式,生成需缓存的HTML。
上传图标文件并设置背景色,模拟在 Android/iOS 主屏幕上的添加效果,检查视觉适配。
生成VAPID密钥对,建立推送订阅并发送测试通知,帮助调试Service Worker推送。
演示如何拦截PWA安装事件并自定义安装按钮,查看浏览器原生安装提示效果。
展示当前推送订阅详情,解析 VAPID 公钥,模拟接收推送事件,方便开发阶段测试。
逐步展示SW从注册、安装到激活的完整流程,并模拟更新与跳过等待的场景。
配置Launch Handler使PWA应用在重复点击时聚焦到已开窗口,而不是新建窗口。
枚举当前域下所有Cache Storage,查看条目详情,手动删除缓存,辅助PWA开发调试。
演示请求订阅Web Push,获得端点后可配合服务端发送测试推送。
粘贴manifest.json,检查必需字段,验证图标尺寸,并给出可安装性评分与改进建议。
枚举当前作用域下的所有Cache Storage,查看资源条目和所占空间,支持手动清理。
选择缓存策略(Network First, Cache First等),填写预缓存文件列表,生成sw.js文件。
上传图标图片,模拟其在iPhone主屏幕上的显示效果与圆角遮罩。
显示当前注册的 Service Worker 所管理的 Cache Storage,查看缓存文件列表及大小。
配置启动画面背景色与图标,生成对应manifest和meta标签代码。
添加、列出和删除内容索引中的条目,展示离线可用内容。