Подтвердить что ты не робот

Modernizr вызывает ошибки в политике безопасности контента (CSP)

Я пытаюсь использовать новые HTTP-заголовки Content Security Policy (CSP) на тестовом сайте. Когда я использую CSP в сочетании с Modernizr, я получаю ошибки CSP-нарушения. Это политика CSP, которую я использую:

Content-Security-Policy: default-src 'self'; script -src 'self' ajax.googleapis.com ajax.aspnetcdn.com; style-src 'self'; IMG-Src "Я"; font-src 'self'; report-uri/WebResource.axd?cspReport=true

Это ошибки в консоли браузера Chrome:

Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self'". 
Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...') is required to enable inline execution.

window.Modernizr.injectElementWithStyles   - modernizr-2.7.2.js:134
window.Modernizr.tests.touch               - modernizr-2.7.2.js:457(anonymous function)
modernizr-2.7.2.js:949(anonymous function) - modernizr-2.7.2.js:1406

Я обнаружил следующее обходное решение на сайте Github Modernizr. Однако обходной путь был впервые выдвинут в марте и, сделав небольшое Google-Fu, я не могу найти никаких исправлений или обходных решений для этой проблемы.

Я знаю, что могу включить директиву unsafe-inline, которая может обойти эту ошибку, но это также позволяет запускать небезопасный код и в первую очередь сводит на нет использование CSP. У кого-нибудь есть какие-либо решения?

Обновление - что такое CSP

CSP - это HTTP-заголовок, поддерживаемый всеми основными браузерами (Включая Edge). По сути, это белый список содержимого, который браузер может использовать для визуализации страницы. Подробнее здесь или прочитайте документацию Mozilla для CSP здесь и здесь.

Обновление - Справка Выделите CSP

Теперь CSP теперь доступен на всех браузерах (поддержка Edge добавлена, yay!) и ее гигантский скачок вперед в веб-безопасности. Для тех, кто заинтересован в получении дополнительной поддержки сторонних разработчиков для CSP, см. Следующие:

4b9b3361

Ответ 1

Я подозреваю, что нет другого решения, кроме как переписать части Modernizr, которые используют встроенный код или динамически оцениваемый код (который применим как к JS, так и к CSS). Здесь может быть полезен опыт AngularJS ngCsp.

Ответ 2

Я нашел исправление без необходимости использовать небезопасный-встроенный.

Вы можете изменить unminimized Modernizr в одной строке:

fakeBody = body || document.createElement('body');

конвертировать в

fakeBody = document.createElement('body');

работает на IE9, Firefox и Chrome.