コンテンツセキュリティポリシーの警告

私はCSPを初めて使用しているため、エラーが発生している可能性があります。メニュードロップダウンのための小さなスクリプトがありますが、メニューボタンをクリックして起動すると、コンソールに警告が表示されます。メニューはそれが想定しているスクリプトを実行しますが、なぜエラーが発生しているのかわかりません。コンテンツセキュリティポリシーの警告

これは私の<body>内のすべてのHTMLです：、

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を使用して設定します：

<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ですべてです

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"

ページは、コンソールにエラーなしで正常にロードされます。しかし、メニューをクリックすると、このコンソールエラーが表示されます。

「script-src 'self' https://ajax.googleapis.com」というコンテンツセキュリティポリシーの指令に違反しているため、JavaScript URLの実行を拒否しました。インライン実行を有効にするには、 'unsafe-inline'キーワード、ハッシュ（ 'sha256 -...'）、またはnonce（ 'nonce -...'）のいずれかが必要です。

誰かが驚くべき光を当てることができたら、あなたはここにアクションでページを見ることができます：

https://booster.mikeharrisondesign.com

出典

2017-04-13 Mike Harrison