Question

我有一个非常简单的webextension，当点击一个按钮时，它应该在新窗口中打开一个本地页面：

function openMyPage() {
    var popupURL = chrome.extension.getURL("my-page.html");

    chrome.windows.create({
      url: popupURL,
      type: "popup",
      height: 200,
      width: 200
    });
}

chrome.browserAction.onClicked.addListener(openMyPage);

在my-page.html里面我想运行一些javascript，但我无法让它工作。即使是简单的脚本也不会执行：

<html>
   <body>
     <script type="text/javascript">
        document.write("JS executed")
     </script>
   </body>
</html>

打开页面的网址类似于moz-extension://8974747a-3aa7-4654-93e5-ad60d3de0cc5/my-page.html。我已经尝试过禁用NoScript这样的插件，但无济于事。

如何在此页面上执行JS？我究竟做错了什么？谢谢你的帮助。

根据请求编辑：manifest.json：

{

  "description": "Adds browser action icon to toolbar to open packaged web page. See https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Examples#open-my-page-button",
  "manifest_version": 2,
  "name": "open-my-page",
  "version": "1.0",
  "homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/open-my-page-button",
  "icons": {
    "48": "icons/page-48.png"
  },

  "applications": {
    "gecko": {
      "id": "open-my-page-button@mozilla.org",
      "strict_min_version": "45.0"
    }
  },

  "background": {
    "scripts": ["background.js"]
  },

  "browser_action": {
    "default_icon": "icons/page-32.png"
  }

}

它直接取自Mozilla的一个例子。

Answer 1

内联脚本无法使用默认内容安全策略

您可能正在遇到Default Content Security Policy：

"script-src 'self'; object-src 'self';"

这意味着Inline JavaScript won't run。换句话说，HTML中不允许使用以下内容：

<script type="text/javascript"> document.write("JS executed")</script>

或

<script>console.log("foo");</script>

或

<div onclick="console.log('click')">Click me!</div>

正常解决方案：
通常的解决方案是将所有JavaScript移动到一个或多个单独的文件中，并将它们包含在以下内容中：

<script type="text/javascript" src="my-page.js"></script>

使用内联脚本：
如果您希望使用内联脚本，可以使用content_security_policy文件中的manifest.json键。但是，您需要提供＆＃34; hash of the script in the "script-src" directive.＆＃34;

除非出于某种原因，你真的需要使用内联脚本，否则你可能会发现很多更容易将所有脚本内容移动到外部文件而不是包括与HTML内联的脚本（这需要您为脚本的任何更改重新计算哈希值）。

在Firefox 48中实现：
此内容安全政策为implemented in Firefox 48。关于Firefox 48的博客文章肯定会提到：

请注意：对于未遵守此CSP的任何Firefox WebExtensions，这将是向后不兼容的更改。不需要更新不符合CSP的现有WebExtensions。

您的具体案例：

如果您将脚本更改为（创建哈希时的空白计数），它将起作用：

<script type="text/javascript">document.write("JS executed");</script>

然后，将以下行添加到 manifest.json ：

"content_security_policy": "script-src 'self' 'sha256-Z4nYjltJ/RciFs77n2n91dzwoz1Qg/1JFwU5ODwWPC8='; object-src 'self';"

Javascript无法在本地页面上运行

1 个答案:

内联脚本无法使用默认内容安全策略

您的具体案例：