Javascript 拒绝执行内联事件处理程序，因为它违反了 CSP。(沙盒)
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/36324333/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Refused to execute inline event handler because it violates CSP. (SANDBOX)
提问by JC Borlagdan
I'm developing a google chrome packagedapp, when I put Sandbox in the manifest.json:
我正在开发一个谷歌浏览器打包的应用程序，当我把沙箱放在manifest.json：
{
"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"]
}
}
}
An onclickevent on my anchor tag works, and the flow of the app is complete EXCEPT THAT, icons from a CSS stylesheet don't load.
onclick我的锚标记上的事件有效，应用程序的流程是完整的，除了 CSS 样式表中的图标不会加载。
I got an errorfrom the console that
我error从控制台得到一个
File not found,
File not found,
but those are just fontsso it's fine with me,
但这些只是字体，所以我没问题，
The big problem is that, the video in the iframe doesn't play and I got additional error prior to the Font which are:
最大的问题是，iframe 中的视频无法播放，而且我在 Font 之前遇到了额外的错误，它们是：
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-...
VIDEOJS：错误：（代码：4 MEDIA_ERR_SRC_NOT_SUPPORTED）无法加载媒体，原因可能是服务器或网络出现故障，或者格式不受支持。
不允许加载本地资源：blob:null/b818b32c-b762-4bd9-...
When I remove the sandbox in the manifest.json file, everything is good no errors in the console about the font,
当我删除 manifest.json 文件中的沙箱时，一切都很好，控制台中没有关于字体的错误，
BUT when I hit/click my anchor tagthat has a click event to load a new function in the js I'm getting the following Console Error:
但是，当我点击/单击具有单击事件的锚标记以在 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.
拒绝执行内联事件处理程序，因为它违反了以下内容安全策略指令：“default-src 'self' blob: filesystem: chrome-extension-resource:”。启用内联执行需要“unsafe-inline”关键字、哈希（“sha256-...”）或随机数（“nonce-...”）。还要注意 'script-src' 没有明确设置，所以 'default-src' 用作后备。
Sorry for the very long detail,
很抱歉很长的细节，
I just need help with this because I'm stuck here for 3 days already.
我只是需要这方面的帮助，因为我已经被困在这里 3 天了。
回答by kailniris
Answer for your non sandbox related question:
回答您的非沙盒相关问题：
You have something in your code like this:
你的代码中有这样的东西：
<button onclick="myFunction()">Click me</button>
In a nutshell this is not allowed in chrome apps and extensions.
简而言之，这在 chrome 应用程序和扩展程序中是不允许的。
Change this to the following and it will work:
将其更改为以下内容，它将起作用：
html:
<button id="myButton">Click me</button> <script src="script.js"></script>script.js:
document.getElementById("myButton").addEventListener("click", myFunction); function myFunction(){ console.log('asd'); }
html：
<button id="myButton">Click me</button> <script src="script.js"></script>脚本.js：
document.getElementById("myButton").addEventListener("click", myFunction); function myFunction(){ console.log('asd'); }
Long story:
很长的故事：
In chrome apps, Content Security Policy does not allow inline javascript. So you have to put your javascript in a .js file and include it in your HTML.
在 chrome 应用程序中，内容安全策略不允许内联 javascript。所以你必须把你的 javascript 放在一个 .js 文件中，并将它包含在你的 HTML 中。
Further reading: https://developer.chrome.com/extensions/contentSecurityPolicy
进一步阅读：https: //developer.chrome.com/extensions/contentSecurityPolicy
