如何在Chrome扩展程序中获取远程javascript文件

How to get remote javascript file in Chrome Extension

本文关键字：获取 javascript 文件 程序 Chrome 扩展      更新时间：2023-09-26

我已经阅读了我在stackoverflow和google中可以找到的所有主题，但仍然无法使其正常工作。

我需要的是 - 将我的 JS 代码保存在服务器上的脚本中，这样我就不需要每次决定进行更改时都重新发布扩展。用户也不必升级他们的扩展。

由于新的安全策略而不起作用的方法：

  • 通过将标签添加到注入脚本
  • 从 ajax 请求接收到 Eval（） 脚本源代码后。

正如谷歌所说，有一些方法可以加载远程脚本。

放宽远程脚本的安全策略

他们是这么说的：

允许通过 HTTPS 从 example.com 加载脚本资源的宽松策略定义可能如下所示：

"content_security_policy": "script-src 'self' https://example.com; object-src 'self'"

好的，我按照他们在清单中所说的做了.json：

"content_security_policy": "script-src 'self' https://beta.tradernet.ru; object-src 'self'"

我尝试在后台加载该脚本.html

<head>
<title>My Awesome Backgound page!</title>
<script src="https://beta.tradernet.ru/js/extension-script.js"></script>
<script src="background.js"></script>
</head>

在我的后台.js我测试在远程文件中声明的对象是否可用。而且它们不可用。我什至不确定远程脚本是否已加载...

如果我在我的弹出窗口中添加类似的标签.html，那么它可以工作并且从远程脚本加载的功能可用......

如何使远程 JavaScript 函数在后台可用.js？

我已经让它在我的工作流程代码格式化程序扩展中工作。你的manifest.json很好，你现在需要做的是使用 JavaScript 注入该脚本，像这样的事情应该可以做到：

(function () {
  'use strict';
  var scriptToLoad = document.createElement('script');
  scriptToLoad.type = 'text/javascript';
  scriptToLoad.async = true;
  scriptToLoad.src = 'https://beta.tradernet.ru/js/extension-script.js';
  var s = document.getElementsByTagName('script')[0];
  s.parentNode.insertBefore(scriptToLoad, s);
}());

这允许我访问JS文件中的JavaScript，具有讽刺意味的是，浏览器认为我没有它们，即使执行所有内容都完美无缺。为了绕过浏览器吐出控制台错误，我将所有调用都包装在try/catch块中，我需要的JS。假设您想从extension-script.js呼叫fireWebSockets()，您应该执行以下操作：

(function () {
  'use strict';
  window.addEventListener('load', function () {
    try {
      fireWebSockets(foo);
    } catch (ignore) {}
  });
}());

希望对您有所帮助！

相关文章：