UD5工具箱
什么是微前端组合器？
微前端组合器是一个可视化工具，帮助开发者在单一页面中集成和预览多个独立子应用，支持网格、分栏、堆叠和标签页四种布局模式，是微前端架构原型验证的得力助手。它不需要安装任何依赖，打开浏览器即可使用，非常适合快速验证微前端集成方案，降低原型开发的时间成本。
如何使用 iframe 嵌入子应用？
在左侧面板输入应用名称和 URL 后点击添加，子应用将以 iframe 形式嵌入预览区。注意：部分网站设置了 X-Frame-Options 头，可能拒绝 iframe 嵌入，建议使用允许跨域嵌入的 URL。如果遇到子应用无法加载的情况，请检查目标网站是否允许被 iframe 嵌入，或尝试使用本地开发服务器运行的子应用。
支持哪些布局模式？
工具提供四种布局：网格布局自动排列，适合同时预览多个子应用的全局概览；水平分栏左右并排，适合对比两个应用的并排效果；垂直堆叠上下排列，适合纵向排列的页面组合；标签页选项卡切换，适合需要逐个查看子应用的场景。不同模式可以随时切换，已添加的子应用会自动适配新布局。
微前端架构的优势是什么？
微前端允许团队独立开发、测试和部署各自的前端模块，支持技术栈无关、独立版本管理、增量升级，特别适合大型项目和多团队协作场景。通过微前端架构，不同团队可以使用最适合自身业务的技术栈，无需统一技术选型，大幅降低跨团队协调成本。同时，每个子应用可以独立发布，不影响其他模块的稳定性。
数据存储在哪里？
所有配置自动保存在浏览器的 localStorage 中，刷新页面不会丢失。您也可以导出为 JSON 文件进行备份，或在不同设备间迁移配置。数据完全存储在本地浏览器中，不会上传到任何服务器，确保您的配置数据安全私密。这符合工具开箱即用、用完即走的设计理念。
iframe 有哪些安全限制？
iframe 使用 sandbox 属性限制子应用权限，包括 allow-scripts（允许执行脚本）、allow-same-origin（允许同源访问）、allow-forms（允许提交表单）等。跨域 iframe 无法直接与父页面通信，确保隔离安全。这些安全机制防止了子应用之间的恶意干扰和数据泄露，是微前端架构安全性的重要保障。
为什么某些网站无法嵌入？
部分网站在 HTTP 响应头中设置了 X-Frame-Options: DENY 或 Content-Security-Policy: frame-ancestors none，明确禁止被其他页面通过 iframe 嵌入。这是网站的安全策略，用于防止点击劫持等攻击。遇到此类情况，建议更换为允许嵌入的 URL，或使用本地开发服务器运行的子应用进行测试验证。
工具是否需要登录或注册？
不需要。微前端在线组合器是一个完全免费的在线工具，无需登录或注册即可使用所有功能。所有数据保存在浏览器本地，无需服务器存储。这确保了用户的使用便捷性和数据隐私安全，真正做到开箱即用、用完即走，符合工具的设计原则。
可以同时添加多少个子应用？
工具本身没有硬性限制子应用数量，但实际使用中建议根据浏览器性能和网络状况合理控制。过多的 iframe 会占用较多内存和网络带宽，可能影响页面响应速度。一般建议同时嵌入 2 到 6 个子应用，以获得最佳的预览和调试体验。如果需要更多子应用的组合预览，建议分批进行测试。
预设模板的作用是什么？
预设模板是一组预先配置好的示例子应用 URL，点击加载演示模板按钮即可快速填充到子应用列表中。它帮助初次使用的用户快速了解工具的工作方式和布局效果，无需手动查找和输入 URL。加载模板后，您可以在此基础上自由修改、删除或添加自己的子应用 URL，是快速上手的最佳方式。