我们有一个 React Web 应用程序，如果打开，它会在右侧显示一个 iframe。这个 iframe 中充满了一个 flutter 应用程序。如果打开 iframe 并且用户触摸 flutter 应用程序内部，然后触摸 Web 应用程序上的其他位置，则触摸不会执行任何操作。使用 flutter 应用程序关闭/隐藏 iframe 会将触摸控制权交还给 Web 应用程序。 onTouch 事件确实被触发（console.logs onTouchStart 在触摸时显示），但没有任何反应。 使用带有单击事件的鼠标不会导致任何问题。
有人也遇到过这个问题吗？我不是 Flutter 开发人员，flutter 应用程序的开发人员也不知道:') 所以我希望有人能提供关于在这里做什么的黄金提示？
您所描述的问题是，一旦您与 iframe 外部的 Web 应用程序交互，iframe 内的 Flutter 应用程序内的触摸事件就不会注册，这可能与浏览器和 iframe 处理触摸事件的方式有关。此行为可能受到多种因素的影响，包括浏览器的安全策略以及触摸事件的传播方式。
以下是解决该问题的一些可能的解决方案和调试步骤：
iFrame Sandboxing：检查iframe是否设置了沙箱属性。 sandbox 属性可以限制 iframe 内的各种行为，包括它与父框架的交互方式。如果您出于特定原因没有明确设置此属性，您可以尝试删除它或调整其设置，看看是否可以解决问题。
事件传播：确保 Flutter 应用程序内的触摸事件不会被停止或阻止传播到父框架。可以在 Flutter 应用程序中使用 JavaScript 来控制事件传播。检查 Flutter 应用程序中是否存在可能阻止事件传播的事件侦听器。
dart
// In your Flutter app code, make sure you're not preventing event
propagation.
document.getElementById('flutter-
iframe').addEventListener('touchstart', function(event) {
// Remove any event.stopPropagation() or event.preventDefault() calls if
present.
});
焦点管理：如果 iframe 和父框架之间的焦点管理存在问题，触摸事件可能无法按预期工作。确保 iframe 内的 Flutter 应用程序正确管理焦点。
跨源注意事项：确保不存在导致问题的跨源问题。如果 iframe 内容和 Web 应用程序位于不同的域中，您可能会遇到安全限制。确保 iframe 源配置正确，必要时包括允许属性。
浏览器特定行为：测试不同网络浏览器中的行为。有时，浏览器特定的怪癖可能会影响触摸事件处理。确保您在多个浏览器上测试并解决该问题。
Flutter 应用程序代码：查看 Flutter 应用程序本身的代码。 Flutter 应用程序代码中可能存在某些内容干扰触摸事件处理。
日志记录和调试：向 Web 应用程序和 Flutter 应用程序添加大量日志记录，以帮助诊断问题可能发生的位置。使用浏览器开发人员工具检查事件传播并检查控制台中的错误。
更新 Flutter 和 webview_flutter：确保您使用的是最新版本的 Flutter 和 webview_flutter 包，因为较新的版本可能包含与触摸事件处理相关的错误修复和改进。
如果这些解决方案都不能解决问题，您可能需要让具有 Web 开发和 Flutter 专业知识的开发人员参与进来，深入研究问题，并可能对您的 Web 应用程序和 Flutter 应用程序代码进行调整，以确保在 Web 应用程序中正确处理触摸事件。 iframe。