在我看來,iframe內容中的Content-Security-Policy元標記可防止在我的主頁中加載動態圖像。此問題僅限於Firefox(56版本)。這裏是例子:firefox中的CSP頭iframes在動態內容的整個頁面上工作
的test.html
</html>
<head></head>
<body>
<form>
<input type="button" id="btn" value="GO" />
</form>
<script type="text/javascript">
document.getElementById('btn').onclick = function() {
src = 'https://www.google.ru/logos/doodles/2017/fridtjof-nansens-156th-birthday-5694774550986752-s.png',
img = document.createElement('img');
img.src = src;
document.body.appendChild(img);
}
</script>
<img src="https://www.google.ru/logos/doodles/2017/fridtjof-nansens-156th-birthday-5694774550986752-s.png"/>
<iframe src="iframe.html"></iframe>
</body>
</html>
Iframe.html的
<html>
<head>
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; img-src 'self' data:; script-src 'self' *.jquery.com 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline'; font-src 'self' data:;"></meta>
</head>
<body style="font-family: Arial; font-size: 13px;">
<br>
</body>
</html>
點擊任何其他瀏覽器 「GO」 按鈕後,你可以看到被添加到頁面圖像,但在Firefox沒有任何反應,並出現一個控制檯錯誤,說:
內容安全策略:該頁面的設置阻止了負載 資源 https://www.google.ru/logos/doodles/2017/fridtjof-nansens-156th-birthday-5694774550986752-s.png (「img-src file:// data:」)。
這是一個錯誤嗎?有什麼解決方法嗎?提前致謝。