Кордова - отказывается выполнять обработчик события inline, поскольку он нарушает следующий контент. Политика безопасности
Я тренируюсь для разработки приложений cordova, и я оборачиваю проблему с политикой безопасности контента.
Мое приложение работает с эмулятором Android, но когда мне нужно выполнить javascript, я получаю сообщение в netbeans (окне вывода).
Refused to execute inline event handler because it violates the following Content Security Policy directive: "script-src 'self' https://ssl.gstatic.com". (22:35:56:126 | error, security)
at www/index.html:58
Мой код ниже. Это мой index.html.
Я пытаюсь понять, как работает CSP, и я думаю, что понимаю концепцию, но в этом случае я не понимаю проблему. Строка 58 - комментарий.
<html>
<head>
<meta http-equiv="Content-Security-Policy" content="default-src 'self' * data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self'; script-src 'self' https://ssl.gstatic.com; media-src *">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<title>Hello World</title>
<link rel="stylesheet" type="text/css" href="css/index.css">
</head>
<body>
<div class="app">
<h1>Apache Cordova</h1>
<div id="deviceready" class="blink">
<p class="event listening">Connecting to Device</p>
<p class="event received">Device is Ready</p>
</div>
</div>
<!--
line 58
-->
<button onclick="capturePhoto();">Capture Photo</button> <br>
<img style="display:none;width:80px;height:80px;" id="smallImage" src="" />
<img style="display:none;" id="largeImage" src="" />
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
</body>
</html>
Спасибо за помощь, потому что мне это нужно.
Жером
Ответы
Ответ 1
Отметьте эту ссылку она говорит:
Встроенный JavaScript не будет выполнен. Это ограничение запрещает как встроенные <script>
блоки, так и встроенные обработчики событий (e.g. button onclick="...")
.
Чтобы избежать проблем с межсайтовыми сценариями, как указано ниже,
one.app#/home:1 Refused to execute inline event handler because it violates the following Content
Security Policy directive: "script-src 'self' 'nonce-d452460d-e219-a6e5-5709-c8af6ca82889'
chrome-extension: 'unsafe-inline' 'unsafe-eval' https://sfdc.azureedge.net
*.na34.visual.force.com https://ssl.gstatic.com/accessibility/". Note that 'unsafe-inline'
is ignored if either a hash or nonce value is present in the source list.
Перейдите для event listener functions
вместо onclick='myFun()"
.
<body onload="main();">
<button onclick="clickHandler(this)">
Click for awesomeness!
</button>
</body>
<script>
function clickHandler(element) {
// On click Code
}
function main() {
// Initialization work goes here.
}
</script>
Чтобы работать с новым браузером, вам нужно написать свой код с четким разделением содержимого и поведения.
<body>
<button>Click for awesomeness!</button>
</body>
<script src="popup.js"></script>
<!-- popup.js -->
document.addEventListener('DOMContentLoaded', function () {
document.querySelector('button').addEventListener('click', clickHandler);
main();
});
function clickHandler(element) {
// On click Code
}
function main() {
// Initialization work goes here.
}
<!-- popup.js -->
Ответ 2
, когда я проверяю элемент в консоли... это была ошибка
Отказался от выполнения обработчика inline-события, поскольку он нарушает следующую директиву политики безопасности контента: "default-src" self 'data: gap: https://ssl.gstatic.com' небезопасно- Eval ". Для включения встроенного выполнения требуется либо ключевое слово" небезопасное-встроенное ", либо хэш (" sha256 -... "), либо nonce (" nonce -..."). Также обратите внимание, что 'script -src' явно не задан, поэтому в качестве резервной копии используется 'default-src'.
Внутренний код считается вредоносным
Должно быть ясно, что CSP (Политика безопасности контента) основана на источниках whitelist, так как это однозначный способ дать браузеру возможность рассматривать конкретные наборы ресурсов как приемлемые и отклонить остальные. Однако исходный белый список не устраняет самую большую угрозу, создаваемую атаками XSS: inline script injection. Если злоумышленник может вставить тег script, который содержит только вредоносную полезную нагрузку (sendMyDataToEvilDotCom();), браузер не имеет механизма, чтобы отличить его от законного встроенного тега script. CSP решает эту проблему, полностью запрещая встроенный script: это единственный способ убедиться.
Этот запрет включает не только скрипты, встроенные непосредственно в теги script, но также встроенные обработчики событий и javascript: URL. Вам нужно переместить содержимое тэгов script во внешний файл и заменить javascript: URL-адреса и соответствующие вызовы addEventListener. Например, мы можем переписать следующее:
<script>
function doAmazingThings() {
alert('YOU AM AMAZING!');
}
</script>
<button onclick='doAmazingThings();'>Am I amazing?</button>
Что-то большее:
amazing.html:
<script src='amazing.js'></script>
<button id='amazing'>Am I amazing?</button>
amazing.js:
function doAmazingThings() {
alert('YOU AM AMAZING!');
}
document.addEventListener('DOMContentReady', function () {
document.getElementById('amazing')
.addEventListener('click', doAmazingThings);
});
Справочник по политике безопасности контента
Основной проблемой, используемой атаками XSS, является неспособность браузеров различать script, предназначенные для участия в вашем приложении, а script, которые были злоупотребительны третьей стороной
Политика распространяется на широкий спектр ресурсов
base-uri ограничивает URL-адреса, которые могут отображаться в базовом элементе страницы.
child-src перечисляет URL-адреса для рабочих и содержимое встроенного фрейма. Например: child-src https://youtube.com позволит встраивать видео с YouTube, но не из других источников. Используйте это вместо устаревшей директивы frame-src.
connect-src ограничивает происхождение, к которому вы можете подключиться (через XHR, WebSockets и EventSource).
font-src определяет источник, который может обслуживать веб-шрифты. Гуглские веб-шрифты можно включить с помощью font-src https://themes.googleusercontent.com
form-action перечисляет допустимые конечные точки для отправки из тегов.
frame-ancestors определяет источники, которые могут вставлять текущую страницу. Эта директива применяется к фрейму, iframe, embed и тегам апплета. Эта директива не может использоваться в метатегах и применяется только к не-HTML-ресурсам.
frame-src устарел. Вместо этого используйте child-src.
img-src определяет происхождение, из которого могут быть загружены изображения.
media-src ограничивает исход, разрешенный для доставки видео и аудио.
object-src позволяет управлять Flash и другими плагинами.
типы плагинов ограничивают типы плагинов, которые может вызывать страница.
report-uri указывает URL-адрес, по которому браузер отправляет отчеты при нарушении политики безопасности содержимого. Эта директива не может использоваться в тегах.
style-src - это script -srcs аналог для таблиц стилей.
upgrade-insecure-requests Указывает пользовательским агентам переписывать схемы URL, изменяя HTTP на HTTPS. Эта директива предназначена для веб-сайтов с большим количеством старых URL-адресов, которые необходимо переписать.
В исходном списке также принимаются четыре ключевых слова:
'none', как вы могли ожидать, ничего не соответствует.
'self' соответствует текущему началу, но не его поддоменам.
'unsafe-inline' позволяет встроить JavaScript и CSS
'небезопасно-eval' позволяет использовать механизмы text-to-JavaScript, такие как eval
Ответ 3
Попробуйте добавить 'img-src *' в тег Content-Security-Policy:
https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' "Небезопасные-рядный"; media-src *; img-src *" >