UD5工具箱
核心功能
URL 协议处理演示工具提供了一系列强大的功能，帮助开发者高效地配置和测试 PWA 的 Protocol Handlers 能力。以下是工具的主要功能特点：
协议配置生成器
工具提供直观的配置界面，开发者只需填写协议名称和 URL 处理模板两个必填字段，即可快速生成 manifest.json 中所需的 protocol_handlers 配置代码。协议名称支持自定义输入（如 web+myapp）或从预设协议中选择（包括 web+myapp、web+notes、web+pwa、mailto、tel、webcal 等常用协议）。URL 处理模板支持使用 %s 占位符，该占位符在实际运行时会被替换为经过 URI 编码的完整协议 URL。生成的配置代码可直接复制到 manifest.json 文件中使用。
实时预览功能
在配置过程中，工具会实时显示生成的 manifest.json 配置片段，让开发者能够直观地看到最终的配置效果。预览窗口采用代码高亮显示，方便开发者快速识别关键配置项。同时，预览区域还提供了复制按钮，开发者可以一键将配置代码复制到剪贴板，省去了手动选择和复制的繁琐操作。
测试 URL 处理
工具内置了 URL 处理测试功能，开发者可以输入一个完整的协议 URL（如 web+myapp:some/data?id=123）进行测试。工具会显示该 URL 经过 URI 编码后的结果、PWA 内部导航 URL 以及解码还原后的原始 URL，帮助开发者验证 URL 编码/解码逻辑是否正确。这对于调试协议处理流程中的数据传递问题非常有帮助。
浏览器能力检测
工具提供了全面的浏览器兼容性检测功能，能够实时检测当前浏览器对 Protocol Handlers 相关 API 的支持情况。检测项目包括：registerProtocolHandler API 支持、Manifest protocol_handlers 支持以及 PWA 安装支持。检测结果以清晰的状态标识显示，帮助开发者快速确认当前环境是否支持目标功能。
完整示例代码
除了配置生成器，工具还提供了完整的 manifest.json 示例代码，包含所有必要的 PWA 配置项（如 name、short_name、start_url、display、theme_color、icons 等）。示例代码展示了 protocol_handlers 配置在整个 manifest 中的位置和上下文，帮助开发者理解如何将其集成到现有项目中。
URL 解析代码示例
工具还提供了 PWA 内部解析协议 URL 的 JavaScript 代码示例，展示了如何使用 URLSearchParams 获取编码的 URL 参数，如何使用 decodeURIComponent() 还原原始 URL，以及如何进一步解析协议名称和路径数据。这些代码示例可以直接复制到项目中使用，大大降低了开发门槛。
安全注意事项说明
工具详细列出了使用 Protocol Handlers 时需要注意的安全事项，包括验证来源、URL 白名单、输入消毒、XSS 防护和 HTTPS 要求等。这些安全指导帮助开发者在享受便利功能的同时，确保应用的安全性不受影响。
一键复制功能
所有配置代码和示例代码都支持一键复制功能，开发者只需点击复制按钮即可将代码内容复制到剪贴板，方便粘贴到自己的项目中使用。复制成功后会显示提示信息，确保操作成功完成。