2013-08-26 7 views
123

In questo semplice esempio, sto cercando di impostare un'intestazione CSP con l'intestazione meta http-equiv. Ho incluso un'immagine base64 e sto cercando di fare in modo che Chrome carichi l'immagine.Criteri di protezione dei contenuti "dati" non funzionanti per immagini base64 in Chrome 28

Ho pensato che la parola chiave data dovrebbe farlo, ma in qualche modo non funziona.

ottengo solo il seguente errore in Strumenti di sviluppo:

Rifiutato di caricare l'immagine 'di dati: image/png; Base64, R0lGODlhDwAPAOZEAMkJCfAwMMYGBtZMTP75 + euIiPFBP + hVVf3v7 ... nw7yk4Mjr6GLUY + joiBI2QAACABwJDCHgoKOHEoAYVBAgY8GGAxAoNGAmiwMHBCgccKDAKBAA7' perché viola il seguente contenuto Direttiva sulla politica di sicurezza: "img-src" self "data".

Il codice di esempio (JSFiddle non funziona per questo esempio perché non riesco a impostare meta intestazione lì):

<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> 

È anche possibile aprire questo esempio qui:
https://dl.dropboxusercontent.com/u/638360/ps/csp.html

risposta

262

Secondo the grammar in the CSP spec, è necessario specificare gli schemi come scheme:, non solo scheme. Quindi, è necessario modificare la direttiva fonte immagine da:

img-src 'self' data:; 
+19

La ragione di questo imbarazzo è che è altrimenti difficile distinguere tra il regime 'dei dati', e un host chiamato 'data'. –

+1

Penso che gli URL siano un po 'scomodi da analizzare in generale. –

+2

Ho avuto i miei dati: tra virgolette - "data:" - anche questo non funziona - e la tua risposta mi ha anche avvertito come un problema – kris

Problemi correlati