无法通过脚本注入在某些网站上执行 Javascript

Unable to execute Javascript on certain websites via script injection

我试图在页面加载后将 React 脚本注入网站/

我能够在大多数网站上使用它,例如 https://google.com, https://discovercard.com, https://whosebug.com, https://capitalone.com

但是,当我在 https://chase.com or https://bankofamerica.com 中执行相同的脚本时,我在使用 Babel.transform 转换 JSX 时收到一个引用错误,因为 Babel 未定义。

然而,所有必需的脚本都已下载,如网络选项卡和 DOM 中所示。

有人可以让我知道 HTML 中是否有任何特定标记或属性阻止在这些网站上执行 Javascript。似乎银行网站这样做是为了防止外部 Javascript.

这是我在开发者控制台上试过的代码

注意:世界您好! 5 秒后出现,因为 setTimeout

const react = document.createElement("script");
react.src = "https://cdnjs.cloudflare.com/ajax/libs/react/16.2.0/umd/react.production.min.js"
document.body.appendChild(react);

const reactDom = document.createElement("script");
reactDom.src = "https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.2.0/umd/react-dom.production.min.js"
document.body.appendChild(reactDom);

const babel = document.createElement("script");
babel.src = "https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.26.0/babel.min.js"
document.body.appendChild(babel);

const rootDiv = document.createElement("div");
rootDiv.id = "app";
rootDiv.style="width: 100px; height: 100px; position: absolute; top: 0px; left: 0px; z-index: 999999";
document.body.appendChild(rootDiv);

setTimeout(() => {
  const babelScript = document.createElement("script");
  babelScript.type = "text/babel";

  const jsxCode = "ReactDOM.render(<h1>Hello, world!</h1>, document.getElementById('app'));"

  const babelTransformCode = Babel.transform(jsxCode, { presets: ["react"] } ).code;

  eval(babelTransformCode);
}, 5000)

这两个不工作的站点正在使用 requireJs,因此它们不是在 window 上加载模块,而是使用 define.

加载模块

最简单的做法是在您的脚本的其余部分之前调用 define = undefined,它将像在其余站点上一样工作。为了安全起见,UMD 加载程序似乎也会检查导出和 modules.exports,因此您可能也想将它们设置为未定义。

define = undefined;
exports = undefined;
if (window.module) module.exports = undefined;

您使用的库是使用通用模块定义打包在一起的。这样他们就可以使用各种模块加载器,例如 requireJs。 UMD 模式查找由模块加载程序定义的公共变量,因此通过将这些变量设置为未定义,它会导致模块被全局加载并可供您编写的脚本访问。