我是 CSP 的新手,所以可能会犯错误,但这里是。我有一个用于下拉菜单的小脚本,但是当我单击菜单按钮触发它时,我在控制台中收到警告。菜单按预期运行,因此脚本正在运行,但我不确定为什么会发生错误。
这是我的 <body>
中的所有 HTML :
<div class="responsive-centered-nav">
<a href="javascript:void(0)" class="nav-toggle">Menu</a>
<nav>
<ul>
<li class="nav-item"><a href="#">Home</a></li>
<li class="nav-item"><a href="#">About Us</a></li>
<li class="nav-item"><a href="#">Services</a></li>
<li class="nav-item"><a href="#">Pricing</a></li>
<li class="nav-item"><a href="#">Contact</a></li>
</ul>
</nav>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js"></script>
<script src="/assets/js/main-min.js"></script>
这就是 /assets/js/main-min.js
中的所有内容:
document.addEventListener("DOMContentLoaded", function() {
console.log("DOM fully loaded and parsed");
var html = document.documentElement;
html.classList.remove("no-js");
html.classList.add("js");
if (html.classList.contains("js")) {
console.log("Javascript is enabled");
}
WebFont.load({
google: {
families: ['Merriweather:300,300i,700']
}
});
});
document.addEventListener('DOMContentLoaded', function() {
// Set up some variables
var navigation = document.querySelector('.js div.responsive-centered-nav nav');
var toggleButton = document.querySelector('.js div.responsive-centered-nav a.nav-toggle');
toggleButton.addEventListener('click', function(){
navigation.classList.toggle('visible');
});
});
这是我的 CSP,使用 .htaccess
设置:
Header set Content-Security-Policy: "default-src 'none'; script-src 'self' https://ajax.googleapis.com; connect-src 'self'; img-src 'self'; style-src 'self' https://fonts.googleapis.com; font-src 'self' https://fonts.gstatic.com; frame-ancestors 'none'"
Header set X-Frame-Options: "DENY"
Header set X-XSS-Protection: "1; mode=block"
Header set Strict-Transport-Security "max-age=63072000; includeSubDomains; preload"
页面加载正常,控制台中没有错误。但是当我点击菜单切换时,我得到了这个控制台错误:
拒绝执行 JavaScript URL,因为它违反了以下内容安全策略指令:“script-src 'self' https://ajax.googleapis.com”。启用内联执行需要“不安全内联”关键字、哈希值(“sha256-...”)或随机数(“nonce-...”)。
如果有人能阐明一些观点,那就太棒了。您可以在此处查看正在运行的页面:
最佳答案
href="javascript:void(0)"
您有一个 JavaScript 网址。您的 CSP 禁止这样做。不要那样做。
无论如何,JavaScript URL 都很糟糕。链接应该链接到某处。如果你想要一个除了在点击时触发 JS 之外什么都不做的交互元素:使用按钮。
关于javascript - 内容安全策略警告,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43396465/