"Дані" політики безпеки вмісту не працюють для базових зображень64 в Chrome 28

247

У цьому простому прикладі я намагаюся встановити заголовок CSP з заголовком мета http-equiv. Я включив зображення base64, і я намагаюся змусити Chrome завантажити зображення.

Я думав, що це dataмає зробити ключове слово, але якимось чином не працює.

Я просто отримую таку помилку в Інструментах для розробників:

Відмовився, щоб завантажити дані ': зображення / PNG; base64, R0lGODlhDwAPAOZEAMkJCfAwMMYGBtZMTP75 + euIiPFBP + hVVf3v7 ... nw7yk4Mjr6GLUY + joiBI2QAACABwJDCHgoKOHEoAYVBAgY8GGAxAoNGAmiwMHBCgccKDAKBAA7' зображень, тому що він порушує такі директиви Content Security Policy: "IMG-Src 'самість' дані".

Приклад коду (JSFiddle не працює для цього прикладу, тому що я не можу встановити мета-заголовок там):

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

Ви також можете відкрити цей приклад тут:
https://dl.dropboxusercontent.com/u/638360/ps/csp.html

content-security-policy

— fwebdev
джерело

Відповіді:

468

Відповідно до граматики у специфікації CSP , вам потрібно вказати схеми як scheme:, а не просто scheme. Отже, вам потрібно змінити директиву джерела зображення на:

img-src 'self' data:;

— Панг
джерело

Причиною цієї незграбності є те, що інакше важко розрізнити схему "дані" та хост із назвою "дані".

— Майк Вест

Я думаю, що URL-адреси взагалі трохи незручно розбирати.

У мене були свої дані: у цитатах - "дані:" - які також не спрацьовують - і ваша відповідь також насторожила мене про це як про проблему

— kris

Корисно зауважити, що ви не повинні просто додавати це, не враховуючи наслідків для безпеки. Дивіться це запитання щодо обміну

— стеками

Сканери безпеки знаходять дані: як незахищений елемент

— Sajithd

Спробуйте це

дані для завантаження:

<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'><path fill='#343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/></svg>

отримати конвертор utf8 до base64 та перетворити рядок "svg" у:

PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA0IDUn
PjxwYXRoIGZpbGw9JyMzNDNhNDAnIGQ9J00yIDBMMCAyaDR6bTAgNUwwIDNoNHonLz48L3N2Zz4=

і ДСП є

img-src data: image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA0IDUn
PjxwYXRoIGZpbGw9JyMzNDNhNDAnIGQ9J00yIDBMMCAyaDR6bTAgNUwwIDNoNHonLz48L3N2Zz4=

— JamesH
джерело

Я не вважаю можливим включити тип після протоколу. Дійсні лише "data:".

— rameezk