如何将 javascript 注入 Chrome 应用程序的 DOM

Question

我正在开发一个 chrome 应用程序，它可以用作基于 Cylon project 的 Arduino 代码编辑器。生成一个 js 脚本（我们称之为output.js），其中结合了 LED 切换逻辑或我们希望使用 arduino 实现的任何其他内容，并使用 browserify 将其与其他节点依赖项一起编译。在他们的chrome extension example 中，他们在index.html 中静态引用了这个脚本。

因为，我正在开发一个允许用户编写任意代码以在 arduino 上工作的编辑器，我正在动态生成 output.js 的内容。我已经到了可以成功生成output.js 的内容的地步，并且我编写了一个函数，将该数据注入script 标记。但是，谷歌浏览器会抛出一个错误：

Refused to execute inline script because it violates the following Content Security Policy directive: 
"default-src 'self' blob: filesystem: chrome-extension-resource:". 
Either the 'unsafe-inline' keyword, a hash ('sha256-Mugizlz7AFKJ2hm6UA9ySY/31cKCVhLaEX9/QYpJIsk='), 
or a nonce ('nonce-...') is required to enable inline execution. 
Note also that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

所以，我意识到我需要执行内联 javascript，这可能是一个潜在的安全漏洞。我知道content scripts 专门设计用于将自定义 JS 或 CSS 注入网页，但它们在网站或网址的上下文中工作。

我想修改 dom 并在独立的 chrome 应用程序中注入自定义 JS，而不是在某些网站或标签的上下文中工作的 chrome 扩展。从我对这个主题所做的任何小研究来看，我猜内容脚本对于 chrome 应用程序来说不是一个有效的概念。然后如何将 javascript 注入 DOM 以用于 chrome 应用程序。在这种情况下，我有哪些可能的内容脚本替代方案？

Answer 1

创建一个manifest.json 文件可能会有所帮助，其中包含错误消息中的哈希值。

例如，您的manifest.json 可能如下所示：

{
  "manifest_version": 2,
  "name": "arduino editor",
  "version": "1.0.0",
  "minimum_chrome_version": "46",
  "content_security_policy": "script-src 'self' 'sha256-Mugizlz7AFKJ2hm6UA9ySY/31cKCVhLaEX9/QYpJIsk='",
  "background": {
    "page": "background.html"
  }
}

有关更多详细信息，请参阅以下帖子。

Chrome Extension - Content Security Policy - executing inline code