Electron 中使用 webview 中打开外部链接跳转问题

Electron 中使用 webview 中打开外部链接跳转问题

💡 原文中文,约2600字,阅读约需7分钟。
📝

内容提要

在使用 Electron 34.x 版本时,遇到 webview 中 window.open() 无法正常工作的问题。尝试重写 window.open() 方法,但 iframe 中的 window.open() 仍无法拦截。考虑使用 WebContentView,但会影响其他元素的显示。最终方案是监控页面元素变化,动态显示或隐藏 WebContentView。

🎯

关键要点

  • 在使用 Electron 34.x 版本时,webview 中的 window.open() 方法无法正常工作。

  • 可以通过重写 window.open() 方法来解决问题,重写方式有两种:渲染层注入和主进程注入。

  • 重写 window.open() 方法可以在 webview 中生效,但如果页面中有 iframe,iframe 中的 window.open() 不会被重写。

  • contents.setWindowOpenHandler() 方法无法拦截 iframe 中的 window.open() 行为。

  • 将 webview 替换为 WebContentView 可以解决部分问题,但会影响其他元素的显示。

  • 当前方案是监控页面元素变化,动态显示或隐藏 WebContentView,以确保弹窗和提示框正常显示。

延伸问答

在 Electron 34.x 中,webview 的 window.open() 方法为什么无法正常工作?

在 Electron 34.x 中,webview 的 window.open() 方法无法正常工作是因为它无法拦截 iframe 中的 window.open() 行为。

如何重写 Electron 中 webview 的 window.open() 方法?

可以通过渲染层注入或主进程注入的方式重写 window.open() 方法,以便在 webview 中生效。

使用 contents.setWindowOpenHandler() 方法有什么限制?

contents.setWindowOpenHandler() 方法无法拦截 iframe 中的 window.open() 行为,因此在这种情况下无效。

将 webview 替换为 WebContentView 有什么影响?

将 webview 替换为 WebContentView 可能会遮挡其他元素,导致弹窗和提示框无法正常显示。

目前解决 webview 中 window.open() 问题的方案是什么?

当前方案是监控页面元素变化,动态显示或隐藏 WebContentView,以确保弹窗和提示框正常显示。

在 Electron 中使用 webview 和 WebContentView 有哪些优缺点?

webview 和 WebContentView 各有优缺点,选择取决于具体的交互需求和显示效果。

➡️

继续阅读