2013-08-26 10 views
123

W tym prostym przykładzie próbuję ustawić nagłówek CSP z nagłówkiem meta http-equiv. Zawarłem zdjęcie base64 i próbuję sprawić, by Chrome wczytał obraz.Zasady bezpieczeństwa "dane" nie działają dla base64 Obrazy w Chrome 28

Myślałem, że słowo kluczowe data powinno to zrobić, , ale jakoś nie działa.

Właśnie pojawia się następujący błąd w menu Narzędzia programu:

Odmówił załadować obraz 'data: image/png; base64, R0lGODlhDwAPAOZEAMkJCfAwMMYGBtZMTP75 + euIiPFBP + hVVf3v7 ... nw7yk4Mjr6GLUY + joiBI2QAACABwJDCHgoKOHEoAYVBAgY8GGAxAoNGAmiwMHBCgccKDAKBAA7', ponieważ narusza następującej treści Dyrektywa w sprawie polityki bezpieczeństwa: "img-src" self "data".

Przykładowy kod (JSFiddle nie działa na tym przykładzie, bo nie można ustawić meta nagłówek tam):

<html> 
<head> 
<meta http-equiv="Content-Security-Policy" content=" 
     default-src 'none'; 
     style-src 'self' 'unsafe-inline'; 
     img-src 'self' data; 
     " /> 
    <style> 
     #helloCSP { 
      width: 50px; 
      height: 50px; 
      background: url(data:image/png;base64,R0lGODlhDwAPAOZEAMkJCfAwMMYGBtZMTP75+euIiPFBP+hVVf3v7+iHh/JNTfh9dNUYGPjTvskXFfOLi/daVe96es4eHPWIiOqbi9dNRvzWwexdV9U1NeFSS94iIvuxodVGP/ZsZM8jI+ibm/alluQzMdxSSvbGstwsKu2Yid4iIfjQu/JnYO6djvajlMQEBPvLuOJdXeMxL/3jzPBSTdwqKNY2Mf3i4vU5OfbPz/3f3/zUv/zizO0tLc0NDfMzM+UlJekpKeEhId0dHdUVFdkZGdEREf///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAEQALAAAAAAPAA8AAAepgESCRBsLEDQQCxuDgxYdO5CROx0WgywGAQEKM0M2CpkGN0QvMDmmE0OpE6Y5KEQqPbE9D6lDD7I9IBc8vDwRtRG9PBcuPsY+B7UHxz4hP8/PGghDCBrQPyYxQdvbBUMF3NskGUDl5QwtDOblGSVC7+8JNQnw7yk4Mjr6GLUY+joiBI2QAACABwJDCHgoKOHEoAYVBAgY8GGAxAoNGAmiwMHBCgccKDAKBAA7) no-repeat; 
      border: 1px solid red; 
     } 
    </style> 
</head> 
<body> 
<h1>CSP</h1> 
    <div id="helloCSP"></div> 
</body> 
</html> 

Można również otworzyć ten przykład tutaj:
https://dl.dropboxusercontent.com/u/638360/ps/csp.html

Odpowiedz

262

Według the grammar in the CSP spec, należy określić schematy jako scheme:, a nie tylko scheme. Tak więc, musisz zmienić dyrektywę źródła obrazu na:

img-src 'self' data:; 
+19

Powodem tej niezręczności jest to, że inaczej trudno jest odróżnić schemat "danych" od hosta o nazwie "dane". –

+1

Uważam, że adresy URL są generalnie niezręczne w analizie. –

+2

Posiadałem swoje dane: w cudzysłowach - "data:" - to również nie działa - i twoja odpowiedź również ostrzegła mnie, że jako problem – kris

Powiązane problemy