我正在制作一个浏览器扩展,在 Firefox 中加载该插件时遇到此错误:
Content Security Policy: The page’s settings blocked the loading of a resource at self (“script-src”). Source: onclick attribute on SPAN element.index.html
我已经将问题范围缩小到在 html 中调用 javascript 方法时。对于 digitalClock.js 来说这似乎不是问题,只有像 onclick="foo()"这样的东西会给我每次 onclick 带来的错误。
//settings.js
function openNav() {
document.getElementById("mySettings").style.width = "325px";
}
function closeNav() {
document.getElementById("mySettings").style.width = "0";
}
//digitalClock.js is working. The error message occurs even if this is removed.
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="styles/clock.css" />
<link rel="stylesheet" type="text/css" href="styles/settings.css" />
<meta charset="utf-8">
<title>Title</title>
</head>
<span style="font-size:30px;cursor:pointer" onclick="openNav()">☰</span>
<div id="myClock" class="clock">clock</div>
<script src=scripts/digitalClock.js></script>
<script src=scripts/settings.js></script>
</html>
list .json
{
"manifest_version": 2,
"name": "CPS error",
"version": "1.0",
"description": "CPS error",
"icons": {
"48": "icons/border-48.png"
},
"permissions": ["storage", "tabs","geolocation"],
"chrome_settings_overrides": {
"homepage": "public/index.html"
},
"chrome_url_overrides": {
"newtab": "public/index.html"
}
}
如果我删除该行:
<span style="font-size:30px;cursor:pointer" onclick="openNav()">☰</span>
该附加组件将毫无问题地加载。如果我能获得有关此错误消息的帮助,我将不胜感激。
最佳答案
确切的说,你不应该在html中调用javascript方法,而应该将JS逻辑移到JS中。
例如,您可以删除 onclick,将 id="nav"添加到您的范围,然后使用 JS 监听器:
document.getElementById("nav").addEventListener("click", function(){
openNav();
});
这应该会删除警告。
关于javascript - 将 JS 文件与 firefox-addon 一起使用时的内容安全策略问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50405753/