javascript - 拒绝执行内联事件处理程序，因为它违反了 CSP。 (沙盒)

Question

当我将 Sandbox 放入 manifest.json 时，我正在开发一个 google chrome packaged 应用程序:

 {
  "manifest_version": 2,
  "name": "WM32216",
  "version": "2.1",
  "minimum_chrome_version": "23",
  "permissions":["webview", "https://ajax.googleapis.com/*"],
  "sandbox":{
      "pages":["index.html"]
  },
  "app": {
    "background": {
      "scripts": ["main.js"]
    }
  }
}

我的 anchor 标记上的 onclick 事件有效，应用程序的流程已完成，除了 CSS 样式表中的图标不会加载。

我从控制台得到了一个错误

找不到文件 ,

但那些只是字体所以我觉得没问题，

最大的问题是，iframe 中的视频无法播放，我在字体之前遇到了额外的错误:

VIDEOJS: ERROR: (CODE:4 MEDIA_ERR_SRC_NOT_SUPPORTED) The media could not be loaded, either because the server or network failed or because the format is not supported.

Not allowed to load local resource: blob:null/b818b32c-b762-4bd9-...

当我删除 manifest.json 文件中的沙箱时，一切都很好，控制台中没有关于字体的错误，

但是当我点击/单击我的 anchor 标记时，它有一个点击事件来在 js 中加载一个新函数，我收到以下控制台错误:

Refused to execute inline event handler 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-...'), 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.

对不起，很长的细节，

我只是需要帮助，因为我已经被困在这里 3 天了。

Answer 1

回答您的非沙盒相关问题:

你的代码中有这样的东西:

<button onclick="myFunction()">Click me</button>

简而言之，这在 Chrome 应用程序和扩展程序中是不允许的。

将其更改为以下内容即可:

• html:

  <button id="myButton">Click me</button>
  <script src="script.js"></script>
  

• 脚本.js:

  document.getElementById("myButton").addEventListener("click", myFunction);
  
  function myFunction(){
    console.log('asd');
  }
  

长话短说:

在 chrome 应用程序中，内容安全策略不允许内联 javascript。因此，您必须将您的 javascript 放在一个 .js 文件中，并将其包含在您的 HTML 中。

进一步阅读:https://developer.chrome.com/extensions/contentSecurityPolicy