Google analytics.js и политика безопасности контента

У меня есть веб-приложение, использующее стандартную политику безопасности содержимого html5boilerplate.

Однако у нас есть новый фрагмент Google analytics.js на странице, который блокируется CSP.

Я пытаюсь найти пример структуры CSP и JS include, которая позволит Google analytics.js, но не повезло.

Ближайшая почта SO заголовок Google Analytics и Content-Security-Policy, но используется более старый ga.js.

К сожалению, Документы Google не упоминают CSP.

Я пришел к следующему решению:

Внизу моего html файла:

<script type="text/javascript" src="/js/analytics.js"></script>

Содержимое analytics.js:

(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function()
{ (i[r].q=i[r].q||[]).push(arguments)}
,i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;        m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-XXXXXXXX-1', 'auto');
ga('send', 'pageview');

.htaccess CSP:

Header set Content-Security-Policy "script-src 'self' https://ssl.google-analytics.com http://www.google-analytics.com; object-src 'self'"

Это работает, но я не уверен, что я сломал асинхронный характер кода GA или вызвал некоторые другие непредвиденные последствия.

Может ли кто-нибудь сообщить правильный способ разрешить Google analytics.js с помощью политики безопасности контента?

Автор Edit: В конце я использовал решение, подробно описанное в заголовке Google Analytics и Content-Security-Policy, возвращаясь к ga.js. Но я все равно хотел бы знать, можно ли использовать analytics.js таким же образом.

Автор Редактировать 2: Похоже, что это возможно, используя analytics.js прямо из Google и те же принципы, что и другая публикация SO:

Нижняя часть файла HTML:

<script type="text/javascript" src="https://ssl.google-analytics.com/analytics.js"></script>
<script type="text/javascript" src="/js/analytics.js"></script>

Содержание analytics.js:

ga('create', 'UA-XXXX-Y', 'auto');
ga('send', 'pageview');

СНТ:

Header set Content-Security-Policy "script-src 'self' https://www.google-analytics.com https://ssl.google-analytics.com; object-src 'self'"

Это непроверено - я не проверял, получает ли Google Analytics данные, но нет никаких ошибок консоли или CSP. Пальцы пересекли.

Ответ 1

Кажется, у вас есть настройки заголовков CSP в вашем веб-приложении, где домены Google Analytics еще не отмечены белым цветом. Все запросы, которые клиент делает для внешних доменов, должны быть явно белыми. (Это хорошая ссылка: https://hacks.mozilla.org/2016/02/implementing-content-security-policy/).

Ошибки CSP, которые вы видите в консоли браузера, достаточно подробны для описания того, что должно быть белого цвета в вашем заголовке CSP.

Например, для этого случая

Отказано, чтобы загрузить изображение https://www.google.co.in/... ', потому что оно нарушает следующую директиву политики безопасности содержимого: "img-src".

это решит ошибку:

img-src https://www.google.co.in <other-domains>

Ответ 2

Использование альтернативного способа, описанного в https://developers.google.com/analytics/devguides/collection/analyticsjs/, помогло. Это очень похоже на OP, описанный во втором редактировании, вы можете использовать пользовательский встроенный script, который вы применяете для включения nonce или передаете внешний контент inline script в отдельный script, например OP. Не забывайте атрибут async в теге script, который ссылается на analytics.js.

Используя этот метод, ошибок и предупреждений не будет, поскольку никакие скрипты не будут добавлены в ваш html.

Вот ссылка на ссылку, которую я разместил:

Альтернативный фрагмент отслеживания aync

Хотя описанный выше фрагмент отслеживания JavaScript обеспечивает script будет загружаться и выполняться асинхронно во всех браузерах, он имеет тот недостаток, что не позволяет современным браузерам предварительно загружать script.

Альтернативный фрагмент отслеживания асинхронного отслеживания ниже добавляет поддержку для предварительной загрузки, что обеспечит небольшой рост производительности на современных браузеров, но может деградировать до синхронной загрузки и выполнения на IE 9 и более старые мобильные браузеры, которые не распознают async scriptатрибут. Используйте этот фрагмент отслеживания только в том случае, если ваши посетители в первую очередь используйте современные браузеры для доступа к вашему сайту.

<!-- Google Analytics -->
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<script async src='https://www.google-analytics.com/analytics.js'></script>
<!-- End Google Analytics -->

Ответ 3

ваше решение .htaccess должно быть правильным.

почему вы должны остановить асинхронный характер (clientide)?

в консоли браузера вы увидите, какие запросы заблокировать хосты, если есть какой-либо заблокированный запрос от gugl во время просмотра страницы, вы можете добавить имя хоста в свою политику