如何在 WebView 中永久覆盖 JS DOM API？

Posted 2023-02-23

【中文标题】如何在 WebView 中永久覆盖 JS DOM API？

【英文标题】：How to permanently override JS DOM API in WebView?

【发布时间】：2018-04-30 15:59:39

【问题描述】：

假设我正在构建一个新的 Web 浏览器，但想拦截对某些 JS 函数的调用，例如 window.fetch() 和 XMLHttpRequest 和 postMessage，以防止域中的某个 iframe 进出信息。

如果我只是简单地覆盖这些对象，后面的JS代码就不能简单地调用delete window.fetch来删除我的覆盖吗？有没有办法在现代移动浏览器中冻结对象或属性以防止这种情况发生，或者使用本机代码拦截调用？

在 android Chrome 上，似乎有一种本地方式可以做到这一点：https://www.codevog.com/blog/2015-03-09-webview-interactions-with-javascript

如何在 Android 和 ios 中做到这一点？

PS：我知道我可以拦截请求，但是如何拦截像 postMessage 这样的函数调用？

【参考方案1】：

我不会建议这个，但你可以试试猴子补丁：

XMLHttpRequest = (function(xhtp)
    //do something with xhtp
    //someAPI(xhtp)...
    return null;//or whatever you want
)(XMLHttpRequest);

我只是临时写了这篇文章。您需要确保该对象的所有入口点都像上面一样修补。在 iief 中将其传递给您的 API。 Twitter 为 console.log 执行此操作，它们可能返回一个空函数

【讨论】：

但是 delete 关键字只会删除它。

使用猴子补丁是有原因的。删除会删除吗？是的，也许您想在此之前使用它，或者甚至修改除删除之外的行为，以便在其他人调用它时通知您的窗口。顺便说一句，没有任何东西可以展示您想要实现的案例。那是什么？阻止域中的 iframe 访问您的窗口？为什么不使用 x-frame-origin 标头等？对于发布消息，如果您无法控制 iframe，则无法对其进行修改，但 API 始终允许您使用 event.origin 控制要关注的消息。

我想覆盖一个属性并防止 delete 关键字撤消它并使用以前存在的属性或方法。

window.originalObject = a:2 window.originalObject = (function(originalObject) Object.defineProperty( window, "originalObject", enumerable:false, configurable:false, get:function() return originalObject; ); return window.originalObject; )(window.originalObject) 还可以考虑在现代浏览器中使用 Object.freeze 和 Object.seal。更改 getter 函数以使其行为随心所欲

在这里使用 IIFE 有什么意义？它可以防止删除关键字？